/django-react-nginx-mysql-docker

React, Django, MySQL with Docker

Primary LanguagePython

django-react-nginx-mysql-docker

There are 4 images on use: the MySQL image, the Nginx Image, the Django Image, and the React Image.

Content Table

Installation

  1. Clone the repo from GitHub and start containers:

    git clone <repo>
cd <repo>
cp simple_env_conf.env .env
docker-compose build
docker-compose up
docker-compose run backend ./manage.py collectstatic
docker-compose run backend ./manage.py migrate

  2. (optional) To access React's project main page go to http://localhost/ while to go to Django Admin follow the link http://localhost/admin.

  3. (optional) To create a super-user for Django run

    docker-compose run backend ./manage.py createsuperuser

Structure and Folders

  • The mysql_data folder contains the data generated by MySQL Database.
  • The Backend folder contains the Django dockerfile and the project is at Backend/django_backend.
  • The Frontend folder contains the React dockerfile and the project is at Frontend/react_frontend.
  • The Nginx folder contains the Nginx server configuration file and the dockerfile.

Environment Variables

  • MYSQL_USER, MYSQL_PASSWORD, and MYSQL_DATABASE store the credentials of the database.
  • MYSQL_DATA_DIR The directory to store MySQL data (currently mysql_data inside project root folder).
  • HOST_MACHINE_X_PORT These variables store the default port for service X.
  • The environment variables for the Django Project are at the Backend/django_backend/django_backend/settings/.env file.

Web Server Config (Nginx)

The server has been configured such that the Django Admin can be accessed when /admin is used in the Url, and the api_django_app (not created yet) can be accessed whenever /api is used. The rest points to React (except for the static files urls).

Django Config

The Django project has multiple settings.py files for the different environments: development, testing, production, ...; the current one in use is the dev.py (for the development stage). As the default config, the project uses a MySQL database already configured in the dev.py.

NOTE: There is no app created yet.

React Config

The React project has no custom configuration and has been set to the default settings.