Boilerplate for Node, Express, React, Redux and TypeScript
Switch branches/tags
Nothing to show
Clone or download
Soudny Update tsconfig.json
Fixed typo
Latest commit ac86d99 Mar 11, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.vscode Boilerplate v0.1.0 Jun 30, 2017
node Updated tsconfig fore node project Jul 5, 2017
react Update tsconfig.json Mar 11, 2018
.gitignore Boilerplate v0.1.0 Jun 30, 2017
README.md Updated readme Jul 5, 2017
package-lock.json Boilerplate v0.1.0 Jun 30, 2017
package.json Build script works cross platform (on win also). Oct 10, 2017
tslint.json Boilerplate v0.1.0 Jun 30, 2017

README.md

Full Stack Typescript Boilerplate

Why Full Stack?

  • Working with only one repository

  • Only one server needed to deploy the application - even if you were to deploy it on the same server, having it all in one place reduces the effort in finding your way around the project

  • Separate consoles in development - more often than not, it's a good idea to run React application and Node application in separate consoles. Both work differently and it's ok to accept them as such. But in reality, we only need them separate in development.

  • Multiple build locations - It's way simpler to add more react projects on top of it, just duplicate the react folder and adjust redirects from the server

  • Only one package.json - This is especially important. One package.json means one node_modules. And that means no duplicate code, dependencies or packages killing themselves and causing you headaches

Why Typescript?

Two words: type safety.

Technology stack

  • Node 8
  • Express 4
  • React 15.6
  • Typescript 2.3
  • Redux 3.7
  • Webpack 2.6
  • Jest
  • Scss

Getting started

In order to start the project, you will need Node 8 installed! Please visit nodejs.org and fetch the latest version.

Install all required dependecies with

yarn install

or

npm install

Create a .env file in the project root where you will keep the environment variables. Using the environment variables is based on the dotenv package, whose details can be found here: https://github.com/motdotla/dotenv

Example .env

NODE_ENV=development

To start a development node server, simply type

yarn nstart

or

npm run nstart

As for React in development mode (server), start by typing

yarn rstart

or

npm run rstart

If you would like to build node, react or both, use one of the following commands respectively

yarn node-build
yarn react-build
yarn build

or

npm run node-build
npm run react-build
npm run build

To keep everything simple, a simple npm start script will have everything prepared for production. No additional configuration needed.

Where to from here?

Well, the usual stops are setting up a process manager, adding a database (SQL/NoSQL) and everything else you might need on your project. Since these additions are quite simple to add and specific choise of one is quite dependant on the project, I decided to leave it out from the boilerplate.

Should there be a sufficient amount of request for additional features within the boilerplate, I'll give it an update! In the meantime - happy coding!