• About
• Motivation
• Features
• Setup & Documentation
• License

🚀 A well-structured production ready modern web application boilerplate (Single Page Application with Server Side Render to boost SEO). With Next.js, React, Redux, Express.js for web server and build-in API, Less, Css, Axios, i18n, EnvConfig and more 🚀

Demo: https://pokemon.nless.pro

When Create React App first launched in July of 2016, it was considered the best way for beginners to get started with React. I find that it is too restrictive, and I find the ejection process to be painful, with resulting configuration being far to complex to easily tinker. Also, Create React App and almost boilerplate you find in Github is just Client-side rendering.

Next.js is a minimalistic React framework that runs on the browser and the server. It offers developers an easy way to get started, and as it uses React.js for templating, it's also a straightforward way for developers with React experience to get productive quickly.

The advantage of this approach is to be able to create rich user experiences in a uniform way, without compromising SEO (Search Engine Optimisation) factors that are key to good ranking on Google and other search engines.

This boilerplate makes it easier to get up and running with a well-structured Next.js.

Happy coding!

This project provides a lot of features out of the box. Here's an overview of the included components and tools.

• Next.js - Minimalistic framework for single page with server-rendered React applications.
• React - Awesom library for building user interfaces. It is maintained by Facebook and a community of individual developers and companies.
• Redux - A predictable state container for JavaScript apps.
• Express.js- A minimal and flexible Node.js web application framework that handles server-side rendering and integrates with Next.js.
• Less - CSS preprocessor, which adds special features such as variables, nested rules and mixins (sometimes referred to as syntactic sugar) into regular CSS.
• Docker - A tool designed to make it easier to create, deploy, and run applications by using containers.
• next-i18next - An internationalization-framework which provides a function that takes a key, some options, and returns the value for the current language. Helps you to add language translation support to your app.
• Jest - Javascript testing framework , created by developers who created React.
• Babel - The compiler for next generation JavaScript.
• ESLint - The pluggable linting utility.
• Reverse Proxy - Lightweight server for proxying API requests.
• Bundler Analyzer - Visualize the size of webpack output files with an interactive zoomable treemap.
• Jest - Javascript testing framework , created by developers who created React.
• dotenv - Expose environment variables to the runtime config

1. Clone the repository:

git clone https://github.com/haoict/production-ready-webapp-boilerplate.git

2. Install the dependencies:

yarn install (or npm install)

3. Start the development server:

yarn dev

Launch http://localhost:3001

(Change .env file for customize host and port)

Licensed under the MIT License, Copyright © 2020-present Hao Nguyen [email protected]