Uploading the Quiz App to GitHub

You’ve built a fully functional, animated, and interactive quiz app using React and Vite. Now it's time to take it live. In this module, we’ll walk through how to upload your project to GitHub and deploy it on Netlify so others can access it on the web. Along the way, we’ll also explain the final structure and how all components work together.

Pushing Your React App to GitHub

To safely store your code online and prepare it for deployment, you’ll first push it to GitHub.

Step 1: Initialize Git

Open your terminal in the root of your quiz app directory (where package.json is located), then run the following:

git init
git add .
git commit -m "Initial commit"

Step 2: Create a GitHub Repository

  • Visit GitHub.com
  • Click the + icon → New Repository
  • Name it something like quiz-app-react
  • Leave it empty (no README or .gitignore) and click Create repository

Step 3: Push to GitHub

Back in your terminal, run the following (replace your-username and repo URL):

git branch -M main
git remote add origin https://github.com/your-username/quiz-app-react.git
git push -u origin main

If this is your first time pushing to GitHub, you may be asked to configure your username and email:

git config --global user.name "Your GitHub User Name"
git config --global user.email "your@email.com"

Once done, your project will be live on GitHub.