ctf-cli v1.8.1

API

Commands

• interactive, i: run the tool in interactive mod, meaning, it will prompt the user to choose a template and a value for each key and in the end will ask if the template should be generated in a folder.
  this command is the most recommended one as it simplified the process for the user a lot.

• create \
  \: One of the commands defined in the ctf folder. options:

  • --load-from
    Load the templates from a specific location \.
  • --entry-point
    Generate the template to a specified location \.
  • --folder, -f \
    \: The name of the folder you want the template to be generated into. If none is supplied the template will be generated to the current working directory.
  • \=\
    \: One of the keys for a specific template
    \: The value you want the key to be replaced with.
• list, ls
  Show the available commands from the current working directory.
• show \
  Show a specific command template files
  options:
  • --show-content
    Also show the full content of the template files.

Getting started

install ctf globally

npm i -g ctf-cli

Create a commands folder in your project root directory

The commands folder should be named ctf and it should contain a folder with each folder representing a different command and inside of that folder, there is the template you wish to create.
The commands available are the commands defined in the ctf folder.
If you have more ctf folders in the current file system hierarchy then all of them will be included with precedence to the nearest ctf folder.
For example:
In our current project root

ctf
├── component
│   ├── index.js
│   ├── {{componentName}}.js
│   └── {{componentName}}.spec.js
└── index
    └── index.js

In our desktop

ctf
├── component
│   ├── index.js
│   ├── {{lol}}.js
│   └── {{wattt}}.spec.js
└── coolFile
    └── coolFile.sh

From the above structure, we will have three commands component (from the project ctf), index (from the project ctf) and coolFile (from the desktop ctf).
Lets look at the content of {{componentName}}.js and {{componentName}}.spec.js. {{componentName}}.js from the current project ctf folder.

import React from 'react'

export const {{componentName}} = (props) => {
  return (
    <div>
      Such a cool component
    </div>
  )
}

{{componentName}}.spec.js

import React from 'react';
import { mount } from 'enzyme';
import { {{componentName}} } from './{{componentName}}';

describe('{{componentName}}', () => {
  it('should have a div', () => {
    const wrapper = mount(
      <{{componentName}} />
    );
   expect(wrapper.find('div').exists()).toBeTruthy()
  });
});

Now let's run the following command somewhere in our project

ctf create component componentName=CoolAFComponent --folder MyCoolComp

A new folder will be created under our current working directory, let's look at what we got.

MyCoolComp
├── CoolAFComponent.js
├── CoolAFComponent.spec.js
└── index.js

CoolAFComponent.js

import React from 'react';

export const CoolAFComponent = props => {
  return <div>Such a cool component</div>;
};

CoolAFComponent.spec.js

import React from 'react';
import { mount } from 'enzyme';
import { CoolAFComponent } from './CoolAFComponent';

describe('CoolAFComponent', () => {
  it('should have a div', () => {
    const wrapper = mount(<CoolAFComponent />);
    expect(wrapper.find('div').exists()).toBeTruthy();
  });
});

This could also be achived using the interactive mode!

How cool is this, right?
As you can see our params got injected to the right places and we created our template with little effort.
Horray!! :sparkles: :fireworks: :sparkler: :sparkles: