How to Use GitHub Copilot to Build a Simple Web App in 2 Hours
How to Use GitHub Copilot to Build a Simple Web App in 2026
If you’re an indie hacker or a solo founder, you know that time is of the essence when building your next project. You might be wondering if AI can really speed up your development process. Enter GitHub Copilot, which claims to help you write code faster and with fewer errors. But does it actually deliver? In this guide, I’ll show you how to leverage GitHub Copilot to build a simple web app in just 2 hours.
Prerequisites
Before diving in, make sure you have the following:
- A GitHub account: Sign up for free if you don’t have one.
- Visual Studio Code: Download and install it.
- GitHub Copilot: Pricing is $10/month or $100/year for individuals.
- Node.js: Install the latest version to run your web app.
- Basic understanding of JavaScript and HTML: You should be comfortable with the basics.
Step 1: Set Up Your Environment (15 Minutes)
-
Install Visual Studio Code: If you haven't already, grab it from the official site.
-
Install GitHub Copilot: Open VS Code, go to Extensions (Ctrl+Shift+X), and search for "GitHub Copilot." Click install.
-
Create a New Project: Open a terminal in VS Code and run:
mkdir my-web-app cd my-web-app npm init -y -
Install Express: This will be our web server framework.
npm install express
Step 2: Start Coding with GitHub Copilot (1 Hour)
-
Create Your Server: In your project folder, create a file named
server.js. Start typingconst express = require('express');and watch Copilot suggest the rest of your server setup.const express = require('express'); const app = express(); app.get('/', (req, res) => { res.send('Hello World!'); }); app.listen(3000, () => { console.log('Server is running on http://localhost:3000'); }); -
Add HTML: Create a new folder called
publicand add anindex.htmlfile. Type the structure of an HTML document, and let Copilot fill in the rest.<!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> <h1>Welcome to My Web App</h1> </body> </html> -
Serve Static Files: Update your
server.jsto serve the HTML file.app.use(express.static('public')); -
Run Your App: In the terminal, run:
node server.jsOpen your browser and navigate to
http://localhost:3000. You should see your web app!
Step 3: Troubleshooting Common Issues (30 Minutes)
- Copilot Not Suggesting: If Copilot isn’t suggesting code, check if you’re logged into GitHub in VS Code. Sometimes a restart of the editor helps.
- Server Not Starting: Ensure that Node.js is properly installed and your terminal is in the correct directory.
- HTML Not Displaying: Make sure your static file serving is correctly set up in your Express server.
What’s Next?
Now that you have a basic web app, consider adding features like:
- User Authentication: Look into Passport.js for handling logins.
- Database Integration: Use MongoDB or PostgreSQL to store user data.
- Styling: Add some CSS or use a framework like Bootstrap to enhance the UI.
Conclusion
Using GitHub Copilot can significantly speed up your development process, especially for simple web apps. In about 2 hours, you can build a functional app that’s ready for expansion. If you're looking to experiment with AI-assisted coding, GitHub Copilot is a solid choice.
What We Actually Use
For our projects, we often turn to GitHub Copilot for rapid prototyping and initial coding. It’s especially useful for boilerplate code, but we still double-check everything for accuracy.
Follow Our Building Journey
Weekly podcast episodes on tools we're testing, products we're shipping, and lessons from building in public.