> For the complete documentation index, see [llms.txt](https://docs.spurtcommerce.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.spurtcommerce.com/getting-started/development-and-setup/store-front-setup/react-store-front.md).

# React Store Front

### Installation

**Step 1-**Download and Install node version of 14.17.2 and above 

**Step 2 -**

1-sudo apt update

2-sudo apt install curl

3-curl -sL <https://deb.nodesource.com/setup\\_14.x> | sudo bash -

4-sudo apt -y install nodejs

#### Go through the following steps

**Step 3 -** Extract the zip file of the project that is given to you.

**Follow the given navigation:**

**Step 4 -** Open store ->environment->.env.development , that file will look like as given below

For example: export const NEXT\_PUBLIC\_SERVER\_URL=''

export const NEXT\_PUBLIC\_IMAGE\_URL=''

export const NEXT\_PUBLIC\_VIDEO\_URL=''

**Step 5-** In .env.development, you have to set , as given below:

**Step 6 -** In NEXT\_PUBLIC\_SERVER\_URL, you have set endpoint path(e.g:"<http://localhost:9000/api/")which> will get while running api.

**Step 7-** In NEXT\_PUBLIC\_IMAGE\_URL, you have to give resize image api url path(e.g:"<http://localhost:9000/api/media/image-resize>").

**Step 8 -** In NEXT\_PUBLIC\_VIDEO\_URL, you have to give resize image api url path(e.g:"<http://localhost:9000/api/media/video-preview-s3/>").

Follow the next/Image configuration:

**Step 9-** Open store->next.config.js, that file will look like as given below

**for example:**

module.exports = { images: {

domains: \["Your API url for image"], //eg: - if your link is <https://your-image-url.com/> means you need to specify as your-image-url.com&#x20;

},

};

**Run the Project**

**Step 10 -** To install the dependencies related to the project, open the terminal and give the command

```
npm install 
```

and continue the following command to run the project

```
npm run dev
```

To build the application please follow the link [<mark style="color:blue;">React store front</mark> ](/frontend-deployment-setup/store-front-setup/react-store-front.md)in frontend deployment setup.