create-react-app-fullstack
v3.0.1
Published
Turn create-react-app into a fullstack app by adding Express and Sequelize
Downloads
75
Maintainers
Readme
create-react-app-fullstack
The Stack
Versions
- Removed Eject! Using a proxy server doesn't require eject, so your boilerplate config remains nicely under the hood.
- Substantial updates and new architecture
- Removed different start options (backstart, fullstart, etc). Fullstack functionality is now present in
npm run start
. Used a 'proxy' instead of middleware to the Webpack Dev Server. Reload times are substantially faster. - Added redux, including react-redux, redux-thunk, redux-logger, and react-router-redux.
- Added axios.
Installation
npm i -g create-react-app
npm i -g create-react-app-fullstack
Getting Started
createdb <my-app>
After creating your database, initialize a create-react-app with the same name (the name match is default functionality, overriding this is straightforward):
create-react-app <my-app>
cd <my-app>
fullstack
After running fullstack, confirm that you want to eject and the remaining steps will update your app with Express and Sequelize.
The second prompt confirms that you want to run fullstack on your project. The process will add/overwrite/remove files in your src, db, server, and scripts folders, so this prompt is a security net. Since you're likely running this function at the beginning of a project, it shouldn't be an issue. After accepting the prompt, the project will install dependencies and template files.
remember to seed the database!
After the fullstack completes, run the command below to add dummy data to the database: npm run seed
Commands
seed
Before getting started, seed the database with dummy data by running:
npm run seed
start
After the database is seeded, you should be all set. To enable full-stack development with hot-reloading, use the same script as create-react-app:
npm run start
build
To build deployment-ready, we use the same script as create-react-app:
npm run build
References and Props
- create-react-app
- create-react-app-add-redux
- custom-react-scripts
- Using create-react-app with React Router + Express.js
- How to get "create-react-app" to work with your API
- Bones
Last, this project was built at a hackathon at Full Stack Academy. Development is ongoing.