Repository files navigation

Powered byCookiecutter, Cookiecutter React Django combines the capabilities of Django as a backend service with the flexibility and ease of use of React into the least opinionated framework possible that allows you to jumpstart a production-ready web application.

• Documentation:https://cookiecutter-react-django.readthedocs.io/en/latest/

• Latest versions of Python, Django and React: With the latest security updates and the newest features available.

• Docker: Your app becomes a lightweight, standalone, executable package of software.

• WhiteNoise: Radically simplify static file serving for your web app.

• Heroku ready: Create an app, set up the configuration and deploy.

Let's assume that you want to create a project called "hello_world", one that makes a separation between a React-based front end and a Django-based backend, all set up locally using Docker and production ready in Heroku.

Most tutorials will give you a partial solution, so the only way is painstakingly piecing it together from multiple guides/tutorials that did some aspect of what you want without covering the whole.

Side projects don't exactly require optimal productivity, but, unlike jobs, if they become a pain to work on, it's pretty easy to just quit.

Instead, we can do as follows. First, get Cookiecutter:

$ pip install "cookiecutter>=1.7.0"

Now run it against this repo:

$ cookiecutter https://github.com/ohduran/cookiecutter-react-django

You'll be prompted for some values. Provide them, then the project will be created for you.

Now, on your terminal, simply dodocker-compose up --build, and wait for the containers to build. Eventually, you'll be able to see the index page by going tohttp://127.0.0.1/:

You will be able to see the following:

Write something on that box over there, it will get you the number of characters via your Django API!

To learn more about contributing, please readour contributing docs.

If you're new to Heroku, theirgetting started guide will walk you through the basics of creating a generic, non-dockerized Python app. If you don’t have it yet, install theHeroku CLI.

1. We can create a Heroku app by runningheroku create within our project. Once you've done it, Heroku will provide you with the following message:

   Creating app... done, ⬢ one-example-12345https://one-example-12345.herokuapp.com/ | https://git.heroku.com/one-example-12345.git

   In this case,one-example-12345 is the name of the app; yours is likely to be different.

2. Make sure you link the Heroku app with your repository by runningheroku git:remote -a [app name].

3. For environment variables in production, you can set the config variables by running the following command:

   heroku config:set PRODUCTION_HOST=[app name].herokuapp.com SECRET_KEY=[your secret key] DJANGO_SETTINGS_MODULE=backend.settings.production

   You can generate a valid Django Secret Key viathis link. REMEMBER to put the key between apostrophes ('), or you will likely get a-bash: ****: event not found

4. Now runheroku stack:set container to tell our Heroku app to use Docker.

5. At this point, you're ready to deploy: rungit push heroku master.

6. Checkout https://[app name].herokuapp.com. You should be able to see your web app ready!