Renamer

Overview

Renamer solves a common developer pain point: renaming groups of files that are too many to do by hand but too few to justify writing a custom script. It generates both Bash and PowerShell scripts from a series of visual transformations.

The Challenge

My work as a music producer frequently involves projects where I’m one of many stakeholders in the production process. This leads to exported audio files that need consistent naming - but DAW export naming systems are limited, and spotting a typo after clicking export means waiting for dozens of incorrectly-named files.

Technical Approach

Architecture Decisions

Renamer is a fully client-side React app. Many of its string transformations are state-dependent, so it has a top-level state that computes all the desired transformations and passes them to display components.

It was tempting to offload complexity to a library like Redux, but since the scope of the problem and the app are both constrained, I opted for Flux-like state management without a library.

Shell Script Generation

The generated shell scripts are composed by stringing together atomic transform commands:

• Bash: Uses awk for transformations
• PowerShell: Uses built-in cmdlets

I initially used sed for Bash and regular DOS for Windows, but switched when implementing more complex multipart transformations like ‘replace all’.

Development Infrastructure

This was my first time using create-react-app instead of rolling my own starter package. The sane default Webpack config alone probably saved hours, and the development/testing infrastructure is excellent.

Key Takeaways

• A single top-level state object can get unwieldy when passing props through multiple levels, but it solves the issue of needing certain state changes to trigger other state changes
• Create-react-app does a great job abstracting away framework/build chain cruft
• PowerShell cmdlets are leagues ahead of regular DOS commands - the official Microsoft documentation is clear and helpful

Tech Stack

Technology	Purpose
React	UI framework
Flux pattern	State management
awk	Bash string transformations
PowerShell	Windows script generation
Netlify	Hosting