{"id":2091,"library":"laces","title":"Laces - Django UI Components","description":"Laces is a Python library that provides a simple way to create self-rendering UI components for Django applications. It combines Python objects (data) with their corresponding Django templates, allowing components to be easily rendered in any parent template using a custom template tag. This approach helps in avoiding redundant data structuring and is particularly useful for nested components. The current version is 0.1.2, and releases occur semi-regularly, often driven by feature additions or bug fixes, with some significant gaps between versions.","status":"active","version":"0.1.2","language":"en","source_language":"en","source_url":"https://github.com/tbrlpld/laces","tags":["Django","components","UI","frontend","templating","Wagtail"],"install":[{"cmd":"pip install laces","lang":"bash","label":"Install with pip"}],"dependencies":[{"reason":"Core framework dependency for component rendering and integration.","package":"Django","optional":false}],"imports":[{"symbol":"Component","correct":"from laces.components import Component"},{"note":"Useful for combining JavaScript and CSS assets from multiple components.","symbol":"MediaContainer","correct":"from laces.components import MediaContainer"}],"quickstart":{"code":"import os\nimport django\nfrom django.conf import settings\nfrom django.template.backends.django import DjangoTemplates\nfrom django.urls import path\nfrom django.http import HttpResponse\nfrom django.shortcuts import render\n\n# Minimal Django setup (for demonstration purposes)\nos.environ.setdefault('DJANGO_SETTINGS_MODULE', 'myproject.settings')\nsettings.configure(\n INSTALLED_APPS=[\n 'django.contrib.admin',\n 'django.contrib.auth',\n 'django.contrib.contenttypes',\n 'django.contrib.sessions',\n 'django.contrib.messages',\n 'django.contrib.staticfiles',\n 'laces' # Crucial: add 'laces' to INSTALLED_APPS\n ],\n TEMPLATES=[\n {\n 'BACKEND': 'django.template.backends.django.DjangoTemplates',\n 'DIRS': [os.path.join(os.path.dirname(__file__), 'templates')],\n 'APP_DIRS': True,\n 'OPTIONS': {\n 'context_processors': [\n 'django.template.context_processors.debug',\n 'django.template.context_processors.request',\n 'django.contrib.auth.context_processors.auth',\n 'django.contrib.messages.context_processors.messages',\n ],\n },\n },\n ],\n ROOT_URLCONF=__name__,\n DEBUG=True,\n SECRET_KEY=os.environ.get('DJANGO_SECRET_KEY', 'a-very-secret-key-for-dev'),\n STATIC_URL='/static/'\n)\ndjango.setup()\n\n# 1. Define your component\nfrom laces.components import Component\n\nclass GreetingComponent(Component):\n template_name = \"components/greeting_component.html\"\n\n def get_context_data(self, parent_context=None):\n # You can access parent_context if rendering within another component/template\n return {\"name\": self.name, \"greeting_message\": f\"Hello, {self.name}!\"}\n\n def __init__(self, name=\"World\", **kwargs):\n super().__init__(**kwargs)\n self.name = name\n\n# 2. Create Django template files\n# Save this as 'templates/components/greeting_component.html'\n#

\n\n# Save this as 'templates/home.html'\n# {% load laces %}\n# \n# \n# Laces Quickstart\n# \n#

Laces Example

\n# {% component component_instance %}\n# {% component another_component_instance %}\n# \n# \n\n# 3. Create a Django view\ndef home_view(request):\n component_1 = GreetingComponent(name=\"Alice\")\n component_2 = GreetingComponent(name=\"Bob\")\n return render(request, \"home.html\", {\n \"component_instance\": component_1,\n \"another_component_instance\": component_2\n })\n\n# 4. Define URLs\nurlpatterns = [\n path('', home_view, name='home'),\n]\n\n# To run this minimal example, you would typically save the templates\n# and then run the Django development server.\n# For an actual project:\n# 1. Ensure 'templates/components/greeting_component.html' exists with content:

\n# 2. Ensure 'templates/home.html' exists with content as above.\n# 3. Add 'laces' to INSTALLED_APPS in your project's settings.py.\n# 4. Define your component in an app's components.py (e.g., myapp/components.py).\n# 5. Use the component in a view and pass it to your template.\n","lang":"python","description":"This quickstart demonstrates how to set up and render a basic Laces component within a Django project. It includes the necessary Django settings configuration, component definition, and template usage with the `{% component %}` tag."},"warnings":[{"fix":"Refer to the GitHub changelog before upgrading to new minor versions for potential breaking changes. Test upgrades thoroughly.","message":"The `laces` library (PyPI package `laces`) is listed with a 'Development Status :: 3 - Alpha' classifier on PyPI. While it is used internally by Wagtail, this status technically implies that the API might not be fully stable and could undergo breaking changes in minor releases.","severity":"gotcha","affected_versions":"0.1.x"},{"fix":"In your `settings.py`, add `INSTALLED_APPS = ['laces', ...]`.","message":"You must explicitly add `'laces'` to your `INSTALLED_APPS` setting in Django for the component template tag and other features to be discovered and registered.","severity":"gotcha","affected_versions":"All versions"},{"fix":"Add `{% load laces %}` at the beginning of your Django template files that render Laces components.","message":"The `{% component %}` template tag requires `{% load laces %}` at the top of any Django template where it is used.","severity":"gotcha","affected_versions":"All versions"},{"fix":"If on Wagtail < 6.0, continue using `wagtail.admin.ui.components.Component` and `{% load wagtailadmin_tags %}`. If migrating to Wagtail 6.0+, you can safely switch to or use `laces` imports interchangeably.","message":"For projects using Wagtail versions *prior* to 6.0, it is recommended to continue using Wagtail's native component imports (`wagtail.admin.ui.components` and `wagtail.admin.templatetags.wagtailadmin_tags`). While Laces components are now integrated into Wagtail 6.0+, using Laces directly in older Wagtail versions could lead to conflicts or unexpected behavior.","severity":"deprecated","affected_versions":"Wagtail < 6.0"}],"env_vars":null,"last_verified":"2026-04-09T00:00:00.000Z","next_check":"2026-07-08T00:00:00.000Z"}