This project is an opinionated boilerplate for a fullstack workflow using a Nodejs server with express and NextJs for the React front end. The idea is to make it a solid boilerplate for large scale SSR projects that require a custom node backend.
I could not find a solid start point for the project that incorporated Typescript / NextJs and NodeJs with Express as the backend, I also wanted to have a simplified folder structure for oganization. This boilerplate takes care of handling that start point so that you only need to consider your options for database and the API you plan to use to query data from your database. Redux is incorporated for global state managment. Typescript is setup to work in both server and client files and now works with Next.js 9.0 +
- Nextjs
- Custom folder structure for fullstack development organization
- Redux
- Redux-Sagas
- Redux-Actions ( removes some pain points of redux state managment )
- Redux Dev Tools / Chrome extension for dev build ( link at bottom )
- Node Express server
- Nodemon file watching ( live server restart for code changes )
- Typescript ( Server and Client )
- Styled-Components π
git clone https://github.com/slaterbbx/fullstackinator.git
https://nextjs.org/docs/
Everything functions the same as it would while normally using Next.js to develop a react app, This project is simply a boilerplate. The Nextjs pages folder is now in the ./client folder and the server files are in ./server folder. Nodemon will watch the ./server files and recompile the server ts files upon file changes during npm run dev
while the dev live server is running. All server production files upon npm run build
are output to the ./distServer folder, npm start
will start a server running your production files from the ./distServer folder.
Install node_modules
npm install
Run the dev server with hot module reload and nodemon server auto restart
NOTE: Make sure ts-node is also installed globally. (dev environment only)
npm start
Build files are output to ./distServer folder
npm run build
( builds all files for production / Client and Server )
Runs the optimized build from the ./distServer folder
npm run production
https://github.com/zalmoxisus/redux-devtools-extension
MIT License | Fullstackinator Β© 2019 Kyle Gallagher