DEV Community

Chirag Chandrashekhar
Chirag Chandrashekhar

Posted on

Reactez

#react #javascript #angular

Reactez

A simple React CLI for Component and Page creation.

Getting Started

These instructions will get you a copy of the project up and running on your local machine.

Installation 

npm i -g reactez
Enter fullscreen mode Exit fullscreen mode

Usage

With the new Version of reactez (v1.1.0)
a Generate feature has been added.
It's simple and easy.

Just type 

rez generate
Enter fullscreen mode Exit fullscreen mode

or

rez g
Enter fullscreen mode Exit fullscreen mode

This takes you to an easy-to-use prompt that helps you to generate Components,Pages and implement Axios into your project with ease.

Component generation

Functional Component 

rez component [COMPONENTNAME]
Enter fullscreen mode Exit fullscreen mode

or

rez c [COMPONENTNAME]
Enter fullscreen mode Exit fullscreen mode
  • This command creates a default Functional Component.
  • The component is created at /src/components/.
  • The generated component consists of a .jsx(component file) and a .css(style sheet) files.
  • Generated component comes with a Functional Component boilerplate with the style sheet imported.

Class Component 

rez component [COMPONENTNAME] -c
Enter fullscreen mode Exit fullscreen mode

or

rez c [COMPONENTNAME] -c
Enter fullscreen mode Exit fullscreen mode
  • This command creates a Class Component.
  • The component is created at /src/components/.
  • The generated component consists of a .jsx(component file) and a .css(style sheet) files.
  • Generated component comes with a Class Component boilerplate with the style sheet imported.

Alternate flag: 

rez component [COMPONENTNAME] --class
Enter fullscreen mode Exit fullscreen mode

or

rez c [COMPONENTNAME] --class
Enter fullscreen mode Exit fullscreen mode

Page generation

Functional Component Page 

rez page [PAGENAME]
Enter fullscreen mode Exit fullscreen mode

or

rez p [PAGENAME]
Enter fullscreen mode Exit fullscreen mode
  • This command creates a default Functional Component Page.
  • The component is created at /src/pages/.
  • The generated page consists of a .jsx(component file) and a .css(style sheet) files.
  • Generated page comes with a Functional Component boilerplate with the style sheet imported.

Class Component Page 

rez page [PAGENAME] -c
Enter fullscreen mode Exit fullscreen mode

or

rez p [PAGENAME] -c
Enter fullscreen mode Exit fullscreen mode
  • This command creates a Class Component Page.
  • The component is created at /src/pages/.
  • The generated page consists of a .jsx(component file) and a .css(style sheet) files.
  • Generated page comes with a Class Component boilerplate with the style sheet imported.

Alternate flag: 

rez component [PAGENAME] --class
Enter fullscreen mode Exit fullscreen mode

or

rez c [PAGENAME] --class
Enter fullscreen mode Exit fullscreen mode

Axios Implementation.

With the new update, it's easy to implement axios into your project.

Just type 

rez axios
Enter fullscreen mode Exit fullscreen mode

  • This installs Axios and creates an axios.js file inside src/services

  • This feature is also available on the Generate mode.

Author

Chirag Chandrashekhar -My github

Top comments (0)

Read next

lico profile image

Handling 404 Error in SPA Deployed on GitHub Pages

SeongKuk Han -

dharamgfx profile image

React vs Vue: A Comprehensive Comparison 🚀

Dharmendra Kumar -

leamsigc profile image

How to load env for Nuxt layers

Ismael Garcia -

antoineit profile image

Harnessing Next.js and Firebase: Dynamic Static Path Generation for SSG

Antoine -