npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

bsa-react-cli

v0.0.11

Published

BSA Node CLI to generate and automate common tasks in react. Support component generation, containers, store features, Easily configurable to your own needs.

Downloads

2

Readme

Instalation

npm install -g bsa-react-cli

This will add a bsa-cli into your terminal, command line and you will be able to call it from your project root.

Available comands:

Type bsa-cli --help

  Options:

    -h, --help                   output usage information
    -V, --version                output the version number
    -c, --component [component]  name of your Component
    -s, --stateless [stateless]  name of your dumb component
    -o, --container [container]  name of your container
    -d, --ducks     [ducks]      name of the duck feature
    -p, --path      [path]       path for the generated structure [module|component]

I don't recommend setting the path option as the scripts use a commonly accepted approach.

Examples

Guided Component creation

$ bsa-cli                                             
  ____ ____    _      __  __       ____ _____    ____ _     ___ 
 | __ ) ___|  / \    |  \/  |_   _/ ___|_   _|  / ___| |   |_ _|
 |  _ \___ \ / _ \   | |\/| | | | \___ \ | |   | |   | |    | | 
 | |_) |__) / ___ \  | |  | | |_| |___) || |   | |___| |___ | | 
 |____/____/_/   \_\ |_|  |_|\__, |____/ |_|    \____|_____|___|
                             |___/                              
Enter the name of component *: SuperComponent
Optional path, we recommend to leave blank(will default to /src/[components]):
Creating src/components/SuperComponent
Creating src/components/SuperComponent/index.js
Creating src/components/SuperComponent/SuperComponent.jsx
Creating src/components/SuperComponent/messages.js
Creating src/components/SuperComponent/style.less
Get a cofee and enjoy the time you saved :)!

Command Component creation

$ bsa-cli -c Button                                             

Creating src/components/button
Creating src/components/button/index.js
Creating src/components/button/button.jsx
Creating src/components/button/messages.js
Creating src/components/button/style.less
Get a cofee and enjoy the time you saved :)!

Custom Path

$ bsa-cli -c HomePage -p src/layouts                                             

Creating src/layouts/HomePage
Creating src/layouts/HomePage/index.js
Creating src/layouts/HomePage/HomePage.jsx
Creating src/layouts/HomePage/messages.js
Creating src/layouts/HomePage/style.less
Get a cofee and enjoy the time you saved :)!

Containers

$ bsa-cli -o CountrySelect                                            
                           
Creating src/containers/CountrySelect
Creating src/containers/CountrySelect/index.js
Creating src/containers/CountrySelect/container.js
Get a cofee and enjoy the time you saved :)!

Store Feature Duck

$ bsa-cli -d SearchPerson                                            
                           
Creating src/store/features/SearchPerson
Creating src/store/features/SearchPerson/index.js
Creating src/store/features/SearchPerson/actions.js
Creating src/store/features/SearchPerson/reducers.js
Creating src/store/features/SearchPerson/thunks.js
Creating src/store/features/SearchPerson/types.js

Changing templates

If you clone, or fork the repo. You will find a src folder. The logic here is simple: ######The templates folder Plain js files with export a function. The function accepts the name received from the CLI and returns a string

After you adjusted the templates, you will need to compile ES6 to ES5, there is already a Babel script ready for you.

npm run babelCompile

Your new setup is ready to be used. You can adjust the command line name in the package.json file. You can change react-cli to whatever you like until the name is not used on your system. You have more options here, you can either compile and run npm link. This will replace the globally installed version with your local, or change the command name to something project specific and run npm install -g. Or you can add an npm script to run it from your project. As you wish :)

@TODO

  • I welcome any suggestions, forks or pull requests :)
  • This could be useful to created unit test files if we use some in the future ;)

LICENCE

Copyright for portions of project React-bash-scripts are held by Julius Koronci, 2017 react-bash-scritps. All other copyright for project bsa-react-cli are held by Francisco Quijano, 2018.