Generate Template Files with Ease

GIF created with licecap

generate-template-files is a simple code generator that is independent from any language. All you need is NodeJS installed and you can start generating files.

Personally I was tired of creating boilerplate code for redux/ngrx/vuex. This npm package is not only for JavaScript/Front-end projects. It’s for any project that you need to create common consistent code that you and your team can use. I have a co-worker using it with Wordpress Gutenberg. Ok enough fluff.

Installation

npm install generate-template-files --save-dev

Setup

Usually I create a generate.js file and place it inside a tools directory along side a templates directory.

┣━ package.json
┣━ src
┗━ tools/
   ┣━ generate.js
   ┗━ templates/
      ┣━ __model__Model.ts
      ┗━ __store__Reducer.ts

generate.js

The above script will produce the following options to be selected.

Once an option is selected (Create Redux Store) you will be asked a few more questions:

You can call generate.js directly:

node tools/generate.js

Or add a script to package.json:

{
  ...
  "scripts": {
    "generate": "node ./tools/generate.js"
  }
}
// npm run generate

__store__Reducer.ts

Let’s look at my __store__Reducer.ts below as an example. Notice the Replacer Slots __store__ and __model__ scattered all over. Since I entered defaultCase: '(pascalCase)' above. All the text you enter will become PascalCase by default. If you want a different Case Converter inside your files or folder/file path(s) you can do something like __model__(camelCase).

Full list of Case Converters :

(noCase)        // Lives down BY the River
(camelCase)     // livesDownByTheRiver
(constantCase)  // LIVES_DOWN_BY_THE_RIVER
(dotCase)       // lives.down.by.the.river
(kebabCase)     // lives-down-by-the-river
(lowerCase)     // livesdownbytheriver
(pascalCase)    // LivesDownByTheRiver
(pathCase)      // lives/down/by/the/river
(sentenceCase)  // Lives down by the river
(snakeCase)     // lives_down_by_the_river
(titleCase)     // Lives Down By The River

Compare this file with the next one below to see how the Replacer Slots and the Case Converters work.

SomeThingReducer.ts

In the screenshots above I entered in the following:
__store__ = 'some thing' and __model__ = 'other thing'

That’s it! For more information checkout the project and examples on Github . Oh, give it a star if you like it ;)

npm module: generate-template-files

If you like this article please share it, follow me, read my other articles and/or sign up to Medium with my referral link below. Thanks!

Join Medium with my referral link — Robert S (codeBelt)