# How to setup your dev environment for editing & contributing code?

Playbooks is a web server application that interacts with a Django API server via Nginx. It also includes salary workers for scheduling asynchronous tasks and a persistence layer consisting of Postgres and Redis cache.

%[https://www.youtube.com/watch?v=OiwgXSncNuo] 

### Setup Phase

**Step 1:** Ensure a running instance of Postgres and Redis on the local machine. Installation guides are available for different machine types to set up Postgres and Redis. Alternatively, Docker can be used for the same purpose.

**Step 2:** Use the DB Docker Compose file located in the Docker folder to set up Postgres and Redis.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1724838550495/7bc5e607-7f5a-4534-a0e4-8bb5faf1550d.png align="center")

**Step 3:** Verify the setup by checking Docker Desktop to see if both instances are running.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1724838580729/21604d0a-6996-4535-9ab9-2192b003d0f3.png align="center")

### Build Phase

**Step 4:** Create all the tables and relations between them that the API server will use by running the command

```yaml
python manage.py migrate
```

**Step 5:** Confirm the creation of all tables and relations in the Postgres DB using a tool like Postico.

### Run Phase

**Step 6:** Start the API server on the local machine using the below command

```yaml
python manage.py runserver
```

The server will run on port 8000, but the port can be changed according to preference.

**Step 7:** Go to the web folder and use the following command to bring up the React application

```yaml
npm start
```

**Step 8:** Inside the web folder, use the command shown to start the Nginx server. This ensures the React application can connect with the Django application.

```yaml
nginx -c $PWD/nginx.local.conf -g "daemon off;"
```

**Step 9:** Once both servers are running, open a browser and go to localhost to see the running application.

### Testing Changes

**Step 10:** Test changes by creating a playbook and an HTTP task. For example, remove the method field in the API task and save the changes.

![](https://cdn.hashnode.com/res/hashnode/image/upload/v1724839051543/0c896b55-6811-456f-9493-9f25f53eafb4.png align="center")

**Step 11:** Django will load the changes and restart the server. Refresh the application platform and try to create an API task. The method field should be missing.

**Step 12:** To restore the method field, undo the changes, save, and refresh the page. Try to create the task again.

For further assistance with local setup, refer to the details mentioned in [the github project](https://github.com/DrDroidLab/playbooks). The contribution page includes a link to the playbook architecture and local setup guide.