{ "info": { "author": "Johnathan Ryan Hornik", "author_email": "ryanhornik@gmail.com", "bugtrack_url": null, "classifiers": [ "Environment :: Web Environment", "Framework :: Django", "Framework :: Django :: 1.11", "Intended Audience :: Developers", "License :: OSI Approved :: MIT License", "Operating System :: OS Independent", "Programming Language :: Python", "Programming Language :: Python :: 3", "Programming Language :: Python :: 3.4", "Programming Language :: Python :: 3.5", "Topic :: Internet :: WWW/HTTP", "Topic :: Internet :: WWW/HTTP :: Dynamic Content" ], "description": "# Django-React-Views\n\ndjango-react-riews is a Django app providing generic Class Based views and template tags that make it easy to use react\nalongside django views and templates.\n\nIt can be used along with [channels-redux-python](https://pypi.org/project/channels-redux/) \nand [channels-redux-js](https://www.npmjs.com/package/channels-redux) to provide a framework to use websockets to keep \na frontend redux state in sync with the database state.\n\nQuick start\n-----------\n\n1. Add \"django_react_views\" to your INSTALLED_APPS setting like this::\n ```python\n INSTALLED_APPS = [\n ...\n 'django_react_views',\n ]\n ```\n\n1. Create a directory in your app called `react`\n\n1. Copy `webpack.config.js` or use you're own webpack config as long as it builds your react components into one of your STATICFILES_DIRS\n\n1. Use npm to install **at least** the packages required for react & building with webpack\n ```bash\n npm install --save-prod react react-dom\n npm install --save-dev babel-core babel-loader babel-preset-env babel-preset-es2015 babel-preset-react glob webpack webpack-cli\n ```\n\n1. Add these scripts to `package.json`\n ```json\n \"scripts\": {\n \"build\": \"webpack\",\n \"watch\": \"webpack --watch\"\n },\n ```\n\n1. Execute `npm run watch` to start building your react files\n\n1. Add the react template tag to the template where you want to show your react component\n\n ```djangotemplate\n {% load react %}\n ...\n {% react %}\n ...\n ```\n\n1. Create a view for your template\n ```python\n from django_react_views.views import ReactDetailView\n class MyReactView(ReactDetailView):\n react_component = 'MyReactComponent.js' # By default this will resolve to dist/app_name/{react_component}. If {% static %} can not find the file you may need to edit some other properties of this class\n model_serializer = MyModelSerializer\n model = MyModel\n ```\n\n1. Add a url for your view\n ```python\n urlpatterns = [\n ...\n path('my-react-view//', MyReactView.as_view(), name='my-react-view')\n ]\n ```\n\n1. This framework provides window.props, which contains a javascript object that can be used to hydrate your react state. This has the shape of::\n ```javascript\n window.props = {\"objects\": {\"appname.modelname\": {\"https://example.com/appname/modelname/1/\": {object as serialized by your model serializer}} } }\n ```\n\n1. Start the development server and visit http://127.0.0.1:8000/ and visit your page to see you're react component in action\n\n\n", "description_content_type": "text/markdown", "docs_url": null, "download_url": "", "downloads": { "last_day": -1, "last_month": -1, "last_week": -1 }, "home_page": "", "keywords": "", "license": "MIT License", "maintainer": "", "maintainer_email": "", "name": "django-react-views", "package_url": "https://pypi.org/project/django-react-views/", "platform": "", "project_url": "https://pypi.org/project/django-react-views/", "project_urls": null, "release_url": "https://pypi.org/project/django-react-views/1.1/", "requires_dist": null, "requires_python": "", "summary": "A Django app providing generic Class Based views and template tags that make it easy to use react alongside django views and templates.", "version": "1.1" }, "last_serial": 4060613, "releases": { "1.0": [ { "comment_text": "", "digests": { "md5": "3f53fd67705f5899f2dcc4830bab1a05", "sha256": "6dd2749c72e8480d5b56ef755d9c78fd8bc00f1dfe61f11d7ee536b6969fb0ae" }, "downloads": -1, "filename": "django_react_views-1.0-py3-none-any.whl", "has_sig": false, "md5_digest": "3f53fd67705f5899f2dcc4830bab1a05", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 6153, "upload_time": "2018-07-13T04:33:47", "url": "https://files.pythonhosted.org/packages/16/c4/aa719b36c3699568d2f3120506a21603c1bfee2d98881c837c2dad956731/django_react_views-1.0-py3-none-any.whl" }, { "comment_text": "", "digests": { "md5": "ba7e9433f491584b6e6be9196685cdf3", "sha256": "8fefe9cff5293eaaeba6be9de8394035ab3735554fd480f9cde2a607a35fb73b" }, "downloads": -1, "filename": "django-react-views-1.0.tar.gz", "has_sig": false, "md5_digest": "ba7e9433f491584b6e6be9196685cdf3", "packagetype": "sdist", "python_version": "source", "requires_python": null, "size": 5198, "upload_time": "2018-07-13T04:33:48", "url": "https://files.pythonhosted.org/packages/c9/3d/27d9b2f7b2be11095ddfb99e4f1312d757b493ddac4e77aaa0fd42ed25df/django-react-views-1.0.tar.gz" } ], "1.1": [ { "comment_text": "", "digests": { "md5": "b98ddf54084508ec9ca7d78366743d89", "sha256": "5affb38e325e00c1956181198481a610546bb8dcfab0af5eb8e09eff056d1609" }, "downloads": -1, "filename": "django_react_views-1.1-py3-none-any.whl", "has_sig": false, "md5_digest": "b98ddf54084508ec9ca7d78366743d89", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 6328, "upload_time": "2018-07-14T06:59:37", "url": "https://files.pythonhosted.org/packages/e9/c6/3f9359ccdb91b1ebd7ed3b0cce40a22540eaead36e9094f366767acd6225/django_react_views-1.1-py3-none-any.whl" }, { "comment_text": "", "digests": { "md5": "695fb5f2cc587762ae8a441afe0aa4b5", "sha256": "01049d1c445609db3c14ba31186b07be10c33eb258aada4e86059b4bc1c901bb" }, "downloads": -1, "filename": "django-react-views-1.1.tar.gz", "has_sig": false, "md5_digest": "695fb5f2cc587762ae8a441afe0aa4b5", "packagetype": "sdist", "python_version": "source", "requires_python": null, "size": 5461, "upload_time": "2018-07-14T06:59:38", "url": "https://files.pythonhosted.org/packages/49/9e/7515fc88a355ca0e2367aed00963b1b5d6043bdd91f8c82b97c100fdb79a/django-react-views-1.1.tar.gz" } ] }, "urls": [ { "comment_text": "", "digests": { "md5": "b98ddf54084508ec9ca7d78366743d89", "sha256": "5affb38e325e00c1956181198481a610546bb8dcfab0af5eb8e09eff056d1609" }, "downloads": -1, "filename": "django_react_views-1.1-py3-none-any.whl", "has_sig": false, "md5_digest": "b98ddf54084508ec9ca7d78366743d89", "packagetype": "bdist_wheel", "python_version": "py3", "requires_python": null, "size": 6328, "upload_time": "2018-07-14T06:59:37", "url": "https://files.pythonhosted.org/packages/e9/c6/3f9359ccdb91b1ebd7ed3b0cce40a22540eaead36e9094f366767acd6225/django_react_views-1.1-py3-none-any.whl" }, { "comment_text": "", "digests": { "md5": "695fb5f2cc587762ae8a441afe0aa4b5", "sha256": "01049d1c445609db3c14ba31186b07be10c33eb258aada4e86059b4bc1c901bb" }, "downloads": -1, "filename": "django-react-views-1.1.tar.gz", "has_sig": false, "md5_digest": "695fb5f2cc587762ae8a441afe0aa4b5", "packagetype": "sdist", "python_version": "source", "requires_python": null, "size": 5461, "upload_time": "2018-07-14T06:59:38", "url": "https://files.pythonhosted.org/packages/49/9e/7515fc88a355ca0e2367aed00963b1b5d6043bdd91f8c82b97c100fdb79a/django-react-views-1.1.tar.gz" } ] }