Dockerize Django with Nextjs

A Bootstrapped Template of Django with Nextjs using Docker!

Stack

• Next Js - The React Framework for the Web.
• Django - Django makes it easier to build better web apps more quickly and with less code.
• Typescript - JavaScript with syntax for types.
• Docker - Docker is a platform designed to help developers build, share, and run modern applications. We handle the tedious setup, so you can focus on the code.
• Nginx - Advanced Load Balancer, Web Server, & Reverse Proxy.

Project structure

$PROJECT_ROOT
│  
├── apps/web  # Django Backend
│  
├── apps/docker  # Docker files for web, www, nginx
│  
├── apps/www  # Nextjs App
│   
├── apps/web/requirements # Python Requirements
│
├── app.py # Entry Point for Django Backend
│
├── apps/web/manage.py # Run Django Commands
│
├── apps/www/package.json # npm commands.

---

Get the Code

• Clone Repo

mkdir dockerize-django-with-nextjs
cd dockerize-django-with-nextjs
git clone https://github.com/codingforinnovations/dockerize-django-with-nextjs .

• Using Docker

docker-compose up --build

Open Django Server in : http://0.0.0.0:8000

Open Django Admin in : http://0.0.0.0:8000/admin

Open Nextjs Server in : http://0.0.0.0

Manual Way:

For Django:

• Create Virtual Environment for Python

pip install virtualenv
python -m venv .

• Activate Virtual Environment

source Scripts/activate

Window Users use: .\Scripts\activate

• Install Dependencies

pip install -r apps/web/requirements.txt

• Make Migrations

python manage.py apps/web/makemigrations
python manage.py apps/web/migrate

For Frontend

• Install Dependencies

npm install --prefix apps/www

• Run Dev Server

npm run dev

• Now for Bundling Your Frontend

npm run build

LICENSE:

MIT LICENSE .

Change Log:

Change Log .