Development
Local installation¤
Start by forking the project by clicking the Fork button up in the right corner in the GitHub. This makes a copy of the repository in your own name. Now you can clone this repository locally and start adding features:
To quickly run the tests install the local dependencies by running:
You also have to install this local django-components version. Use -e
for editable mode so you don't have to re-install after every change:
Running tests¤
Now you can run the tests to make sure everything works as expected:
The library is also tested across many versions of Python and Django. To run tests that way:
pyenv install -s 3.8
pyenv install -s 3.9
pyenv install -s 3.10
pyenv install -s 3.11
pyenv install -s 3.12
pyenv install -s 3.13
pyenv local 3.8 3.9 3.10 3.11 3.12 3.13
tox -p
To run tests for a specific Python version, use:
NOTE: See the available environments in tox.ini
.
Linting and formatting¤
To check linting rules, run:
To format the code, run:
To validate with Mypy, run:
You can run these through tox
as well:
Playwright tests¤
We use Playwright for end-to-end tests. You will need to install Playwright to run these tests.
Luckily, Playwright makes it very easy:
After Playwright is ready, run the tests the same way as before:
Dev server¤
How do you check that your changes to django-components project will work in an actual Django project?
Use the sampleproject demo project to validate the changes:
-
Navigate to sampleproject directory:
-
Install dependencies from the requirements.txt file:
-
Link to your local version of django-components:
Note
The path to the local version (in this case
..
) must point to the directory that has thepyproject.toml
file. -
Start Django server:
Once the server is up, it should be available at http://127.0.0.1:8000.
To display individual components, add them to the urls.py
, like in the case of http://127.0.0.1:8000/greeting
Building JS code¤
django_components uses a bit of JS code to:
- Manage the loading of JS and CSS files used by the components
- Allow to pass data from Python to JS
When you make changes to this JS code, you also need to compile it:
-
Navigate to
src/django_components_js
: -
Install the JS dependencies
-
Compile the JS/TS code:
The script will combine all JS/TS code into a single
.js
file, minify it, and copy it todjango_components/static/django_components/django_components.min.js
.
Documentation website¤
The documentation website is built using MkDocs and Material for MkDocs.
First install dependencies needed for the documentation:
Then install this local django-components version. Use -e
for editable mode so you don't have to re-install after every change:
To run the documentation server locally, run:
Then open http://127.0.0.1:9000/django-components/ in your browser.
To just build the documentation, run:
The documentation site is deployed automatically with Github actions (see .github/workflows/docs.yml
).
The CI workflow runs when:
- A new commit is pushed to the
master
branch - This updates thedev
version - A new tag is pushed - This updates the
latest
version and the version specified in the tag name
Publishing¤
We use Github actions to automatically publish new versions of django-components to PyPI when a new tag is pushed. See the full workflow here.
Commands¤
We do not manually release new versions of django-components. Commands below are shown for reference only.
To package django-components into a distribution that can be published to PyPI, run build
:
# Install pypa/build
python -m pip install build --user
# Build a binary wheel and a source tarball
python -m build --sdist --wheel --outdir dist/ .
To then publish the contents of dist/
to PyPI, use twine
(See Python user guide):
Release new version¤
Let's say we want to release a new version 0.141.6
. We need to:
-
Bump the
version
inpyproject.toml
to the desired version. -
Create a summary of the changes in
CHANGELOG.md
at the top of the file.When writing release notes for individual changes, it's useful to write them like mini announcements:
- Explain the context
- Then the change itself
- Then include an example
# Release notes ## v0.141.6 _2025-09-24_ #### Fix - Tests - Fix bug when using `@djc_test` decorator and the `COMPONENTS` settings are set with `ComponentsSettings` See [#1369](https://github.com/django-components/django-components/issues/1369)
Note
When you include the release date in the format
_YYYY-MM-DD_
, it will be displayed in the release notes.See
docs/scripts/gen_release_notes.py
for more details. -
Create a new PR to merge the changes above into the
master
branch. -
Create new release in Github UI.
Semantic versioning¤
We use Semantic Versioning for django-components.
The version number is in the format MAJOR.MINOR.PATCH
(e.g. 0.141.6
).
MAJOR
(e.g.1.0.0
) is reserved for significant architectural changes and breaking changes.MINOR
(e.g.0.1.0
) is incremented for new features.PATCH
(e.g.0.0.1
) is incremented for bug fixes or documentation changes.
Development guides¤
Head over to Dev guides for a deep dive into how django_components' features are implemented.
Maintenance¤
Updating supported versions¤
The scripts/supported_versions.py
script can be used to update the supported versions.
This will check the current versions of Django and Python, and will print to the terminal all the places that need updating and what to set them to.
Updating link references¤
The scripts/validate_links.py
script can be used to update the link references.
When new version of Django is released, you can use the script to update the URLs pointing to the Django documentation.
First, you need to update the URL_REWRITE_MAP
in the script to point to the new version of Django.
Then, you can run the script to update the URLs in the codebase.
Project management¤
Project board¤
We use the GitHub project board to manage the project.
Quick overview of the columns:
- No status - Issues that are not planned yet and need more discussion
- 🔵 Backlog - Planned but not ready to be picked up
- 🟢 Ready - Ready to be picked up
- 🟡 In Progress - Someone is already working on it
- 🟣 Ready for release - Completed, but not released yet
- 🟠Done - Completed and released
New issues are automatically added to the No status column.
To pick up an issue, assign it to yourself and move it to the 🟡 In Progress column.
Use the sidebar to filter the issues by different labels, milestones, and issue types:
Priority¤
Which issues should be picked up first?
We suggest the following guideline:
- Bugs - First fix bugs and documentation errors.
- V1 release - Then pick up issues that are part of the v1 release milestone.
After that, pick what you like!
Labels¤
Labels help keep our project organized. See the list of all labels here.
Milestones¤
milestone--v1
- Work to be done for the V1 release.
Issue types¤
type--bug
- Bugs.type--documentation
- Documentation changes.type--enhancement
- New features and improvements.type--integration
- Integrating with other libraries or systems.type--operations
- Relating to "operations" - Github Actions, processes, etc.type--optimisation
- Optimizing the code for performance.