Skip to content

Commit d18293a

Browse files
committed
updated angular quickstart readme
1 parent e003e66 commit d18293a

File tree

1 file changed

+46
-9
lines changed

1 file changed

+46
-9
lines changed

quickstart-with-apollo/README.md

Lines changed: 46 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,9 @@
1010

1111
## Quickstart
1212

13+
<!--
1314
For more information on how to get started [refer to the full angular-apollo-instagram tutorial](https://www.graph.cool/docs/quickstart/angular-apollo-instagram/).
15+
-->
1416

1517
### 1. Clone example repository
1618

@@ -19,35 +21,69 @@ git clone https://github.com/graphcool-examples/angular-graphql.git
1921
cd angular-graphql/quickstart-with-apollo
2022
```
2123

22-
### 2. Create GraphQL API with [`graphcool`](https://www.npmjs.com/package/graphcool)
24+
### 2. Create Graphcool service with the [Graphcool CLI](https://docs-next.graph.cool/reference/graphcool-cli/overview-zboghez5go)
2325

2426
```sh
25-
# Install Graphcool CLI
26-
npm install -g graphcool
27+
# Install Graphcool Framework CLI
28+
npm install -g graphcool@next
2729

28-
# Create a new project based on the Instagram schema
29-
graphcool init --schema https://graphqlbin.com/instagram.graphql
30+
# Create a new service inside a directory called `server`
31+
graphcool init server
3032
```
3133

32-
This creates a GraphQL API for the following schema:
34+
This created the following file structure in the current directory:
35+
36+
```
37+
.
38+
└── server
39+
├── graphcool.yml
40+
├── types.graphql
41+
├── .graphcoolrc
42+
└── src
43+
├── hello.graphql
44+
└── hello.js
45+
```
46+
47+
### 3. Define data model
48+
49+
Next, you need to define your data model inside the newly created `types.graphql`-file.
50+
51+
Replace the current contents in `types.graphql` with the following type definition (you can delete the predefined `User` type):
3352

3453
```graphql
3554
type Post {
55+
id: ID! @isUnique
56+
createdAt: DateTime!
57+
updatedAt: DateTime!
3658
description: String!
3759
imageUrl: String!
3860
}
3961
```
4062

41-
### 3. Connect the app with your GraphQL API
63+
### 4. Deploy the GraphQL server
64+
65+
You're now ready to put your Graphcool service into production! Navigate into the `server` directory and [deploy](https://docs-next.graph.cool/reference/graphcool-cli/commands-aiteerae6l#graphcool-deploy) the service:
66+
67+
```sh
68+
cd server
69+
graphcool deploy
70+
```
71+
72+
Save the HTTP endpoint for the `Simple API` from the output, you'll need it in the next step.
73+
74+
> **Note**: You can now test your GraphQL API inside a GraphQL playground. Simply type the `graphcool playground` command and start sending queries and mutations.
75+
76+
77+
### 5. Connect the app with your GraphQL API
4278

43-
Copy the `Simple API` endpoint to `./src/app/client.ts` as the `uri` argument in the `createNetworkInterface` call:
79+
Paste the `Simple API` endpoint to `./src/app/client.ts` as the `uri` argument in the `createNetworkInterface` call:
4480

4581
```js
4682
// replace `__SIMPLE_API_ENDPOINT__` with the endpoint from the previous step
4783
const networkInterface = createNetworkInterface({ uri: '__SIMPLE_API_ENDPOINT__' })
4884
```
4985

50-
### 4. Install depdendencies & run locally
86+
### 4. Install dependencies & run locally
5187

5288
```sh
5389
yarn install
@@ -56,6 +92,7 @@ yarn start # open http://localhost:3000 in your browser
5692

5793
## Next steps
5894

95+
* [Documentation](https://docs-next.graph.cool)
5996
* [Advanced GraphQL features](https://www.graph.cool/docs/tutorials/advanced-features-eath7duf7d/)
6097
* [Authentication & Permissions](https://www.graph.cool/docs/reference/authorization/overview-iegoo0heez/)
6198
* [Implementing business logic with serverless functions](https://www.graph.cool/docs/reference/functions/overview-boo6uteemo/)

0 commit comments

Comments
 (0)