🌈 Simple Fullstack GraphQL Application. API built with Express + GraphQL + Sequelize (supports MySQL, Postgres, Sqlite and MSSQL). WebApp built with React + Redux to access the API. Written in ES6 using Babel + Webpack.
MIT License
Simple Demo Application
API built with Node + Express + GraphQL + Sequelize (supports MySQL, Postgres, Sqlite and MSSQL).
WebApp built with React + Redux.
Written in ES6 using Babel + Webpack.
git clone [email protected]:atulmy/fullstack-graphql.git fullstack-graphql
cd api
and npm install
cd web
and npm install
/api/src/config/database.json
for database credentials/api/src/config/config.json
for API port (optional)/web/.env
for web port (optional)cd api
and npm start
, browse GraphiQL at http://localhost:8000/
cd web
and npm start
, browse web at http://localhost:3000/
[nodemon] starting `babel-node src/index.js --presets es2015,stage-2`
SETUP - Connecting database...
SETUP - Loading modules...
SETUP - GraphQL...
SETUP - Syncing database tables...
INFO - Database connected.
INFO - Database sync complete.
SETUP - Starting server...
INFO - Server started on port 3000.
Video: MOV
fullstack-graphql
├── api (api.example.com)
│ ├── src
│ │ ├── config
│ │ ├── models
│ │ ├── schema
│ │ ├── setup
│ │ └── index.js
│ │
│ └── package.json
│
├── web (example.com)
│ ├── public
│ ├── src
│ │ ├── components
│ │ ├── setup
│ │ └── index.js
│ │
│ ├── .env
│ └── package.json
│
├── .gitignore
└── README.md
/api/src/models/thought.js
to /api/src/models/user.js
and modify the file for table name and respective fieldsmodels
object in /api/src/models/index.js
/api/src/schema/thoughts
to /api/src/schema/users
and modify type.js
, resolvers.js
and fields/query.js
and fields/mutations.js
/api/src/schema/users/fields/query.js
in /api/src/schema/query.js
/api/src/schema/users/fields/mutations.js
in /api/src/schema/mutations.js
users
under /web/src/components/
/web/src/components/users
api
folder under /web/src/components/users
actions.js
where all your Redux Action Types and Actions will reside (refer /web/src/components/thoughts/api/actions.js
)state.js
where all your respective Reducers will recide (refer /web/src/components/thoughts/api/state.js
)/web/src/setup/store.js
to make it avaliable to the app/web/src/components/users
/users
):
routes
object in /web/src/setup/routes.js
(eg user: { list: '/list' }
)/web/src/components/App.js
and add the route entryThese queries are generated on client side using queryBuilder()
helper defined in /web/src/setup/helpers.js
Facebook Groups: NodeJS • ReactJS • GraphQL
Reddit: NodeJS • ReactJS • GraphQL
Following projects have been built with or inspired from fullstack-graphql
If you liked this project, please donate to support it ❤️
Copyright (c) 2017-18 Atul Yadav http://github.com/atulmy
The MIT License (http://www.opensource.org/licenses/mit-license.php)