Small project to make use of Graphql and Apollo Server as an alternative paradigm to define APIs. Uses a node.js / express backend and a vue.js frontend.
Basically is a small CRUD application for displaying images with the following features
The repo contains both the Node.js backend and Vue.js frontend.
- Uses Express for routing
- MongoDB as database, Mongoose ODM as MongoDB driver and to define Model schemas
- JWT implementation to authentificate registered user
- GraphQl TypeDefs with Model definitions encapsulated in typeDefs.gql, file gets parsed via Node server
- JavaScript Methods for GraphQl queries with Database interactions are happening inside resolvers.js
- Uses Google Material design with Vuetify
- GraphQl integration with Apollo Client via vue-apollo
- Query definitions in GQL language for Queries and Mutations encapsulated in queries.js
- Most queries happening inside Vuex except
- Functionality: User registration/ login, CRUD posts, like/ favorite Posts
Backend makes use of mongoose and MongoDB which could be set up at MongoDB Atlas, mlab or as a Docker container.
Set your .env variables. Copy and rename nodemon.example.json to nodemon.json Insert connection to your MongoDB here.
Apollo playground can be reached at localhost:4000. The app will run at localhost:8080
Run the following command in root folder. This will start up both the node backend AND the vue frontend which is located in /client
npm run dev
Use caution with npm and the folders. There are two package.json files. One for backend (root folder) and one for Vue frontend (client folder).
To manage and add Vue.js dependencies you need to move to the client folder and run npm there.