This page gets labb installed and the CSS watcher running. Start a new project with labbstart, which scaffolds one already configured, or add labb to a Django project you already have.
Prerequisites: Python 3.8+ and Django 4.2+.
Set up your project
Install labbstart
labbstart scaffolds a new Django project with labb already configured.
pip install labbstart
Scaffold your project
Run the generator. It prompts for the project name, Django version, package manager, and starter kit:
labbstart new
Or pass the choices as flags:
labbstart new myproject --django-version 5 --package-manager poetry --kit welcome --app-name starter
Run it
Start two terminals: the CSS watcher and the Django server.
# Terminal 1: CSS watcher
cd your-project-name && labb dev
# Terminal 2: Django server
cd your-project-name && python manage.py runserver
Open localhost
Visit http://localhost:8000 and you are ready to build.
Install labbui
pip install labbui
Or with Poetry:
poetry add labbui
Add to Django settings
Add labb to your INSTALLED_APPS. This automatically configures the required template loader and templatetags.
INSTALLED_APPS = [
# ... other apps
'django_cotton',
'labb',
]
django_cotton.apps.SimpleAppConfig instead:
INSTALLED_APPS = [
# ... other apps
'django_cotton.apps.SimpleAppConfig',
'labb',
]
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [BASE_DIR / 'templates'],
'APP_DIRS': False,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
'loaders': [
(
'django.template.loaders.cached.Loader',
[
'django_cotton.cotton_loader.Loader',
'django.template.loaders.filesystem.Loader',
'django.template.loaders.app_directories.Loader',
],
)
],
'builtins': [
'django_cotton.templatetags.cotton',
],
},
},
]
Set up Tailwind and daisyUI
Initialize the project and install the Node.js dependencies that power the CSS build:
labb init --defaults
labb setup
labb init creates the project configuration and structure. labb setup installs the required Node.js dependencies.
Add <c-lb.m.dependencies /> to your base template's <head>:
{% load lb_tags %}
<!DOCTYPE html>
<html lang="en" {% labb_theme %}>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My labb App</title>
<c-lb.m.dependencies setThemeEndpoint="{% url 'set_theme' %}" />
</head>
<body>
{% block content %}{% endblock %}
</body>
</html>
<c-lb.m.dependencies />, components will not have the correct styling and interactive features may not work.
Keep the CSS watcher running while you develop:
labb dev
Icons are a separate package. If you want them, the Icons page covers installing labbicons and using it.
Run the server
Start Django in a second terminal, with the watcher still running in the first:
python manage.py runserver
Open http://localhost:8000. labb is installed.