Crana – React & NodeJS apps in under a second

Home / Developer Tools / Crana – React & NodeJS apps in under a second
Crana – React & NodeJS apps in under a second

I’ve used the opportunity of Hacktoberfest and tried to publish a project I was lately working on: Crana(CReate A Node App), a CLI tool which makes developing applications with a NodeJS backend and a React frontend a breeze.

npm i -g crana
crana init my-awesome-project
cd my-awesome-project
crana dev

The problem

Most of the projects I was working on involved both a server (node.js) and a client (mostly React based). Until now I didn’t find any solution which met the requirements of such projects, and copying around all of the config files for each new project over and over again is very problematic.
I wanted to have a simple tool which encapsulates all of this overhead, enabling developers to just do what they should and want: Developing. And I though this solution may also be helpful to other developers.
That’s how Crana was born.

The/A solution

Crana tries to be a “just-start-developing” (JSD) solution, empowering developers to create apps without having to worry about complicated tooling or configurations. For more information, have a look at the git repository:
Warning: The project is in a very early stage and may not meet all your requirements, and bugs are more likely to happen. That’s why your help is needed to make Crana the best tool of its kind!

It comes with:

  • ESLint (Same config for server and client)
  • StyeLint
  • Webpack
    • with code splitting support out of the box
    • configured to create the best possible production build
    • all loaders pre-configured
    • webpack-dev-server for an excellent development experience
    • react-hot-loader pre-installed
  • Babel
  • Nodemon (enables live-reload server during development)
  • The ability to easily share code between server and client
  • …and a lot of other stuff all hidden in the package itself

As all configuration files and dependencies needed are encapsulated in Crana itself, you will not see a single configuration file.

But as everything out there, Crana is not only unicorns and rainbows. The fact that everything is encapsulated in the package has many advantages, but also comes with a few downsides:

  • It is currently not possible to modify/extend the configuration files
  • To reason more about certain behaviour, the config files have to be looked up directly in the code of the package

But those two downsides are just another two problems which wait to be solved:

  • Making the configurations extendable/modifiable per project should be the next big feature of Crana (maybe implementing something like a plugin system?)
  • The documentation of Crana should be extended in a way that every decision made should be exactly written down and explained (e.g. webpack loaders, babel config, eslint config etc.)

And maybe you are the one who is going to solve those issues!

Summarizing, I think that Crana is a very useful tool for many (new and existing) projects out there, following slightly different concepts than other similar tools. But most importantly, this projects needs you, be it as a user or a contributor, more than anything else to fullfil its modest vision.

Source: dev