react-modelling

    0.0.201 • Public • Published

    A CLI that gives opinion to React

    This library is only preview at the moment

    Next.js and Sass support will be available soon


    How to install?

    npm i -g react-modelling


    The problem

    What is the problem in React? Your projects quickly and easily can become a trash. Disorganization reigns because there is no a main pattern to React. And in a big team? Nobody can understand that structure. And what about writing boilerplates to create components or router all the time? React Modelling solves all of these organization problems using the CLI.

    Here are the proposed structure: under construction

    src
    └───domain - Non-reusable components
    └───components - Reusable components
    └───pages - Pages folder
    └───routes - Routes folder
    └───constants - Variables folder. e.g.: theme variable
    └───utils - Utilities. e.g.: validators and formatters
    └───styles - Global styles
    └───assets - Assets folder. e.g: icons and images
    └───@types - Typescript Interfaces and Types
    
    

    Going ahead...

    src
    └───components
    │   └───Header
    │       │   index.tsx
    │       │   styles.ts
    

    or using modularization

    src
    └───components
    │   └───Layout
    │         └───Header
    |             |   index.tsx
    |             |   style.ts
    |
    |   └───Form
    │         └───Input
    |             |   index.tsx
    |             |   style.ts
    │         └───Button
    |             |   index.tsx
    |             |   style.ts
    

    CLI Commands

    You can use in your terminal, the aliases remod, react-modelling, react-m or r-m to call the React Modelling.


    Configure project

    To configure the project

    remod init
    

    After this you should execute yarn or npm install


    Page

    To create a new page

    remod page <name>
    

    or you can create inside a module

    remod page <name> <module-directory>
    

    Example:

    remod page Login users/authentication
    

    Components

    To create a new component

    remod component <name>
    

    Use the flag -r to generate an reusable component and -u for a non-reusable component. By default reusable component will be created.

    or you can create inside a module

    remod component <name> <module-name>
    

    Example:

    remod component LoginError users/messages
    

    Router

    To create a new router

    remod router --init
    

    Install

    npm i react-modelling

    DownloadsWeekly Downloads

    2

    Version

    0.0.201

    License

    MIT

    Unpacked Size

    14.9 kB

    Total Files

    15

    Last publish

    Collaborators

    • marlonelima