https://github.com/app-generator/sample-docker-django-react
Docker Sample - Django & React (open-source) | AppSeed
https://github.com/app-generator/sample-docker-django-react
appseed-sample django docker react
Last synced: about 1 year ago
JSON representation
Docker Sample - Django & React (open-source) | AppSeed
- Host: GitHub
- URL: https://github.com/app-generator/sample-docker-django-react
- Owner: app-generator
- License: other
- Created: 2022-11-18T16:31:29.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-11-21T16:39:51.000Z (over 3 years ago)
- Last Synced: 2025-03-11T05:55:54.985Z (over 1 year ago)
- Topics: appseed-sample, django, docker, react
- Language: JavaScript
- Homepage: https://blog.appseed.us/dockerize-react-django-free-sample/
- Size: 1.94 MB
- Stars: 6
- Watchers: 2
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
# [Dockerized React & Django](https://blog.appseed.us/dockerize-react-django-free-sample/) `sample`
Full-Stack Seed project generated by **[React App Generator](https://appseed.us/generator/react/)** top of *Horizon Ui* design. The backend logic is provided by a simple, `easy-to-extend` API Server that manages the Authentication flow (login, registration, logout) using `JSON Web Tokens` (JWT).
- 👉 [React Horizon UI](https://react-horizon-ui-chakra.appseed-srv1.com/#/auth/sign-in/default) - LIVE Demo (from a similar product)
- 🚀 Built with [React App Generator](https://appseed.us/generator/react/), timestamp `2022-11-18 16:28`
## ✨ Start the app in Docker
> 👉 **Step 1** - Download the code from the GH repository (using `GIT`)
```bash
$ git clone https://github.com/app-generator/sample-docker-django-react.git
$ cd sample-docker-django-react
```
> 👉 **Step 2** - Start the APP in `Docker`
```bash
$ docker-compose up --build
```
> 👉 **Step 3** - `Migrate DB`
```bash
$ docker-compose run --rm appseed-app python manage.py makemigrations
$ docker-compose run --rm appseed-app python manage.py migrate
```
> 👉 **Step 4** - Access the `APP`
Visit `http://127.0.0.1:3000` in your browser. The App should be `up & running`.
## ✨ `React` Horizon UI
- Design crafted by *[Simmmple](https://simmmple.com/)*
- Styled with `Chakra UI`
- `Dark-Mode`, `RTL` Support
- `UI Kit`: 70+ components, `8 Sample Pages`, `3 Customized Plugins`
> `Tests` (compatibility matrix)
| NodeJS | NPM | YARN |
| --- | --- | --- |
| `v14.0.0` | ✅ | ✅ |
| `v16.0.0` | ✅ | ✅ |
| `v18.0.0` | ✅ | ✅ |
## ✨ `Django API` Features
- Stack: : `Django` / `DRF` / **SQLite**
- `Up-to-date dependencies`
- **DB Layer**: Django Native `ORM`, `SQLite` persistence
- **Auth**: JWT tokens managed via `PyJWT`
- [API Definition](https://docs.appseed.us/boilerplate-code/api-unified-definition) - the unified API structure implemented by this server
## ✨ How to use it
Being a full-stack product, the backend and the frontend should be compiled and started separately.
Before starting to compile the product, make sure you have the following tools installed in the environment:
- [NodeJS](https://nodejs.org/en/) - version `14.x` or higher
- [GIT](https://git-scm.com/) - used to clone tjhe sources from Github
- [Python3](https://www.python.org/) - used in many tools
### 👉 Start the Frontend
> **Step 1** - Once the project is downloaded, change the directory to `react-ui`.
```bash
$ cd react-ui
```
> **Step 2** - Install dependencies via NPM or yarn
```bash
$ npm i
// OR
$ yarn
```
> **Step 3** - Start in development mode
```bash
$ npm run start
// OR
$ yarn start
```
At this point, the app is available in the browser `localhost:3000` (the default address).
### 👉 Start the Backend Server
> **Step 1** - Change the directory to `api-server-django`
```bash
$ cd api-server-django
```
> **Step 2** - Install dependencies using a `virtual environment`
```bash
$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Virtualenv modules installation (Windows based systems)
$ # virtualenv env
$ # .\env\Scripts\activate
$
$ pip install -r requirements.txt
```
> **Step 3** - Setup the database
```bash
$ python manage.py makemigrations
$ python manage.py migrate
```
> **Step 4** - Start the API server (development mode)
```bash
$ python manage.py runserver 5000
```
Use the API via `POSTMAN` or `Swagger Dashboard` at `localhost:5000`.
---
[Dockerized React & Django](https://blog.appseed.us/dockerize-react-django-free-sample/) - `Sample Project` generated by **[App Generator](https://appseed.us/generator/)**.