Skip to content

Home

Jump to bottom
Roland Jansen edited this page Nov 2, 2017 · 5 revisions

The basic setup is like the one described in this article. Electron is the base framework with React on top of it.

Had to downgrade to npm@4 because I got errors creating the project with create-react-app. If you want to contribute I definitely recommend this step:

npm install -g npm@4

These are the steps to build the toolstack (see the mentioned article for details):

  1. Generate a basic React app with create-react-app
  2. Add Electron framework: npm install --save-dev electron
  3. Add an electron start script that also starts the dev server (electron-starter.js)
  4. Add an entry point and run target to package.json to start electron and react
  5. Add node-foreman to get dev servers to run nicely together
  6. TODO: Add bootstrap, flow, an icon set, linting, testrunner, ci integration

*** Flow *** There were some minor problems installing flow. It has a seperate dev server which crashes when errors in the code are found. This means I can't use it for hot-reload. The Atom IDE also didn't work at all (Win10) but the nuclide extension for Atom did. I had to install flow globally to get it to work (which could cause version conflicts in the future). I decided to exclude flow from hot reloading but use the editor extension.

I use Atom as an editor. Besides other stuff I installed the language-babel package to get syntax highlighting for ES201x, React JSX and Flow.

The app architecture is a mixture inspired by this and this article.

There's a video tutorial for reactstrap and it has a repo which is worth a look.

Clone this wiki locally