Scaffolding for existing frontend projects: casex — a library for matching cases
A journey for more productivity oriented development
I've been thinking about creating a scaffolding tool for existing projects for a while. Something like rails has, such as rails g model user name age:number role:references , but for the frontend, that works well with ReactJS, which I've been working with quite a lot.
To be honest, I'm trying to "railsify" the frontend toolkit so that it can be more productive. Type less, do more. This has been the center of all the libraries I've published in the last two years, such as Premiere and Form-for.
On this post, I'll talk about my most recent library, designed to be one of the steps towards a package of libraries that combined aims to put React development on the fast lane.
casex
All in one function for transforming word casings
The Problem
I wanted to create a command that looks like: generate controller john-doe and this command would create a folder called john-doe , and inside this folder the following files:
- index.js
- john-doe-controller.js
- john-doe-controller.test.js
If you're creating this manually it would be pretty easy to do a .toSpinalCase using some library and just make it work. But that's not what I'm aiming for. Javascript projects tend to have very different patterns among themselves. While some may name files like we did above, others may do JohnDoeController and others john_doe_controller .
This Solution
Creating a tool that only works for one project is definitely not what I'm looking for. So, I want the project to have a set of definitions that can be easily replicated. Let's assume there's a templates folder and inside this folder we'll have another folder called __name__ ; inside of it we'll have:
- index.js
- __na-me__controller.js
- __na-me__controller.js
I think that's simple enough, don't you? If you want to do camelCase instead, you could call them __naMe__Controller.js instead. The same would be true for class names inside the file and anywhere else you want to have names.
Demo
I created a demo to show the most common patterns applied using casex
Repo
The code and documentation are available at https://github.com/pedsmoreira/casex
Conclusion
This library by itself is pretty cool, but I believe it will be even nicer as part of the scaffolding tool that's coming.
I’m Pedro Moreira and I build software for companies and startups. I’m a believer in contributing to the community through Open Source and I’ve created a couple of projects myself. One of them is GitShowcase, a platform that helps developers be awesome at showcasing their talents and find their dream job ❤
Twitter: https://twitter.com/pedsmoreira
GitHub: https://github.com/pedsmoreira
