Skip to content

Django Starter Project, including TailWindCSS and all other useful modules

License

Notifications You must be signed in to change notification settings

collove/DjangoTailwindTemplate

Repository files navigation


This project is still in its early stages of development. Any contributions to the repo is very welcomed. 🤍

Django Starter Project, Including TailWindCSS and all other useful modules used in my projects.

🧰 Features

📽️ Demo

Demo

📜 How to Run

Clone the repository and follow the steps bellow:

1. Create a new virtual environment .venv for your project

virtualenv .venv && source .venv/bin/activate

2. Install the requirements

python3 -m pip install -r requirements.txt
python3 manage.py tailwind install

3. Create both ./config/local_settings.py and .env files and write the following contents in them

touch ./config/local_settings.py && touch .env
# local_settings.py
DEBUG = True
ALLOWED_HOSTS = []

Generate a new Django SECRET_KEY using Djecrety and paste it in the .env file in the root path of the project as follows

SECRET_KEY=<COPIED SECRET_KEY HERE>

4. Create an application

Create a new Django app in your project

python3 manage.py startapp myapp

Append your local application to INSTALLED_APPS inside settings.py

Create your URL, Template and views

You can extend your templates from base/_base.html

5. Migrate 🦋

You need to create migration files (if you have any changes in your models) and run migrate command to apply them.

python3 manage.py makemigrations
python3 manage.py migrate

6. Run your local server

Start TailWindCSS by running the following command in your terminal:

python3 manage.py tailwind start

Then you simply need to run Django's local server:

python3 manage.py runserver

7. Start Exploring 🚀

That's all you need to do for having a ready-to-develop Django project with some 🔋 included.

❓ How to use Crispy Forms

Current version (crispy-tailwind/0.5) allows the |crispy filter to be used to style your form. In your template:

  1. Load the filter: {% load tailwind_filters %}
  2. Apply the crispy filter: {{ form|crispy }}

You can also use the {% crispy %} tag to allow usage of crispy-forms' FormHelper and Layout. In your template:

  1. Load the crispy tag: {% load crispy_forms_tags %}
  2. Add FormHelper to your form and use crispy-forms to set-up your form
  3. Use the crispy tag {% crispy form %} in your template

Visit Crispy Forms Documentation and crispy-tailwind repository for more information.

🌈 Next Steps

🎟️ Contributing

Contributions, issues and feature requests are welcome! See CONTRIBUTING.

🌟 Support

Give the repository a ⭐ if you found it helpful please.

🛡️ License

This project is being licensed under the MIT License.

📎 Links

  • I recommend you to have a 👀 at DjangoX, one of the best starter project repos for Django. This repository uses Bootstrap and inspired me to create what you are looking at now.