Add product page and refactor code (#16)

Author: thangchung

README.md

@@ -8,105 +8,19 @@ A lightweight low ceremony microservices without Docker, Docker-compose and Helm
 ![product-catalog-api](https://github.com/thangchung/practical-dapr/workflows/product-catalog-ci/badge.svg?branch=master)
 ![inventory-api](https://github.com/thangchung/practical-dapr/workflows/inventory-ci/badge.svg?branch=master)
 
-## Give a Star! :star:
+## Show your support
 
 If you liked `practical-dapr` project or if it helped you, please give a star :star: for this repository. That will not only help strengthen our .NET community but also improve cloud-native apps development skills for .NET developers in around the world. Thank you very much :+1:
 
-# High Level Architecture
+# CoolStore application
 
-![](assets/high_level_architecture.png)
+![](docs/assets/webui-products.png)
 
-# Communication Style
+# High level architecture
 
-![](assets/commucation_style.png)
+![](docs/assets/high_level_architecture.png)
 
-# Get starting
-
-## Start required components
-
-- We need Docker for Desktop installed with Kubernetes is enabled.
-- Follow those steps at https://github.com/dapr/cli to install Dapr CLI.
-- Follow these steps at https://github.com/dotnet/tye/blob/master/docs/getting_started.md to install `tye` CLI.
-
-## One tye command to rule them all
-
-```bash
-$ tye run
-```
-
-Then you can see `tye dashboard` as below
-
-![](assets/tye-dashboard.png)
-
-## Testing it
-
-- Go to `webui`, and on `Bindings` column click to `http` link (http://localhost:58275 in the picture) to access to `Blazor Web UI`
-- Go to `identity-api`, and on `Bindings` column click to `http` link (http://localhost:58269 in the picture) to access to `Identity Server 4`
-- Go to `graph-api`, and on `Bindings` column click to `http` link (http://localhost:58267 in the picture) to access to `GraphQL Api Server`
-
-### GraphQL Server Playground
-
-On the `graph-api` link above, you will be redirected to GraphQL Playground, and you can play with it as following:
-
-```js
-query {
-    products(
-    page: 1
-    pageSize: 5
-    where: { price_lte: 10000 }
-    order_by: { price: DESC }
-  ) {
-    edges {
-      id
-      name
-      imageUrl
-      price
-      categoryId
-      categoryName
-      inventoryId
-      inventoryLocation
-    }
-    totalCount
-  }
-}
-```
-
-![](assets/graphql_playground_query_products.png)
-
-### Mutation
-
-```js
-mutation createProductMutation($createProductInput: CreateProductInput!) {
-  createProduct(createProductInput: $createProductInput) {
-    product {
-      id
-      name
-    }
-  }
-}
-```
-
-```js
-{
-  "createProductInput": {
-    "name": "product 1",
-    "description": "this is a description",
-    "imageUrl": "https://picsum.photos/1200/900?image=100",
-    "price": 100,
-    "categoryId": "77666AA8-682C-4047-B075-04839281630A",
-    "inventoryId": "90C9479E-A11C-4D6D-AAAA-0405B6C0EFCD"
-  }
-}
-```
-
-![](assets/graphql_playground_mutation.png)
-
-## Debugging application
-
-Follow steps at [Debugging Dapr application using Tye tool](https://dev.to/thangchung/debugging-dapr-application-using-tye-tool-1djb)
-
-## Setup Azure
-- [Publish docker image to ACR and AKS](https://docs.microsoft.com/en-us/azure/dev-spaces/how-to/github-actions) and [example](https://github.com/Azure/dev-spaces/blob/master/.github/workflows/bikes.yml)
+# **Don't believe it, check yourself at [Developer Guidance](/docs/developer_guide.md)**.
 
 ## Contributing