National Puppy Menace

    m5-cli

    1.1.0 • Public • Published

    m5 cli

    A CLI for create everything.

    Install

    Choose One
    npm install -g m5-cli (recommended) or
    npm install m5-cli --save-dev && cd node_modules/m5-cli && npm link or
    yarn add -D m5-cli && cd node_modules/m5-cli && npm link or
    git clone https://github.com/indaam/m5-cli.git && cd m5-cli && npm install && npm link

    Create Project

    Create html Project

    Command : m5 create html <projectName>
    Output : Automatically create skeleton HTML project, include gulp, scss, es6, etc.

    Create react Project

    Command : m5 create react-js <projectName>
    Output : Automatically create skeleton React js project, include base config, plugins, etc.

    Create react Native Project

    Command : m5 create react-native <projectName>
    Output : Automatically create skeleton React Native project, include base config, plugins, etc.

    Create react Component

    Command : m5 create comp <component_type> <component_name>
    Output : Generate(create) component base on kesepakatan
    Component Type : [atom|molecule|organisms|container]

    Command Example

    Create atom MyButton component
    m5 create comp atom MyButton shotrcut => m5 create c a MyButton

    Create molecule MyMole component
    m5 create comp molecule MyMole shotrcut => m5 create c m MyMole

    Create organism MyOrg component
    m5 create comp organism MyOrg shotrcut => m5 create c o MyOrg

    Create container MyCont component
    m5 create comp container MyCont shotrcut => m5 create c c MyCont

    How it works?

    When you first create component, it will create m5 folder. Then on m5 folder, you can see BaseClass, BaseFunction, etc. Basicly ya, just copy then rename component name, You can update that.
    Also if need to change target component, you can edit m5.config, then generate new component

    New Install react native plugins

    This task for automaticly install react-native plugins, like google maps, camera, etc.
    Before use, u need to install

    • cocopods
    • xcode
    • watchman
    • brew
    • yarn

    Command Example

    m5 add react-native-maps or
    m5 add react-native-maps@0.24.2 or m5 add react-native-maps@0.24.2 key=___YOUR_GOOGLE_MAP_KEY___

    Output

    • Automatic add to package.json
    • Automatic linking
    • Automatic setup
    • Add sample

    Run Demo

    After you type m5 add react-native-maps, you can run the demo
    m5 demo && react-native run-ios

    Task Install

    Basicly this task concept same like, npm install or yarn install You can define you plugins on app.jspn, like this

      "displayName": "yourAppName",
      "nativePlugins": {
        "react-native-gesture-handler": "1.1.0",
        "react-native-maps": {
            "version" : "0.24.2",
            "key" : "____YOUR_KEY____",
        },
        "react-native-camera": "2.6.0",
        "react-native-contacts": "4.0.1"
      }
    

    And then type m5 install on terminal,
    also dont forget to type m5 demo for setup demo
    To run, you can use react-native run-ios or yarn ios or yarn i

    Task Fonts

    if your type m5 fonts opens sans, it will automaticly download font from google font, then setup on your RN project, also dont fotget to type m5 demo for see the demo

    !IMPORTANT

    Maybe your run many RN project, so you need to clean other prject before run new project. We create shorcut for clean, like this

    • yarn clean-watch => clean javascript chache & delete all watchman
    • yarn clean-ios => clean all Pods, build & reinstall pod #Becarefull with pod version
    • yarn clean-android => gradlew clean & remove build
    • yarn clean-package => remove node module & reinstall node modules

    Plugins list todos

    • react-native-maps
      • Android [DONE]
      • iOs [DONE]
    • react-native-gesture-handler
      • Android [DONE]
      • iOs [DONE]
    • react-native-camera
      • Android [DONE]
      • iOs [DONE] // without test
    • react-native-contacts
      • Android [DONE]
      • iOs [DONE]
    • react-native-device-info
      • Android [DONE]
      • iOs [DONE]
    • react-native-svg
      • Android [DONE]
      • iOs [DONE]
    • react-native-firebase
      • Android [PENDING]
      • iOs [PENDING]
    • react-native-fbsdk
      • Android [PENDING]
      • iOs [DONE]
    • react-native-google-signin
      • Android [PENDING]
      • iOs [PENDING]
    • react-native-fs
      • Android [PENDING]
      • iOs [PENDING]
    • react-native-share
      • Android [PENDING]
      • iOs [PENDING]
    • lottie-react-native
      • Android [DONE]
      • iOs [DONE]// Need to open xcode project

    Create React Native Project

    By default, if want to create react native project, you type react-native init yourAppName and then maybe you setup pods for ios or create shotcut scripts.
    Next steps, maybe you will install react native plugins, like react-native-camera or react-native-contacts. But sometime install plugins is anoying, solved on ios, but not on android.
    So, for simple solution we create cli for setup react native plugins.

    This is example if will install 3 plugins and 2 google font

    • 3 plugins
      • react-native-device-info
      • react-native-maps
      • react-native-contacts
    • 2 Fonts
      • Open Sans
      • Oswald
    Steps
    • npm install -g m5-cli
    • cd ~/Documents/
    • m5 create react-native yourAppName
    • cd yourAppName && ls
    • m5 add react-native-device-info
    • m5 demo
    • react-native run-android or react-native run-ios
    • if error, try to clean watch && chache yarn clean-watch
    • and try again react-native run-android or react-native run-ios
    • if success, next
    • m5 add react-native-contacts
    • m5 add react-native-maps key=__YOUR_MAP__API__KEY__
    • m5 demo
    • after add, you need to re run
    • react-native run-android or react-native run-ios
    • m5 fonts Open Sans
    • m5 fonts Oswald
    • m5 demo
    • react-native run-android or react-native run-ios

    Task m5 demo is automaticly create demo from plugins

    Todos

    • Command validation
    • Option command
    • Create dinamic Component
    • Maping after create component
    • Create Log
    • When internet error
    • checking tools & version
    • create task remove plugins

    Install

    npm i m5-cli

    DownloadsWeekly Downloads

    1

    Version

    1.1.0

    License

    MIT

    Unpacked Size

    91 kB

    Total Files

    26

    Last publish

    Collaborators

    • indaam