How to Build a Simple Web App Using GitHub Copilot in 2 Hours
How to Build a Simple Web App Using GitHub Copilot in 2026
Building a web app can feel overwhelming, especially if you’re a solo founder or indie hacker juggling multiple responsibilities. But what if I told you that you could get a simple web app up and running in just two hours using GitHub Copilot? In this guide, I'll walk you through the process, share real experiences, and highlight some honest tradeoffs along the way.
Prerequisites: What You’ll Need
Before diving in, make sure you have the following:
- GitHub Account: Free to create.
- VS Code: Download it here.
- GitHub Copilot: $10/month for individual use. You'll need to enable it in your VS Code settings.
- Node.js and npm: Install from nodejs.org.
- Basic HTML/CSS/JavaScript knowledge: Familiarity with these languages will help you understand the code generated by Copilot.
Step 1: Set Up Your Development Environment (30 Minutes)
- Install VS Code: If you haven’t already, download and install VS Code.
- Install GitHub Copilot: Follow the instructions in the marketplace to add it to your VS Code.
- Create a New Project Folder: Open your terminal and run:
mkdir my-web-app cd my-web-app npm init -y - Install Express: For a simple web server, run:
npm install express
Step 2: Generate Your Initial Code with Copilot (30 Minutes)
Now it’s time to harness the power of GitHub Copilot.
- Create an
index.jsfile: This will be the main file for your app. - Start typing a comment that describes your app: For example,
// Create a simple Express server that serves a homepage. Copilot will suggest code based on this comment. - Accept Copilot’s suggestions: You can refine the code until it fits your needs.
Expected Output:
You should have a basic Express server running that serves a simple HTML page.
Step 3: Build Your Frontend (30 Minutes)
- Create an
index.htmlfile: In this file, you’ll build the structure of your web app. - Use Copilot to generate HTML: Start with a comment like
<!-- Create a simple HTML structure with a header and a button -->. Accept suggestions to fill in the code. - Style with CSS: Create a
styles.cssfile and use Copilot to generate some basic styles.
Expected Output:
Your web app should now have a homepage with a header and some styled content.
Step 4: Run and Test Your App (20 Minutes)
- Run your server: In your terminal, execute:
node index.js - Open your browser: Navigate to
http://localhost:3000(or the port you specified).
Troubleshooting:
- Error messages: If you encounter errors, check that you have all files correctly linked and that your server is running.
- Functionality issues: Test each feature as you build it to catch problems early.
What’s Next?
Once you’ve built your simple web app, consider adding features like user authentication or a database connection. Explore tools like Firebase for easy backend integration or Stripe for payment processing.
Tool Comparison: GitHub Copilot vs. Alternatives
| Tool | Pricing | Best For | Limitations | Our Verdict | |------------------|----------------------|-----------------------------------|------------------------------------------|----------------------------------| | GitHub Copilot | $10/mo | Code suggestions in real-time | Limited to supported languages | We use this for rapid prototyping. | | Tabnine | Free + $12/mo Pro | AI-driven code completions | Less context-aware than Copilot | We don’t use this because Copilot is more integrated. | | Replit | Free + Pro at $7/mo | Collaborative coding | Limited offline capabilities | We use this for team projects. | | Codeium | Free | Open-source projects | Limited language support | We don’t use this because of limited features. | | Sourcery | Free + $19/mo Pro | Python code improvements | Focused on Python only | We don’t use this as we need multi-language support. |
Conclusion: Start Here
Building a simple web app using GitHub Copilot can be a game-changer for indie hackers and solo founders looking to prototype quickly. With the right setup and a clear approach, you can achieve a functional app in about two hours. Start with the above steps, and don’t hesitate to iterate and improve your app as you go.
Follow Our Building Journey
Weekly podcast episodes on tools we're testing, products we're shipping, and lessons from building in public.