{"id":16175276,"url":"https://github.com/app-generator/django-react-starter","last_synced_at":"2025-04-07T11:14:18.355Z","repository":{"id":149896383,"uuid":"622259048","full_name":"app-generator/django-react-starter","owner":"app-generator","description":"Django \u0026 React - Open-Source Starter | AppSeed","archived":false,"fork":false,"pushed_at":"2023-04-11T18:29:50.000Z","size":76,"stargazers_count":15,"open_issues_count":1,"forks_count":4,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-04-06T18:13:08.367Z","etag":null,"topics":["appseed","django-react","django-template"],"latest_commit_sha":null,"homepage":"https://blog.appseed.us/how-to-integrate-django-with-react/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/app-generator.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-04-01T15:31:06.000Z","updated_at":"2024-11-07T12:27:16.000Z","dependencies_parsed_at":null,"dependency_job_id":"894b353f-56f2-4a1a-b482-a07379fe253e","html_url":"https://github.com/app-generator/django-react-starter","commit_stats":null,"previous_names":[],"tags_count":3,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/app-generator%2Fdjango-react-starter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/app-generator%2Fdjango-react-starter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/app-generator%2Fdjango-react-starter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/app-generator%2Fdjango-react-starter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/app-generator","download_url":"https://codeload.github.com/app-generator/django-react-starter/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247640467,"owners_count":20971558,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["appseed","django-react","django-template"],"created_at":"2024-10-10T04:44:31.908Z","updated_at":"2025-04-07T11:14:18.328Z","avatar_url":"https://github.com/app-generator.png","language":"HTML","readme":"# [Django \u0026 React](https://blog.appseed.us/how-to-integrate-django-with-react/) `Codebase`\n\nOpen-source **Django Starter** bundled with React, React-Flow - Actively supported by AppSeed. The code for this starter is fully explained [here](https://blog.appseed.us/how-to-integrate-django-with-react/).\n\n- 👉 [Django \u0026 React](https://django-react-starter.onrender.com/charts) - `LIVE deployment`\n  - [ReCharts](https://django-react-starter.onrender.com/charts) `sample page`\n  - [ReactFlow](https://django-react-starter.onrender.com/flow) `sample page`\n- 🚀 Free [Support](https://appseed.us/support/) via `Email` \u0026 `Discord`\n\n\u003cbr /\u003e\n\n\u003e Feature: \n\n- 🚀 `Stack`: **Django** \u0026 **React**\n- ✅ Tooling: `Webpack`\n- ✅ `Design`: [Django Theme Datta](https://github.com/app-generator/django-admin-datta) - `Free Version`\n- ✅ `Sections` covered by the design:\n  - ✅ **Admin section** (reserved for superusers)\n  - ✅ **Authentication**: `Django.contrib.AUTH`, Registration\n  - ✅ **All Pages** available in for ordinary users \n- 🚀 `Deployment`: Docker, `CI/CD` flow via `Render`\n  \n\u003cbr /\u003e\n\n[![Django \u0026 React - Open-Source Starter](https://user-images.githubusercontent.com/51070104/230912843-2c670ac7-2ce6-4289-8e00-7ccca1f3a67f.gif)](https://blog.appseed.us/how-to-integrate-django-with-react/)\n\n\u003cbr /\u003e \n\n## Start with `Docker`\n\n\u003e 👉 **Step 1** - Download the code from the GH repository (using `GIT`) \n\n```bash\n$ git clone https://github.com/app-generator/django-react-starter.git\n$ cd django-react-starter\n```\n\n\u003cbr /\u003e\n\n\u003e 👉 **Step 2** - Start the APP in `Docker`\n\n```bash\n$ docker-compose up --build \n```\n\nVisit `http://localhost:5085` in your browser. The app should be up \u0026 running.\n\n\u003cbr /\u003e\n\n## Manual Build\n\n\u003e Download the code \n\n```bash\n$ git clone https://github.com/app-generator/django-react-starter.git\n$ cd django-react-starter\n```\n\n\u003cbr /\u003e\n\n### 👉 Build `React Frontend`\n\n```bash\n$ yarn       # Install React\n$ yarn dev   # development build (with LIVE Reload)\n$ yarn build # production build\n```\n\n\u003cbr /\u003e\n\n### 👉 Build `Django Backend` \n\n\u003e Install modules via `VENV`  \n\n```bash\n$ virtualenv env\n$ source env/bin/activate\n$ pip install -r requirements.txt\n```\n\n\u003cbr /\u003e\n\n\u003e Set Up Database\n\n```bash\n$ python manage.py makemigrations\n$ python manage.py migrate\n```\n\n\u003cbr /\u003e\n\n\u003e Start the APP\n\n```bash\n$ python manage.py createsuperuser # create the admin\n$ python manage.py runserver       # start the project\n```\n\nAt this point, the app runs at `http://127.0.0.1:8000/`. \n\n\u003cbr /\u003e\n\n## `Charts` Provisioning\n\nOpen the Django shell and create manually new records: \n\n```python\n$ python manage.py shell\n\u003e\u003e\u003e from apps.home.models import Sales\n\u003e\u003e\u003e\n\u003e\u003e\u003e s1 = Sales() # Use the default country `USA`\n\u003e\u003e\u003e s1.save()\n\u003e\u003e\u003e\n\u003e\u003e\u003e s2 = Sales() # Use the default country `USA`\n\u003e\u003e\u003e s2.save()\n\u003e\u003e\u003e \n\u003e\u003e\u003e s3 = Sales()\n\u003e\u003e\u003e s3.country = 'ger' # Create a sale from `Germany`\n\u003e\u003e\u003e s3.save()\n\u003e\u003e\u003e \n\u003e\u003e\u003e s4 = Sales()\n\u003e\u003e\u003e s4.country = 'france' # Ans another one from France\n\u003e\u003e\u003e s4.save()\n```\n\nOnce the information is saved, the `/charts` route should render the information:\n\n![Django \u0026 ReCharts](https://user-images.githubusercontent.com/51070104/230713648-a55e1ccf-ddc6-4d65-b7b3-d840a8a7e254.png)\n\n\u003cbr /\u003e\n\n## Codebase Structure\n\nThe project is coded using a simple and intuitive structure presented below:\n\n```bash\n\u003c PROJECT ROOT \u003e\n   |\n   |-- core/                            \n   |    |-- settings.py      # Project Configuration  \n   |    |-- urls.py          # Project Routing\n   |\n   |-- apps/\n   |    |-- home/            # Handle the default route  \n   |\n   |-- frontend/             # React Code\n   |\n   |-- requirements.txt      # Project Dependencies\n   |-- manage.py             # Start the app - Django default start script\n   |\n   |-- ************************************************************************\n```\n\n\u003cbr /\u003e\n\n---\n[Django \u0026 React](https://blog.appseed.us/how-to-integrate-django-with-react/) `Codebase` - `Open-Source` starter crafted by **[AppSeed](https://appseed.us)**.\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fapp-generator%2Fdjango-react-starter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fapp-generator%2Fdjango-react-starter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fapp-generator%2Fdjango-react-starter/lists"}