https://github.com/favourdaniel/containerization-of-react-and-django-app
HNG Task 2 - DevOps Track
https://github.com/favourdaniel/containerization-of-react-and-django-app
django docker javascript react
Last synced: 4 months ago
JSON representation
HNG Task 2 - DevOps Track
- Host: GitHub
- URL: https://github.com/favourdaniel/containerization-of-react-and-django-app
- Owner: FavourDaniel
- License: other
- Created: 2022-11-04T16:04:37.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-11-13T01:22:19.000Z (over 3 years ago)
- Last Synced: 2025-07-31T03:37:18.283Z (12 months ago)
- Topics: django, docker, javascript, react
- Language: JavaScript
- Homepage:
- Size: 521 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
# devops-django-react-task
## Here is your stage 2 task:
Your stage 2 task is centered around containerization :package:.
### :bulb:Task Details:
- You are provided a simple application with the frontend in JavaScript(React) and backend in Python(Django). This is the link to the [Repository](https://github.com/ibitolamayowa/devops-django-react-task). Follow instructions on how to deploy the application locally on your server. It should look like [this](https://drive.google.com/file/d/1NLHVwg37ExmjsGsbRFunEQ-Y8kZO8Jkz/view). NB: It should have your slack display name
- You are then required to build Docker images of the frontend and backend using a Dockerfile for each and push them to a docker repository eg docker hub, ecr etc.
- You are then required to create a docker-compose file that can spin up images into containers and are connected with one another. A simple docker-compose up should be able to start the application. If successful, the frontend application should run on port 3000 of your server IP.
- You are then required to use reverse proxy with NGINX to point port 3000 to the IP of your server.
- Push your code to GitHub, it should be in the following [format](https://drive.google.com/file/d/1I9nntQQE3MgYgnOED9dIAmtAZ6Kjdu_H/view).
### :bulb:Task Duration: 3 Days
## Backend development workflow
```json
virtualenv env
source env/bin/activate
pip install -r requirements.txt
python manage.py runserver
```
## Frontend development workflow
You are to update your name in ./frontend/components/App.js
```json
npm i
npm start
```
## For deploying
```json
npm run build
```
It should look like this if successful
