# Django Frontend Kit
**Django Frontend Kit** is an opinionated frontend scaffolder for Django that integrates seamlessly with ViteJS, offering a streamlined setup for modern frontend tooling within your Django projects.
---
## Installation
Via pip into a virtualenv:
```bash
pip install django-frontend-kit
```
In settings.py add the following:
Add `frontend_kit` to `INSTALLED_APPS`:
```python
INSTALLED_APPS = [
...
"frontend_kit",
]
```
frontend_kit will look for a `frontend` directory in the setting `DJFK_FRONTEND_DIR`.
It is recommend to put the `frontend` directory in the root of your project.
```python
DJFK_FRONTEND_DIR = BASE_DIR / "frontend"
TEMPLATES = [
{
...
"DIRS": [DJFK_FRONTEND_DIR],
...
}
]
```
By default, frontend_kit will use vite's dev server for development, and
will use built assets for production using the generated manifest.json from vite.
Set dev server url:
```python
VITE_DEV_SERVER_URL = "http://localhost:5173/"
```
In production, we need to build the frontend assets, so set the output dir and
add the same to `STATICFILES_DIRS` so django can collect staticfiles:
```python
DJFK_VITE_OUTPUT_DIR = os.environ.get("VITE_OUTPUT_DIR", "./dist")
STATICFILES_DIRS = [DJFK_VITE_OUTPUT_DIR]
```
Finally, run the following command to setup the frontend_kit dirs and required files:
```bash
python manage.py scaffold
```
This will create frontend directory, vite config in the `BASE_DIR`
Run the following command to install necessary packages:
```bash
npm install
```
That's it, you are ready to go!
Raw data
{
"_id": null,
"home_page": "https://github.com/devwaseem/django-frontend",
"name": "django-frontend-kit",
"maintainer": null,
"docs_url": null,
"requires_python": ">=3.9",
"maintainer_email": null,
"keywords": "django, vitejs, django-frontend, django-vitejs",
"author": "Waseem Akram",
"author_email": "waseem07799@gmail.com",
"download_url": "https://files.pythonhosted.org/packages/ae/ad/86f0f5dbda1502945c374ff3b358065995b99a87851d79b5c32a6cc76646/django_frontend_kit-0.0.2.tar.gz",
"platform": null,
"description": "# Django Frontend Kit\n\n**Django Frontend Kit** is an opinionated frontend scaffolder for Django that integrates seamlessly with ViteJS, offering a streamlined setup for modern frontend tooling within your Django projects.\n\n---\n\n\n## Installation\n\nVia pip into a virtualenv:\n\n```bash\npip install django-frontend-kit\n```\n\nIn settings.py add the following:\n\nAdd `frontend_kit` to `INSTALLED_APPS`:\n\n```python\nINSTALLED_APPS = [\n ...\n \"frontend_kit\",\n]\n```\n\nfrontend_kit will look for a `frontend` directory in the setting `DJFK_FRONTEND_DIR`.\nIt is recommend to put the `frontend` directory in the root of your project.\n\n```python\n\nDJFK_FRONTEND_DIR = BASE_DIR / \"frontend\"\n\nTEMPLATES = [\n {\n ...\n \"DIRS\": [DJFK_FRONTEND_DIR],\n ...\n }\n]\n\n```\n\nBy default, frontend_kit will use vite's dev server for development, and \nwill use built assets for production using the generated manifest.json from vite.\n\nSet dev server url:\n\n```python\nVITE_DEV_SERVER_URL = \"http://localhost:5173/\"\n```\n\nIn production, we need to build the frontend assets, so set the output dir and\nadd the same to `STATICFILES_DIRS` so django can collect staticfiles:\n\n\n```python\nDJFK_VITE_OUTPUT_DIR = os.environ.get(\"VITE_OUTPUT_DIR\", \"./dist\")\nSTATICFILES_DIRS = [DJFK_VITE_OUTPUT_DIR]\n```\n\n\nFinally, run the following command to setup the frontend_kit dirs and required files:\n\n```bash\npython manage.py scaffold\n```\n\nThis will create frontend directory, vite config in the `BASE_DIR`\n\nRun the following command to install necessary packages:\n\n```bash\nnpm install\n```\n\nThat's it, you are ready to go!\n\n",
"bugtrack_url": null,
"license": "MIT",
"summary": "Opinionated Django frontend scaffolder using ViteJS",
"version": "0.0.2",
"project_urls": {
"Homepage": "https://github.com/devwaseem/django-frontend",
"Repository": "https://github.com/devwaseem/django-frontend"
},
"split_keywords": [
"django",
" vitejs",
" django-frontend",
" django-vitejs"
],
"urls": [
{
"comment_text": "",
"digests": {
"blake2b_256": "78a1db00ec6b8ec96f5a6e1e8bf2bba660d7ce09197b98b894c9454babc3c2bb",
"md5": "26b49e8254b9652bcda018d4cf802d78",
"sha256": "4a41b2a21d0956c231365e48927f683d6e3a672459cab0e1472e34d99bd58f22"
},
"downloads": -1,
"filename": "django_frontend_kit-0.0.2-py3-none-any.whl",
"has_sig": false,
"md5_digest": "26b49e8254b9652bcda018d4cf802d78",
"packagetype": "bdist_wheel",
"python_version": "py3",
"requires_python": ">=3.9",
"size": 10100,
"upload_time": "2024-12-22T08:51:43",
"upload_time_iso_8601": "2024-12-22T08:51:43.177678Z",
"url": "https://files.pythonhosted.org/packages/78/a1/db00ec6b8ec96f5a6e1e8bf2bba660d7ce09197b98b894c9454babc3c2bb/django_frontend_kit-0.0.2-py3-none-any.whl",
"yanked": false,
"yanked_reason": null
},
{
"comment_text": "",
"digests": {
"blake2b_256": "aead86f0f5dbda1502945c374ff3b358065995b99a87851d79b5c32a6cc76646",
"md5": "b3112204c6a6b95f7c04a7134106190f",
"sha256": "434414a2c5f9f2b61a370a772b04c95614fd7f6769fec37f64bd32e83078ae5f"
},
"downloads": -1,
"filename": "django_frontend_kit-0.0.2.tar.gz",
"has_sig": false,
"md5_digest": "b3112204c6a6b95f7c04a7134106190f",
"packagetype": "sdist",
"python_version": "source",
"requires_python": ">=3.9",
"size": 10613,
"upload_time": "2024-12-22T08:51:45",
"upload_time_iso_8601": "2024-12-22T08:51:45.540426Z",
"url": "https://files.pythonhosted.org/packages/ae/ad/86f0f5dbda1502945c374ff3b358065995b99a87851d79b5c32a6cc76646/django_frontend_kit-0.0.2.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2024-12-22 08:51:45",
"github": true,
"gitlab": false,
"bitbucket": false,
"codeberg": false,
"github_user": "devwaseem",
"github_project": "django-frontend",
"github_not_found": true,
"lcname": "django-frontend-kit"
}