Create your own Templates

and automate your project creations using custom templates

Why automate this

As a developer you will create multiple projects for clients or for creating a personal project.

After a while you will notice you mostly use a similar project structure and a similar set of dependencies always, which you have to create and and install every time you setup a new project.

For example:

If you work a lot with react you will create your projects with create-react-app or some boilerplate generator or your choice.

After which there will be common packages that you will install like

• Material-ui
• axios
• Ant design
• react-router-dom
• react-spring

or even bootstrap if you’re a psychopath.

You will have a list of common dependencies for most of your projects that you install every time.

I will show to how you can avoid this repetition

Step 1: Installing custom-templates

npm install -g custom-templates

This will install the custom-templates package that we will be using to automate this process, this cli tool currently works only for mac and linux.

Step 2: Settings up your templates folder

Your templates folder will be the folder where you will place all your custom boilerplate code.

$ cd development
$ mkdir templates
$ cd templates

Creating a template

As an example we will make a template using create-react-app with material ui react and react router dom

$ create-react-app mui-react-template
$ cd mui-react-template
// this mui-react-template folder name will also be the name of your template in this folder, ik that was obvious but anyway

Installing dependencies

$ npm install -S @material-ui/core @material-ui/icons react-router-dom

this will install material ui and react router dom in the react app created by create-react-app

Selecting our created templates

As we have installed create-react-app globally by the flag -g

we have access to the ct keyword in the terminal

$ ct

running this will ask you to pick your templates folder in the cli

Step 3: Using the template in the templates folder

This is very similar to how you create a create react app project.

$ ct mypp

running this will prompt you to select a template from the templates folder in our case it will be mui-react-template which once selected will start coping all files from mui-react-template folder in your templates folder to mypp folder.

This will copy all folders other than the node_modules folder, and will install all dependencies in u r new project folder after it is done coping all the files.

To make more templates you can just create new project folders in your template folder with different dependencies for your different type of projects.

Conclusion

Even though in my case i mostly use the templates “high-paying-client-react” and “garbage-client-react” it still beats copy pasting the npm installs from npm, deleting that react logo.svg and the other boilerplate stuff i change anyway.

Contribute

You too can contribute to custom-templates cli on github