Simple Fullstack GraphQL Application with Angular CLI + Redux. API built with Typescript + Express + GraphQL + Sequelize (supports MySQL, Postgres, Sqlite and MSSQL). WebApp built with Angular CLI + Redux + Async Middleware to access the API.
MIT License
Created from fullstack graphql, implement additional support for Typescript, Angular CLI and ngrx.
Simple Demo Application
API built with Node + Express + GraphQL + Sequelize (supports MySQL, Postgres, Sqlite and MSSQL).
WebApp built with Angular CLI + Redux + Async Middleware.
Written in Typescript using Babel + Angular CLI.
git clone [email protected]:rafaesc/fullstack-graphql-angular.git fullstack-graphql-angular
cd api
and npm install
cd webapp
and npm install
/api/src/config/database.json
for database credentials/api/src/config/config.json
for API port (optional)/webapp/.env
for webapp port (optional)cd api
, npm run build
and npm start
, browse GraphQL at http://localhost:3000/
cd webapp
and npm start
, browse webapp at http://localhost:4200/
[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.
fullstack-graphql-angular
βββ api (api.example.com)
β βββ src
β β βββ config
β β βββ models
β β βββ schema
β β βββ setup
β β βββ index.js
β β
β βββ package.json
β
βββ webapp (example.com)
β βββ public
β βββ src
β β βββ app
β β βββ@core
β β βββ@shared
β β βββpages
β β βββapp.module.ts
β β
β βββ package.json
β
βββ .gitignore
βββ README.md
/api/src/models/thought.ts
to /api/src/models/user.ts
and modify the file for table name and respective fieldsmodels
object in /api/src/models/index.ts
/api/src/schema/thoughts
to /api/src/schema/users
and modify type.ts
, resolvers.ts
and fields/query.ts
and fields/mutations.ts
/api/src/schema/users/fields/query.ts
in /api/src/schema/query.ts
and add user to the fields/api/src/schema/users/fields/mutations.ts
in /api/src/schema/mutations.ts
and add user to the fieldscd api
, npm run build
and npm start
users
under /webapp/src/app/pages/
/webapp/src/app/pages/users
users.action.ts
where all your Redux Action Types and Actions will reside (refer /webapp/src/app/@shared/store/actions/users.action.ts
)users.reducer.ts
where all your respective Reducers will recide (refer /webapp/src/@shared/store/reducers/users.reducer.ts
)users.service.ts
where all your respective Services will recide (refer /webapp/src/@shared/services/users.service.ts
)users.effect.ts
where all your respective Effects will recide (refer /webapp/src/@shared/store/reducers/users.effect.ts
)/webapp/src/@shared/store/
to make it avaliable to the app/webapp/src/@core/core.module.ts
/webapp/src/app/pages/users
/users
):PAGES_ROUTES
object in /webapp/src/app/pages/pages.routing.ts
These queries are generated on client side using queryBuilder()
helper defined in /webapp/src/app/@shared/utils/helpers.ts