๐ Frontend: React (Vite)
โ๏ธ Backend: Django (Gunicorn)
๐ Monitoring: Prometheus
๐ CI/CD: GitHub Actions
StayConnected is a full-stack web application powered by React and Django. It supports containerized deployment using Docker and features a robust monitoring system with Prometheus. This guide covers how to run the application both with and without Docker.
| Component | Technology |
|---|---|
| Frontend | React (Vite) - API-based |
| Backend | Django (Gunicorn) - API-based |
| Database | PostgreSQL |
| Proxy | Nginx |
| Containerization | Docker & Docker Compose |
| Monitoring | Prometheus |
| CI/CD | GitHub Actions |
If you prefer to run the project without Docker, follow these instructions:
- Create a virtual environment
python3 -m venv venv
python3 -m venv venv
source venv/bin/activate
pip install --upgrade pip
pip install -r requirements.txt
5๏ธโฃ แแแแ แแชแแแแแก แจแแฅแแแ แแ แแแแแกแขแฃแ แแแ
python manage.py makemigrations python manage.py migrate
python manage.py runserver ๐ฅ๏ธ Frontend Setup bash Copy code
cd frontend
npm install
npm run dev Once running, visit:
แคแ แแแขแแก แแแฃแแ: http://localhost:8080 แแแฅแแก แแแฃแแ: http://localhost:8000 2๏ธโฃ แแแแแ แแ แแแจแแแแแก แแแกแขแ แฃแฅแชแแ Run frontend, backend, Nginx, and PostgreSQL services using Docker Compose.
๐ แกแ แฃแแ แแแแแ แแ แแแจแแแแแก แแแกแขแ แฃแฅแชแแ Run the following commands from the root project directory (stayconnected/).
1๏ธโฃ Stop and clean up any previous containers, volumes, and networks แแแแแ แแแ แแ แฌแแจแแแแ แฌแแแ แแแแขแแแแแ แแแ, แแแแฃแแแแ แแ แฅแกแแแแแ
docker compose down --volumes --remove-orphans
2๏ธโฃ Build Docker images for backend, frontend, and other services แแแแแ แแแแฏแแก แแแแแแแแ แแแฅแแกแแแแก, แคแ แแแขแแกแแแแก แแ แกแฎแแ แกแแ แแแกแแแแกแแแแก
docker compose build
3๏ธโฃ Start the Docker containers in detached mode แแแแแ แแก แแแแขแแแแแ แแก แแแจแแแแ แแแขแแฉแ แแแฃแแจแ.
docker compose up -d ๐ แแแแแ แแแ แแแแขแแแแแ แแแแก แแแแแแแก แกแแแแฎแแแแ:
docker logs backend_container docker logs frontend_container docker logs nginx_container docker logs postgres_db ๐ แแแแแชแแแแ แแแแก แแแแ แแชแแแแแก แแแจแแแแ docker exec backend_container python manage.py makemigrations docker exec backend_container python manage.py migrate ๐๏ธ Create Superuser (Optional)
docker exec -it backend_container python manage.py createsuperuser ๐ก Note: These commands should be run in the root folder (stayconnected/) where the docker-compose.yml file is located.
๐งช แขแแกแขแแ แแแ Run the following commands to check that everything is running smoothly.
docker logs backend_container docker logs frontend_container docker logs nginx_container docker logs postgres_db If the backend is working, you should see:
แแแฅแ: http://localhost:8000/admin/
แคแ แแแขแ: http://localhost:8080
Full App (via Nginx): http://localhost/
๐ CI/CD with GitHub Actions
This project includes a GitHub Actions CI/CD pipeline.
Whenever you push to the main branch, the following tasks are triggered:
โ แแแแแ แแ แขแแกแขแแ แแแ: แแ แฌแแฃแแแแแแ แ แแ แแ แแแฅแขแ แแจแแแแ แฎแแ แแแแแแแก แแแ แแจแ โ Lint แขแแกแขแแแ: แแแแ แแแแแขแแแ แแแคแแแแแแแขแแแแ โ Run แขแแกแขแแแ: แแ แฌแแฃแแแแแแ แ แแ แแ แชแแ แแ แฎแแ แแแแ แแ แแ แแ แแแแฅแจแแแแ แแแจแแแแแแแ
แกแแญแแ แ แแแแแแแแแ: git pull git add . git commit -m "Deploy new changes" git push origin main You can find the GitHub Actions workflow in .github/workflows/ci.yml. docker ps See all running containers docker logs backend_container View backend container logs docker exec -it backend_container bash Shell access into backend container docker compose down Stop all Docker containers docker compose up -d Start all services in detached mode python manage.py createsuperuser Create an admin superuser ๐ License This project is licensed under the MIT License. See the LICENSE file for details.
๐ แแแแขแ แแแฃแขแแ แแแ D DevOps - แกแแ แแ แแแแแแแจแแแแ, แแแแ แจแแคแแฅแแซแ Team Developers >>> React แกแแคแแแ แแแแแแจแแแแ (TEAM LEAD) React แแแ แแฃแแฃแแแจแแแแ React แแแ แแแแ แกแแแฎแแ แแซแ React แแแแแ แแแแแแ Python advance แแแแ แแแแ แแซแ Python advance แแแแ แแ แแแแกแฃแ แแซแ iOS แกแแแแ แ แแแ แแแแแ iOS แแแแแ แแฃแแแแ
โญ แคแแแแแฅแแแ If you have any issues or questions, feel free to create a GitHub issue or submit a pull request.
This README.md is a comprehensive guide to help you set up, run, and troubleshoot the StayConnected project. Let me know if you'd like any edits, improvements, or additional details! ๐
แขแแฅแกแขแฃแ แ แแแกแขแ แฃแฅแชแแแแ:
แคแ แแแขแแแแ - React แแแฅแแแแ - Django แแแแแขแแ แแแแ - Prometheus CI/CD - Github Actions
แแ แแแฅแขแแก แแแกแแจแแแแแ แกแแญแแ แแ แคแ แแแขแแ แแ แแแฅแแ แแแแฃแจแแแ แจแแกแแแแแแกแ แแ แซแแแแแแแ>>>
แฏแแ แแฃแจแแแแ แแแฅแแแแก:
python3 -m venv venv
source venv/bin/activate
3. แแแแแฎแแแแ pip-แก (แกแฃแ แแแแแกแแแแแ , แแฃแแชแ แกแแกแฃแ แแแแแ)
pip install --upgrade pip
pip install -r requirements.txt
python manage.py makemigrations
python manage.py migrate
python manage.py runserver
แจแแแแแแ แคแ แแแขแแแแก: npm install npm run dev
for dockerized version (backend)
docker compose down --volumes --remove-orphans
docker compose build
docker compose up -d
docker logs backend_container
docker exec backend_container python manage.py makemigrations docker exec backend_container python manage.py migrate
docker exec -it backend_container python manage.py createsuperuser