Build your personal developer portfolio using AI-powered tools — and deploy it live.
This workshop is designed for absolute beginners in the Computer Science branch. You don't need any prior experience with AI, APIs, or web deployment. By the end of this session, you'll have a fully functional, AI-generated portfolio website live on the internet — built by you.
A personal developer portfolio website that:
- Showcases your skills, projects, and bio
- Is fully customized to your personality
- Deploys live on GitHub Pages (
yourname.github.io) - Gets featured on the GDG Jammu Community Showcase
- Includes an AI-powered resume generator (bonus feature)
Google Stitch is a prototyping and design-to-code tool that lets you create fully functional web applications using natural language prompts. Instead of writing every line of HTML, CSS, and JavaScript from scratch, Stitch understands what you describe and generates production-ready code instantly.
Why it matters for this workshop: You'll describe your portfolio — your style, your vibe, your content — and Stitch will generate the entire frontend for you. Think of it as having a senior developer pair-programming with you, except it works at the speed of thought.
What you can do with Stitch:
- Generate complete web pages from text descriptions
- Iterate on designs by refining your prompts
- Export clean, deployable code
- Prototype ideas in minutes instead of hours
Antigravity is Google's AI-native code editor designed to make development faster and more intuitive. It's not just an editor with autocomplete — it understands your entire project context and helps you write, debug, and ship code with AI built directly into the workflow.
Why it matters for this workshop: Once Stitch generates your base portfolio, you'll use Antigravity to customize it — tweak styles, add sections, fix bugs, and add the AI resume feature. It's where the real "building" happens.
What you can do with Antigravity:
- Edit and customize code with AI-assisted suggestions
- Debug issues with natural language explanations
- Add new features by describing what you want
- Manage your project files and push to GitHub
Please complete these steps before arriving at the workshop. This will save us valuable time and ensure you can start building immediately.
| # | Account | Why you need it | Sign up |
|---|---|---|---|
| 1 | Google Account | Access to Stitch, Antigravity & Cloud credits | accounts.google.com |
| 2 | GitHub Account | Host your portfolio & fork the starter repo | github.com/signup |
| # | Tool | Download Link |
|---|---|---|
| 1 | Antigravity IDE | antigravity.google/download |
| 2 | Git (if not already installed) | git-scm.com/downloads |
| 3 | Google Chrome (recommended browser) | google.com/chrome |
Google is providing free Cloud credits for all workshop attendees. Claim yours here:
Claim Free Google Cloud Credits
Important: Please redeem your credits before the workshop starts. You'll need an active Google Cloud account to use certain AI features during the session.
- Any laptop (Windows / macOS / Linux / ChromeOS)
- Stable internet connection
- A modern web browser (Chrome recommended)
- At least 2 GB of free disk space (for Antigravity IDE)
┌─────────────────────────────────────────────────────────┐
│ PHASE 1 — Generate (45 min) │
│ Use Google Stitch to create your portfolio from │
│ natural language prompts. Pick your style, add your │
│ info, and generate production-ready code. │
├─────────────────────────────────────────────────────────┤
│ PHASE 2 — Customize (30 min) │
│ Open your project in Antigravity IDE. Tweak colors, │
│ add sections, fix details, make it truly yours. │
├─────────────────────────────────────────────────────────┤
│ PHASE 3 — Deploy (20 min) │
│ Fork this starter repo, push your code, and go live │
│ on GitHub Pages. Your portfolio is now on the web. │
├─────────────────────────────────────────────────────────┤
│ PHASE 4 — Showcase + Bonus (25 min) │
│ Submit your portfolio to the GDG Jammu Community │
│ Showcase. Bonus: Add an AI resume generator feature. │
└─────────────────────────────────────────────────────────┘
Click the Fork button at the top right of this page to create your own copy.
git clone https://github.com/YOUR-USERNAME/build-with-ai-portfolio.git
cd build-with-ai-portfolioLaunch Antigravity and open the cloned folder. The starter is intentionally barebones — you'll generate your portfolio during the workshop!
build-with-ai-portfolio/
├── index.html ← Placeholder (replace with your Stitch output)
├── assets/ ← Your photo & project screenshots go here
│ └── projects/
├── resume/ ← Bonus: AI Resume Generator
├── manifest.json ← PWA config (auto-installs on phones)
├── sw.js ← Service worker (offline support)
├── LICENSE
└── README.md
- Open Google Stitch and describe the portfolio you want
- Export the generated code
- Replace the placeholder
index.htmlwith your generated portfolio - Add your own
style.cssandscript.jsas needed - Open in Antigravity IDE to customize, tweak, and polish
git add .
git commit -m "My portfolio — built at GDG Jammu Build with AI workshop"
git push origin mainThen go to Settings → Pages → Source: main branch in your GitHub repo. Your site will be live at https://YOUR-USERNAME.github.io/build-with-ai-portfolio
Completed the workshop? Claim your official Build with AI badge on your Google Developer Profile!
Claim Your Build with AI Badge
This badge will appear on your Google Developer Profile and verifies your participation in the Build with AI program. Share it on LinkedIn, your resume, and your new portfolio!
By the end of this workshop, you will have hands-on experience with:
- AI-assisted development — Using Stitch and Antigravity to build real applications
- Web fundamentals — HTML, CSS, and JavaScript structure (even if AI writes most of it, you'll understand it)
- Git & GitHub — Version control, forking, committing, and pushing code
- GitHub Pages — Free static site hosting and deployment
- PWA basics — Making your website installable on phones
- Prompt engineering — How to describe what you want so AI builds it right
- AI API integration — How apps talk to AI models (bonus section)
- Google AI for Developers
- Web Development Fundamentals — web.dev
- Git & GitHub for Beginners — freeCodeCamp
- GDG Jammu Community
Once your portfolio is live, submit it to be featured on the GDG Jammu Community Showcase:
- Make sure your GitHub Pages site is live and accessible
- Visit the submission form (shared during the workshop)
- Enter your name, GitHub Pages URL, and a one-line bio
- Your portfolio will appear on gdgjammu.com/community
GitHub Pages not showing my site
- Go to your repo Settings → Pages
- Make sure source is set to main branch
- Wait 2-3 minutes — GitHub needs time to build
- Check that your file is named
index.html(notIndex.htmlorhome.html)
Git push is failing
- Make sure you forked the repo (not just cloned the original)
- Check that you're pushing to YOUR fork:
git remote -vshould show your username - If using HTTPS, GitHub may ask for a Personal Access Token instead of password
Antigravity won't install
- Check system requirements at antigravity.google/download
- On Windows: run as Administrator
- On Mac: allow in System Preferences → Security & Privacy
- Fallback: use VS Code with GitHub Copilot as an alternative
Stitch isn't generating what I want
- Be specific in your prompts: "A dark theme portfolio with a hero section, project cards, and a contact form" works better than "make me a website"
- Iterate: refine your prompt based on what you get
- Ask a mentor for help — that's what we're here for!
If you're stuck during the workshop, raise your hand or reach out to any of the mentors wearing GDG Jammu badges. We're here to help!
This starter template is open source under the MIT License. Feel free to use, modify, and share your portfolio however you like.
Built by GDG Jammu
Build with AI Workshop — University of Jammu
Star this repo if you found it helpful!