R3-TS-CLI
Create React applications with server-side rendering using Redux and Router v4. Simple and very fast! This CLI is a Typescript version of module R3-CLI.
Installation
Run the command below, to have the module installed globally:
npm install -g r3-ts-cli
Javascript version
For using Javascript version please access: R3-CLI
Usage
To see commands avaliable, run a single command with argument:
r3-ts-cli --help
To create a new Project, run the command:
r3-ts-cli
or
r3-ts-cli -c my-app
It will create a directory called my-app
inside the current folder.
You will found the initial Project structure:
my-app├── .gitignore├── package.json├── README.md├── node_modules└── src ├── @types ├── app │ │ │ ├── assets │ │ ├── fonts │ │ ├── images │ │ └── styles │ │ │ ├── redux │ │ ├── ducks │ │ │ ├── home │ │ │ │ ├── actions.ts │ │ │ │ ├── index.js │ │ │ │ ├── sagas.js │ │ │ │ └── types.js │ │ │ │ │ │ │ ├── rootReducer.ts │ │ │ ├── rootSagas.ts │ │ │ └── types.ts │ │ │ │ │ ├── store │ │ │ ├── index.ts │ │ │ └── types.ts │ │ │ │ │ └── utils │ │ │ ├── lang │ ├── view │ │ ├── controller │ │ ├── pages │ │ │ ├── home │ │ │ │ ├── __test__ │ │ │ │ ├── HomeStyles.ts │ │ │ │ ├── types.ts │ │ │ │ ├── Home.tsx │ │ │ │ └── HomeContainer.tsx │ │ │ │ │ │ │ └── page-not-found │ │ │ └── PageNotFound.tsx │ │ │ │ │ ├── shared │ │ │ └── SharedComponent.tsx │ │ │ │ │ ├── templates │ │ │ ├── OutStyles.ts │ │ │ ├── In.tsx │ │ │ └── Out.tsx │ │ │ │ │ └── Imports.ts │ │ │ └── mobile (future feature) │ ├── client ├── config ├── server │ ├── excludesExtensions.js │ ├── index.js │ ├── server.js │ └── template.js │ └── utils
Running your new Project
Inside the newly created Project, you need to set a Node version:
Requisite
NVM
To easily switch Node versions for your Project, You can use NVM command:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.1/install.sh | bashsource ~/.bashrcnvm installnvm use
Running
Afterward you can run some built-in commands:
npm start:dev
or
yarn start:dev
Your Project is ready to be accessed. Your can run the command npm ls or yarn ls to view available commands.
Creating a new Route
To create a new route on your Project run the command bellow:
r3-ts-cli --route
A new route and view will automatically be created. It will be created the files:
./src/app/view/page/newView
NewViewStyles.tstype.tsNewView.tsxNewViewContainer.tsx
If you option to create a Redux structure it will be created the files:
./src/app/redux/ducks/newView
actions.tsindex.tssagas.tstypes.ts