Bedrock lets you set up a production-ready webapp in under 10 minutes.
Three primary reasons:
- You want a production-ready Node server in under 5 minutes.
- You want user authentication, password resets, and more to be setup for you.
- You want React, Flux, and React Router enabled with Hot Loading for super-fast development.
Watch a video showing how to get a production-ready web app with user authentication set up in 5 minutes using Bedrock
- An Sails (Express) server with user authentication built in. 😯
- Auto-generated REST API for all your models
- Signup, Login, Reset Password Pages
- SMTP Email Support
- Server-side rendered pages
- Client-side rendered components using React
- [New] React Hot Loading enabled to allow super-fast development of React components without page refreshes. 💥 ⭐
- Communication between React and Server-side API with Flux.
- Client-side routing with React Router
- Incremental builds using Webpack, facilitated through Grunt.
- Migrations to help coordinate database changes
- Production-ready such as API access tokens, CSRF protection, CORS, and more.
- Support for multiple environments (dev, stage, prod)
We will talk about the installation in more detail in the next section, but here is the quickstart guide.
git clone [email protected]:tilomitra/bedrock.git <project-name>
cd <project-name>
npm install
Then, open config/connections.js
and update your database connection details.
Then, run the migrations to create the relevant database tables.
# Run migrations
grunt db:migrate:up
Then, simply start everything.
# Start servers
npm start
Bedrock is the starting point of your Node application. To install, you should clone the project, and then build on top of it.
git clone ... <project-name>
cd <project-name>
npm install
Go into config/connections.js
. Update the mysql
connection details. At this point, you may need to create a new database.
If you want to use a different database (PostgreSQL or Mongo), remove the mysql
connection, and create a new connection, as shown in the comments in the file.
Bedrock sets up authentication for your server, and creates Login, Signup, and Reset password pages. It uses PassportJS to accomplish this.
To facilitate this, you need to run a migration to create the Users
and Passports
table. Just run this from the command line:
grunt db:migrate:up
After it runs, check your database and you should see Users
and Passports
table created.
We will talk more about migrations in the Best Practices section.
To start developing, run:
npm start
This will start up 3 things:
- An Express server on Port 1337. This is the primary NodeJS server.
- A Webpack Dev Server on Port 3000. Any static assets will be served by Webpack in development mode. This allows for Hot Module Replacement.
- Assets will be built by Webpack, and a watch task will be started. Any CSS and JS changes will trigger a new incremental build.
In production mode, you'll want to build your assets ahead of time. To do this, run:
grunt buildProd
This will build your assets and store it in the www/
directory.
Then, you can run your server in production mode:
NODE_ENV=production sails lift
This will start up the NodeJS server in production mode. If you want this to be a long-lived background task, consider using a Node Process Manager like pm2.
Bedrock is built on Sails, so it has all of the great features that Sails ships with.
This includes, but is not limited to:
- It's an Express server under the hood, so all Express modules still work
- Reusable Security Policies (Middleware)
- Configurable via a global
config
object. - Encourage use of reusable services, like a
Mailer
service. - Waterline ORM that works well with multiple databases. Can be swapped out if you need.
- Auto-generate REST APIs (optional)
- Follows MVC conventions, which keeps your code organized as your project grows.
Check out all the features on the Sails documentation page. I've used raw Express and I've used Sails, and I will take Sails everytime guys.
Bedrock lets you build reusable components using React and call its API via Flux Actions. Pages are linked together using React Router
Here's how it works at a high level:
- User navigates to a page
- Page route triggers React Router to display a component, and execute certain Flux Actions.
- Flux actions trigger API requests.
- API responses trigger Flux Stores to change.
- Flux stores change automatically re-renders React components that are watching the store.
It is simple, one-way communication that scales to hundreds of components (We have 100+ components in our internal fork of Bedrock).
Learn more about Bedrock on Node Web Apps. Here are some useful tutorials:
- Learn how to set up Bedrock
- Learn how to set up Reset Password Flow in Bedrock
- Learn how to use migrations to make your database more stable
Sign up to the Node Web Apps newsletter to stay up to date on new tutorials.
Bedrock is composed of these open-source frameworks.
Sails: Sails makes it easy to build custom, enterprise-grade Node.js apps. It is designed to emulate the familiar MVC pattern of frameworks like Ruby on Rails, but with support for the requirements of modern apps: data-driven APIs with a scalable, service-oriented architecture
React: A JavaScript Library for building user interfaces
React Router: React Router is a complete routing library for React.
NuclearJS: Traditional Flux architecture built with ImmutableJS data structures. Very similar to Redux.
Webpack: A module bundler for front-end assets. It is used in Bedrock for chunking JavaScript files to be loaded on demand and hot reloading.
React Hot Loader: Tweak React components in real time without page refreshes.