How to Use GitHub Copilot to Write a Complete Web App in Under 2 Hours
How to Use GitHub Copilot to Write a Complete Web App in Under 2 Hours
If you're a solo founder or indie hacker, you know that time is often your most valuable resource. The idea of building a complete web app in under two hours might sound far-fetched, but with GitHub Copilot, it’s not just a pipe dream—it’s a very achievable goal. In 2026, AI tools like Copilot have matured significantly, making them indispensable for speeding up coding tasks. Here’s how to leverage Copilot effectively to get your web app off the ground quickly.
Prerequisites: What You Need to Get Started
Before diving in, make sure you have the following:
- GitHub Account: You’ll need this to use Copilot.
- Visual Studio Code (VS Code): The primary IDE that integrates well with Copilot.
- Node.js installed: For backend functionality.
- Basic knowledge of JavaScript: Familiarity with syntax and concepts will help.
- Copilot Subscription: Pricing is $10/month or $100/year as of June 2026.
Step 1: Set Up Your Environment (15 minutes)
- Install VS Code: Download and install it from here.
- Install GitHub Copilot: Go to the Extensions Marketplace in VS Code, search for “GitHub Copilot,” and install it.
- Create a New Project: Open a new terminal and run:
mkdir my-web-app && cd my-web-app npm init -y
Step 2: Generate Your Web App Skeleton (30 minutes)
-
Create an
index.htmlfile: This will be the main entry point of your app. -
Use Copilot to scaffold HTML: Start by typing:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>My Web App</title> </head> <body>Copilot will suggest the closing tags and common elements like a header or footer.
-
Add a Simple Form: Type a comment like
<!-- Form for user input -->and let Copilot fill in the form structure. -
Create a
script.jsfile: Start typing:function submitForm() { // Logic to handle form submission }Copilot will help fill in the remaining code.
Step 3: Implement Backend Logic (30 minutes)
-
Set Up a Simple Express Server: Create a
server.jsfile and type:const express = require('express'); const app = express(); const PORT = process.env.PORT || 3000; app.listen(PORT, () => { console.log(`Server running on http://localhost:${PORT}`); });Copilot will help generate the rest of the Express setup.
-
Handle Form Submission: Add a route to handle POST requests from your HTML form. Start typing:
app.post('/submit', (req, res) => { // Logic to handle data });
Step 4: Style Your Web App (25 minutes)
- Create a
styles.cssfile: Start with basic styles. - Use Copilot for CSS: Type a comment like
/* Button styles */and let Copilot suggest styles.
Step 5: Test Your Web App (20 minutes)
- Run Your Server: In the terminal, run:
node server.js - Open Your Browser: Navigate to
http://localhost:3000and test the form.
What Could Go Wrong
- Dependencies Not Installed: Make sure to run
npm install expressif you encounter errors. - Missing HTML Elements: If Copilot doesn’t generate elements you need, you may have to write them manually.
What's Next: Deployment
Once your app is functional, consider deploying it using services like Vercel or Heroku. You can follow their respective documentation to get your app live.
Conclusion: Start Here
Using GitHub Copilot, building a web app in under two hours is entirely feasible. It’s not just about writing code faster; it’s about leveraging AI to fill in the gaps and streamline your workflow. Start by setting up your environment and follow the steps outlined above.
What We Actually Use
For our own projects, we use GitHub Copilot alongside tools like Vercel for deployment and Postman for API testing. This combo keeps our workflow smooth and efficient.
Follow Our Building Journey
Weekly podcast episodes on tools we're testing, products we're shipping, and lessons from building in public.