Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/stefanfreitag/fullstack_graphql
Demo application for GraphQL (MongoDB/ Angular)
https://github.com/stefanfreitag/fullstack_graphql
angular backend demo frontend graphql
Last synced: 21 days ago
JSON representation
Demo application for GraphQL (MongoDB/ Angular)
- Host: GitHub
- URL: https://github.com/stefanfreitag/fullstack_graphql
- Owner: stefanfreitag
- Created: 2018-06-19T04:10:33.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2021-07-24T07:28:28.000Z (over 3 years ago)
- Last Synced: 2024-12-15T13:50:24.586Z (26 days ago)
- Topics: angular, backend, demo, frontend, graphql
- Language: TypeScript
- Homepage:
- Size: 1.08 MB
- Stars: 2
- Watchers: 3
- Forks: 0
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# GraphQL full stack example
Based on the [Udemy](https://www.udemy.com/) course [GraphQL with Angular & Apollo - The Full-stack Guide
](https://www.udemy.com/graphql-angular-apollo-full-stack/)## Frontend
The frontend is written in Typescript.After cloning the repository do an```bash
$ npm install
```to resolve all required dependencies. To execute the application run
```bash
$ ng serve
```
Open a browser and go to http://localhost:4200/.
## Backend
The backend is written in Javascript. After cloning the repository do an```bash
$ npm install
```to resolve all required dependencies. To execute the application run
```bash
$ npm run dev
```
The expected output after start of the application is
```
> [email protected] dev /home/stefan/fullstack_graphql/backend
> babel-watch server.jsExpress server running on port 4000
```You can open the URL http://localhost:4000/graphiql in the browser to access
the GraphiQL UI. It can be used to query/ modify data. To e.g. retrieve the ids
of all known courses```
query AllCourses {
allCourses(searchTerm: "") {
id
}
}
```### Database
The course data is persisted in a [MongoDB](https://www.mongodb.com/) instance.Docker is used to make the instance available. The official MongoDB image is pulled
from the [Docker hub](https://hub.docker.com/).```bash
docker pull mongo
```When creating an instance from the image, we forward the container port 27017
(MongoDB default port) to 27017 on localhost. At the same time a volume is attached
to the instance - it serves as persistent data store.
```
docker run -d -p 27017:27017 -v ~/data:/data/db mongo
```## FAQ
### MongoNetworkError: failed to connect to server [localhost:27017] on first connect [MongoNetworkError: connect ECONNREFUSED 127.0.0.1:27017]
The backend connects per default to a MongoDB running on localhost. Please ensure
that the MongoDB is up and running. The start order of the three componentes is
* MongoDB instance
* Javascript backend
* Angular frontend