# Web app setup

How to run the Readymade Grocery Web app

![](/files/-MQG9cXU4LTEdSJsRslz)

In Above Screenshot you can find the grocery-cms-dashboard folder, open the folder to run the CMS dashboard.

## ADD CREDENTIAL TO PROJECT <a href="#add-credential-to-project" id="add-credential-to-project"></a>

Inside the project folder, there will be a folder called **src**. Once you navigate to the **src** folder you will see a folder called **environments** where the application's **api\_keys** and the server connection URL is stored.![](https://gblobscdn.gitbook.com/assets%2F-M5WxZmimXAJIlsmznFC%2F-MO51KxtLI_nrm2N3npa%2F-MO51Wg_ODRM77-LcJOC%2F6%20\(1\).png?alt=media\&token=ba21d506-b398-4c90-808f-c5118a268942)![](https://gblobscdn.gitbook.com/assets%2F-M5WxZmimXAJIlsmznFC%2F-MO51KxtLI_nrm2N3npa%2F-MO51cFy7Sq1cQ-SEyc9%2F7%20\(1\).png?alt=media\&token=c18fdc03-f1ff-4577-b07d-f937e8298025)

Generally, for every application, there will be two environments i.e Development and Production. Similarly, **environments** folder will have three files to store development, testing and production environment configurations. environment.ts contains the development environment configuration, environment.test.ts contains testing environment configuration environment.prod.ts contains the production environment configuration.

UPDATE API URL TO CMS DASHBOARD. You need to change the value of the API endpoint in the file

`src/environments/environment.ts`

`apiEndPoint:` the value must be your deployed API URL.

Open the Terminal and navigate to the project folder`grocery-cms--dashboard`and install NodeJS dependencies. Please make sure you have node, npm, and [angular-cli](https://cli.angular.io/) installed before running the below command:

```
$ npm install
```

Once the packages get installed you may run the application by running the command below and you can see the app is running on your browser.

```
$ ng serve
```

## PRODUCTION RELEASE <a href="#production-release" id="production-release"></a>

You need to change the value of API endpoint in file src/environments/environment.prod.ts To build an app for production:

```
$ ng build --prod
```

The above command will create a dist directory that you can deploy on any Hosting. If there is any issue please google it or if you don't find any solution please feel free to report us, we will look into it.[<br>](https://docs.ionicfirebaseapp.com/online-grocery-shopping-and-delivery-system/website/web-app-installation)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.ionicfirebaseapp.com/multi-location-grocery/website/web-app-setup.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
