/Full-Stack-Application-with-Django-GraphQL-React-and-Apollo-Client

A full-stack application using Django (backend) and React with Apollo Client (frontend). The app features product listing and detailed view functionalities via a GraphQL API.

Primary LanguagePython

Full-Stack Application with Django, GraphQL, React, and Apollo Client

Overview

A full-stack application using Django (backend) and React with Apollo Client (frontend). The app features product listing and detailed view functionalities via a GraphQL API.

Backend Development

  1. Set Up Django Project: Install Django, create a project and app, and configure settings.
  2. Create Product Model: Define the Product model with fields for name, description, price, stock, etc.
  3. Apply Migrations: Create and apply migrations to update the database schema.
  4. Set Up GraphQL: Install Graphene, define GraphQL schema, and set up GraphQL endpoint.

Frontend Development

  1. Set Up React Project: Use Create React App and install Apollo Client.
  2. Create Apollo Client: Set up Apollo Client in the main entry file.
  3. Create Components: Develop ProductList and ProductDetail components for listing and detailed views.
  4. Set Up Routing: Configure React Router for navigation between list and detail pages.

Deployment

  1. Deploy Backend to Heroku: Set up Heroku, configure PostgreSQL, update settings, and deploy.
  2. Deploy Frontend to Vercel: Use Vercel CLI to deploy the React app.

Submission

  • Push the code to GitHub and create a pull request.
  • Record and share a video demonstrating the project.
  • Provide the GitHub repository and video link.