The latest articles on DEV Community by Chirag Chandrashekhar (@cchirag). https://dev.to/cchirag https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F372507%2F7f6ef592-6c4d-4416-945d-f0ca262aab05.jpeg https://dev.to/cchirag en Chirag Chandrashekhar Sun, 15 Aug 2021 07:47:53 +0000 https://dev.to/cchirag/reactez-4lkp https://dev.to/cchirag/reactez-4lkp <h2> Reactez </h2> <p>A simple React CLI for Component and Page creation.</p> <h2> Getting Started </h2> <p>These instructions will get you a copy of the project up and running on your local machine.</p> <h2> Installation </h2> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>npm i -g reactez </code></pre> </div> <h2> Usage </h2> <p>With the new Version of reactez (v1.1.0)<br> a Generate feature has been added.<br> It's simple and easy.</p> <h3> Just type </h3> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez generate </code></pre> </div> <p>or<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez g </code></pre> </div> <p>This takes you to an easy-to-use prompt that helps you to generate Components,Pages and implement Axios into your project with ease.</p> <h2> Component generation </h2> <h3> Functional Component </h3> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez component [COMPONENTNAME] </code></pre> </div> <p>or<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez c [COMPONENTNAME] </code></pre> </div> <ul> <li>This command creates a default Functional Component.</li> <li>The component is created at /src/components/.</li> <li>The generated component consists of a .jsx(component file) and a .css(style sheet) files.</li> <li>Generated component comes with a Functional Component boilerplate with the style sheet imported.</li> </ul> <h3> Class Component </h3> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez component [COMPONENTNAME] -c </code></pre> </div> <p>or<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez c [COMPONENTNAME] -c </code></pre> </div> <ul> <li>This command creates a Class Component.</li> <li>The component is created at /src/components/.</li> <li>The generated component consists of a .jsx(component file) and a .css(style sheet) files.</li> <li>Generated component comes with a Class Component boilerplate with the style sheet imported.</li> </ul> <h3> Alternate flag: </h3> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez component [COMPONENTNAME] --class </code></pre> </div> <p>or<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez c [COMPONENTNAME] --class </code></pre> </div> <h2> Page generation </h2> <h3> Functional Component Page </h3> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez page [PAGENAME] </code></pre> </div> <p>or<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez p [PAGENAME] </code></pre> </div> <ul> <li>This command creates a default Functional Component Page.</li> <li>The component is created at /src/pages/.</li> <li>The generated page consists of a .jsx(component file) and a .css(style sheet) files.</li> <li>Generated page comes with a Functional Component boilerplate with the style sheet imported.</li> </ul> <h3> Class Component Page </h3> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez page [PAGENAME] -c </code></pre> </div> <p>or<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez p [PAGENAME] -c </code></pre> </div> <ul> <li>This command creates a Class Component Page.</li> <li>The component is created at /src/pages/.</li> <li>The generated page consists of a .jsx(component file) and a .css(style sheet) files.</li> <li>Generated page comes with a Class Component boilerplate with the style sheet imported.</li> </ul> <h3> Alternate flag: </h3> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez component [PAGENAME] --class </code></pre> </div> <p>or<br> </p> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez c [PAGENAME] --class </code></pre> </div> <h2> Axios Implementation. </h2> <p>With the new update, it's easy to implement axios into your project.</p> <h3> Just type </h3> <div class="highlight js-code-highlight"> <pre class="highlight plaintext"><code>rez axios </code></pre> </div> <ul> <li><p>This installs Axios and creates an axios.js file inside src/services</p></li> <li><p>This feature is also available on the Generate mode.</p></li> </ul> <h2> Author </h2> <p>Chirag Chandrashekhar -<a href="https://github.com/cchirag">My github</a></p> react javascript angular Chirag Chandrashekhar Thu, 23 Apr 2020 19:23:34 +0000 https://dev.to/cchirag/reactez-4e8f https://dev.to/cchirag/reactez-4e8f <p><a href="https://www.npmjs.com/package/reactez">https://www.npmjs.com/package/reactez</a> A simple CLI for rapid React Components and Pages creation. Do make use of it and any suggestions are appreciated.😀</p> react npm