Intregration of Django + React framework to build a Todo App

Django Rest Framework + React frontend

Steps :

• Create a django app
• Initialize python environment (env)
• install all required packages
• Create a app (api)
• Create serializer
• Create views
• Create urls for rest framework for create update delete tasks
• Create models
• Update Installed Apps, Middleware in settings

Frontend

• Create React app (client)
• Create class App
• Create constructor
• Create a form for application
• fetchTask functions to fetch todos from django rest api
• Create a function to generate CSRF token
• Add corsheaders to django settings
• Create handler for form submission
• Create handler for input field change
• Create edit and delete function to edit and delete todos
• Show todos in page
• Create a strikeUnstrike function to mark todos as done or undone
• Command npm run build to generate the production mode

Deploy frontend app to django

• Add build files to template directory
• Add static files to client/build/static