File contents Starter Skill
Static web development for beginners and non-developers
Overview
The Starter skill helps beginners create static websites using HTML, CSS, JavaScript, and Next.js App Router.
When to Use
First-time web developers
Portfolio websites
Landing pages
Simple static sites
Personal blogs (static)
Project Structure
project/
├── app/
│ ├── layout.tsx
│ ├── page.tsx
│ └── globals.css
├── components/
│ └── ...
├── public/
│ └── images/
├── docs/
│ ├── 01-plan/
│ └── 02-design/
└── package.json
Key Phases (Starter Level)
Phase
Required
Description
1. Schema
✅
Define terminology
2. Convention
✅
Set coding rules
3. Mockup
✅
Design UI/UX
4. API
⏭️ Skip
No backend
5. Design System
⏭️ Skip
Keep simple
6. UI Integration
✅
Implement UI
7. SEO/Security
⏭️ Skip
Basic only
8. Review
⏭️ Skip
Self-review
9. Deployment
✅
Deploy to Vercel
Getting Started
# Initialize Starter project
/starter init
# Follow the 9-phase pipeline
/development-pipeline start
Deployment Options
Vercel (recommended)
Netlify
GitHub Pages
Cloudflare Pages
Converted and distributed by TomeVault — claim your Tome and manage your conversions.
1 --- 2 name: popup-studio-ai-bkit-gemini-starter 3 description: Starter Skill 4 --- 5 6 # Starter Skill 7 8 > Static web development for beginners and non-developers 9 10 ## Overview 11 12 The Starter skill helps beginners create static websites using HTML, CSS, JavaScript, and Next.js App Router. 13 14 ## When to Use 15 16 - First-time web developers 17 - Portfolio websites 18 - Landing pages 19 - Simple static sites 20 - Personal blogs (static) 21 22 ## Project Structure 23 24 ``` 25 project/ 26 ├── app/ 27 │ ├── layout.tsx 28 │ ├── page.tsx 29 │ └── globals.css 30 ├── components/ 31 │ └── ... 32 ├── public/ 33 │ └── images/ 34 ├── docs/ 35 │ ├── 01-plan/ 36 │ └── 02-design/ 37 └── package.json 38 ``` 39 40 ## Key Phases (Starter Level) 41 42 | Phase | Required | Description | 43 |-------|----------|-------------| 44 | 1. Schema | ✅ | Define terminology | 45 | 2. Convention | ✅ | Set coding rules | 46 | 3. Mockup | ✅ | Design UI/UX | 47 | 4. API | ⏭️ Skip | No backend | 48 | 5. Design System | ⏭️ Skip | Keep simple | 49 | 6. UI Integration | ✅ | Implement UI | 50 | 7. SEO/Security | ⏭️ Skip | Basic only | 51 | 8. Review | ⏭️ Skip | Self-review | 52 | 9. Deployment | ✅ | Deploy to Vercel | 53 54 ## Getting Started 55 56 ```bash 57 # Initialize Starter project 58 /starter init 59 60 # Follow the 9-phase pipeline 61 /development-pipeline start 62 ``` 63 64 ## Deployment Options 65 66 - Vercel (recommended) 67 - Netlify 68 - GitHub Pages 69 - Cloudflare Pages 70 71 --- 72 > Converted and distributed by [TomeVault](https://tomevault.io/claim/popup-studio-ai) — claim your Tome and manage your conversions. 73 <!-- tomevault:4.0:skill_md:2026-04-11 -->
commit ccac43195c
Frequently asked questions How do I install the Popup Studio AI Bkit Gemini Starter skill? Run npx skillmds@latest add tomevault-io/popup-studio-ai-bkit-gemini-starter in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.
What does the Popup Studio AI Bkit Gemini Starter skill do? Starter Skill It is listed under Coding & Dev Tools on SkillMD.
Is Popup Studio AI Bkit Gemini Starter safe to use? This skill has not completed SkillMD's automated safety review yet. Independent scanners report: SkillSpector: PASS, Skill Scanner: PASS. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.
Which AI agents work with Popup Studio AI Bkit Gemini Starter? This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.
Is Popup Studio AI Bkit Gemini Starter free to use? Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.
Who published Popup Studio AI Bkit Gemini Starter? tomevault-io (@tomevault-io) published this skill. Their other Agent Skills are listed on their SkillMD profile.
tomevault-io