===============
Django Reactify
===============
Django Reactify is an app that allows developers to add and use React components in their Django app without using the legacy `create-react-app <https://github.com/facebookincubator/create-react-app>`_.
Quick start
-----------
1. Install the package via the following command:
pip install django-reactify
2. Add "reactify" to your INSTALLED_APPS setting like this::
INSTALLED_APPS = [
...
'reactify',
]
3. Run the following command:
python manage.py reactify <app_name>
Ensure that the templates directory exists in the specified app name.
- Replace the app name with the existing Django app you want to reactify.
- This command does the following:
* Creates barbel and webpack configuration files in the app's root directory.
* Creates package.json file with the scripts to run React development server.
* Creates a react folder directory with the necessary files and subdirectories where you can add your react component files and redux actions and reducers.
* Creates a react folder directory with the necessary files and subdirectories where you can add your react component files and redux actions and reducers.
* Installs the basic npm development packages.
* starts the react development server that listens on the changes made to the react components and compile a minimal js file that is rendered to the view.
4. cd to the django app directory and run the following command:
npm run dev
5. Add the new view function to the views file to render the compiled version of the react app.
def index(request):
template_name = '<app_name>/index.html'
return render(request, template_name)
6. Add more React components to the react app's component folder.
Managing React Routes
---------------------
If you don't configure Django urls to accept the Routes declared in the react, you will encouter 404 error.
To fix this, lets say you have react routes as follows:
<Switch>
<Route exact path="/" component={Main} />
<Route exact path="/login" component={LoginPage} />
<Route exact path="/services" component={ServicesPage} />
<Route exact path="/about" component={AboutPage} />
In the app urls file use `re_path`,
from django.urls import re_path
from .views import index
urlpatterns = [
re_path(r'', index, name="home"),
]
Raw data
{
"_id": null,
"home_page": "https://github.com/Bonifase/django-reactify",
"name": "django-reactify",
"maintainer": "",
"docs_url": null,
"requires_python": ">=3.6",
"maintainer_email": "",
"keywords": "django reactjs",
"author": "Bonifase Orwa",
"author_email": "orwabonifase@gmail.com",
"download_url": "https://files.pythonhosted.org/packages/aa/3e/038cc65f7ff687b3ddb8c042fa852edcfdf6727a34657827e58e2cacf6dd/django-reactify-1.3.9.tar.gz",
"platform": null,
"description": "===============\nDjango Reactify\n===============\n\nDjango Reactify is an app that allows developers to add and use React components in their Django app without using the legacy `create-react-app <https://github.com/facebookincubator/create-react-app>`_.\n\nQuick start\n-----------\n\n1. Install the package via the following command:\n\n pip install django-reactify\n\n2. Add \"reactify\" to your INSTALLED_APPS setting like this::\n\n INSTALLED_APPS = [\n ...\n 'reactify',\n ]\n\n3. Run the following command:\n\n python manage.py reactify <app_name>\n\n Ensure that the templates directory exists in the specified app name.\n\n - Replace the app name with the existing Django app you want to reactify.\n\n - This command does the following:\n\n * Creates barbel and webpack configuration files in the app's root directory.\n\n * Creates package.json file with the scripts to run React development server.\n\n * Creates a react folder directory with the necessary files and subdirectories where you can add your react component files and redux actions and reducers.\n\n * Creates a react folder directory with the necessary files and subdirectories where you can add your react component files and redux actions and reducers.\n\n * Installs the basic npm development packages.\n\n * starts the react development server that listens on the changes made to the react components and compile a minimal js file that is rendered to the view.\n\n4. cd to the django app directory and run the following command:\n\n npm run dev\n\n\n5. Add the new view function to the views file to render the compiled version of the react app.\n\n def index(request):\n template_name = '<app_name>/index.html'\n\n return render(request, template_name)\n\n6. Add more React components to the react app's component folder.\n\nManaging React Routes\n---------------------\nIf you don't configure Django urls to accept the Routes declared in the react, you will encouter 404 error.\n\nTo fix this, lets say you have react routes as follows:\n\n <Switch>\n <Route exact path=\"/\" component={Main} />\n\n <Route exact path=\"/login\" component={LoginPage} />\n\n <Route exact path=\"/services\" component={ServicesPage} />\n\n <Route exact path=\"/about\" component={AboutPage} />\n\nIn the app urls file use `re_path`,\n\n from django.urls import re_path\n\n from .views import index\n\n urlpatterns = [\n re_path(r'', index, name=\"home\"),\n ]\n",
"bugtrack_url": null,
"license": "",
"summary": "A package to reactify Django app.",
"version": "1.3.9",
"split_keywords": [
"django",
"reactjs"
],
"urls": [
{
"comment_text": "",
"digests": {
"md5": "5355555dd7854e163089c37a9866ad93",
"sha256": "ea7fbc2a9eaf3a4ac500b2f19e308858759289ccc91cbb9edf4023ca3aedd1a0"
},
"downloads": -1,
"filename": "django_reactify-1.3.9-py3-none-any.whl",
"has_sig": false,
"md5_digest": "5355555dd7854e163089c37a9866ad93",
"packagetype": "bdist_wheel",
"python_version": "py3",
"requires_python": ">=3.6",
"size": 75890,
"upload_time": "2022-12-11T00:23:26",
"upload_time_iso_8601": "2022-12-11T00:23:26.322432Z",
"url": "https://files.pythonhosted.org/packages/78/2f/83e276ee69e86b19331b575ba9b85f7ebd5c0670ad2569d4e0900d92f421/django_reactify-1.3.9-py3-none-any.whl",
"yanked": false,
"yanked_reason": null
},
{
"comment_text": "",
"digests": {
"md5": "f63739609cf0b9a64d50533932f457ef",
"sha256": "bd2efd09b04dad6c6c05338237a9703d471d2761053d871bc3e820a3f215d86a"
},
"downloads": -1,
"filename": "django-reactify-1.3.9.tar.gz",
"has_sig": false,
"md5_digest": "f63739609cf0b9a64d50533932f457ef",
"packagetype": "sdist",
"python_version": "source",
"requires_python": ">=3.6",
"size": 73038,
"upload_time": "2022-12-11T00:23:28",
"upload_time_iso_8601": "2022-12-11T00:23:28.062633Z",
"url": "https://files.pythonhosted.org/packages/aa/3e/038cc65f7ff687b3ddb8c042fa852edcfdf6727a34657827e58e2cacf6dd/django-reactify-1.3.9.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2022-12-11 00:23:28",
"github": true,
"gitlab": false,
"bitbucket": false,
"github_user": "Bonifase",
"github_project": "django-reactify",
"travis_ci": false,
"coveralls": false,
"github_actions": false,
"lcname": "django-reactify"
}
JSON
