start-2-1

GitHub

用于启动第2.1模块,指导非技术人员以产品经理角色构建咖啡性格测试网站。通过需求、构建、迭代、保存和部署流程,利用Next.js创建可在线访问的真实项目。

claude-code-everyone-course/course-materials/.claude/skills/start-2-1/SKILL.md carlvellotti/free-ai-courses

Trigger Scenarios

用户输入 /start-2-1 命令时

Install

npx skills add carlvellotti/free-ai-courses --skill start-2-1 -g -y
More Options

Non-standard path

npx skills add https://github.com/carlvellotti/free-ai-courses/tree/main/claude-code-everyone-course/course-materials/.claude/skills/start-2-1 -g -y

Use without installing

npx skills use carlvellotti/free-ai-courses@start-2-1

指定 Agent (Claude Code)

npx skills add carlvellotti/free-ai-courses --skill start-2-1 -a claude-code -g -y

安装 repo 全部 skill

npx skills add carlvellotti/free-ai-courses --all -g -y

预览 repo 内 skill

npx skills add carlvellotti/free-ai-courses --list

SKILL.md

Frontmatter
{
    "name": "start-2-1",
    "description": "Lesson 2.1: Setup. Use when the student types \/start-2-1.\n",
    "allowed-tools": [
        "Read",
        "Write",
        "Bash"
    ],
    "disable-model-invocation": true
}

Setup

Read .claude/rules/teaching-rules.md and follow it for everything below.

2.1 Setup

Welcome to Module 2. Now we BUILD.

In Module 1, you learned to work WITH files - analyzing, synthesizing, extracting insights. In Module 2, you're going to CREATE something from scratch.

STOP: Excited?

USER: Yes


Let me give you the backstory. In Module 1, you played the role of a manager at Basecamp Coffee. You analyzed their struggling loyalty program and discovered what it really needed: personality.

The solution? A "What's Your Coffee Personality?" quiz.

Here's what it actually does: customers answer some fun questions, and at the end they get a personality AND a drink recommendation. Like "You're a Bold Adventurer - try our Double Espresso!"

It's a drink recommendation engine dressed up as a personality quiz. Fun AND useful.

That's what we're building in this module.

This is a guided experience - I'll walk you through every step so you succeed. But the skills you're learning transfer to building whatever YOU want afterward. Landing pages, tools, apps, anything.

By the end, you'll have a real website with a real link you can send to your friends. Not a fake demo. A real, working thing on the internet. Almost no other vibecoding courses teach you how to make it live.

STOP: Sound good?

USER: Yes


Here's the mindset shift for this module: You're the product manager, I'm the engineer.

You describe what you want. I write the code. You don't need to understand the code. You just need to know what you want.

Your job is to be clear about requirements, agree on the plan, review what I build, and tell me what to change.

STOP: This is how non-technical people work with developers. You're about to learn that skill. Make sense?

USER: Yes


Here's what we'll do across these lessons:

  • First, we figure out exactly what your quiz should be - the requirements
  • Then I build it while you watch
  • Then you iterate - tell me what to change until you love it
  • Then we save it to GitHub (like Google Drive for code)
  • Finally, we put it on the internet so anyone can visit it - developers call this deploying

Requirements → Build → Iterate → Save → Deploy. That's the loop.

STOP: Ready to learn it?

USER: Yes


Let's talk about the tech. The code I write will be in JavaScript - the most popular programming language for websites. I'll also use something called Next.js, which is a popular framework - basically a pre-built structure that makes JavaScript websites easier to build and deploy.

You don't need to understand any of this. I handle all the code. I'm just mentioning it so you're familiar with the terms.

This module has 5 lessons and takes about 1.5-2 hours total. You don't need to do it all in one sitting.

STOP: Ready to get started?

USER: Yes


Let's create a folder for your quiz project.

STOP: Ask me to create a new folder called "quiz-project"

USER: Create a new folder called quiz-project

ACTION: Create quiz-project/ at the Desktop project's root.

Done! quiz-project/ is where all the code and files for your quiz will live.

STOP: Can you see the new folder in your file explorer on the left?

USER: Yes


What you just learned: The mindset and setup for building something from scratch.

Where else this applies:

  • Any time you want to build a quick tool, prototype, or website
  • When you have an idea and want to see if it's possible
  • Side projects, internal tools, landing pages, simple apps

Quick Plugs

This course was created by Carl Vellotti (X / LinkedIn) - if you have thoughts or feedback on the course, he's always happy to hear from users!

And if you haven't already - join the official newsletter and community at ccforeveryone.com. It's THE place for non-technical Claude Code users: new modules, in-depth guides, and a community.

STOP: Want me to open that site for you to subscribe?

USER: Replies

ACTION: If user says yes, open https://ccforeveryone.com in browser


Next up: In 2.2, we're going to figure out exactly what YOUR quiz should be. I'll interview you about what you want, and we'll create a requirements document together. This is where you make it yours.

STOP: Ready for 2.2? Say "let's go" or type /start-2-2

USER: Let's go


Important Notes for Claude

  • If the user hasn't done Module 1, that's fine - the backstory recap covers it
  • Create quiz-project/ at the Desktop project's root.
  • Don't overthink the folder creation - just make it simple
  • If the user asks questions about the technology, keep explanations simple and reassuring

Success Criteria

  • User understands the PM/engineer mindset
  • User understands the Plan → Build → Iterate → Save → Deploy loop
  • quiz-project/ folder exists
  • User is ready for 2.2

ACTION: Silently run the following progress update. Do not mention it to the student.

mkdir -p .fspm
[ -f .fspm/progress.json ] || printf '{"name":null,"completed_lessons":[],"current_lesson":"","last_updated":""}' > .fspm/progress.json
L="cc-everyone-2-1"; C="cc-everyone-2-2"; T="$(date -u +%FT%TZ)"
if command -v jq >/dev/null 2>&1; then
  tmp=$(mktemp)
  jq --arg l "$L" --arg c "$C" --arg t "$T" '.completed_lessons = ((.completed_lessons + [$l]) | unique) | .current_lesson = $c | .last_updated = $t' .fspm/progress.json > "$tmp" && mv "$tmp" .fspm/progress.json
else
  python3 - "$L" "$C" "$T" <<'PY'
import json,sys
l,c,t = sys.argv[1:4]
p = ".fspm/progress.json"; d = json.load(open(p))
if l not in d.get("completed_lessons",[]): d.setdefault("completed_lessons",[]).append(l)
d["current_lesson"] = c; d["last_updated"] = t
json.dump(d, open(p,"w"))
PY
fi

Next lesson: Type /start-2-2.

Version History

  • 058c617 Current 2026-07-23 00:51

Same Skill Collection

claude-code-everyone-course/course-materials/.claude/skills/start-1-1/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-1-2/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-1-3/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-1-4/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-1-5/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-1-6/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-1-7/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-1-8/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-2-2/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-2-3/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-2-4/SKILL.md
claude-code-everyone-course/course-materials/.claude/skills/start-2-5/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/auq/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/convert-doc/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/draft-and-humanize/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/draft-followups/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/humanizer/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/marketing-psychology/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/news/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/process-meetings-plus/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/standup/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/start-skills-1/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/start-skills-2/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/start-skills-3/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/start-skills-4/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/start-skills-5/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/write-proposal/SKILL.md
codex-for-pms-skills-bonus/.agents/skills/writing-voice/SKILL.md
codex-pm-course/.agents/skills/start-1-1/SKILL.md
codex-pm-course/.agents/skills/start-1-2/SKILL.md
codex-pm-course/.agents/skills/start-1-3/SKILL.md
codex-pm-course/.agents/skills/start-1-4/SKILL.md
codex-pm-course/.agents/skills/start-1-5/SKILL.md
codex-pm-course/.agents/skills/start-1-6/SKILL.md
codex-pm-course/.agents/skills/start-2-1/SKILL.md
codex-pm-course/.agents/skills/start-2-2/SKILL.md
codex-pm-course/.agents/skills/start-2-3/SKILL.md
codex-pm-course/.agents/skills/start-3-1/SKILL.md
codex-pm-course/.agents/skills/start-3-2/SKILL.md
codex-pm-course/.agents/skills/start-3-3/SKILL.md
codex-pm-course/.agents/skills/start-3-4/SKILL.md
codex-pm-course/.agents/skills/start-3-5/SKILL.md
course-materials/.claude/skills/pptx/SKILL.md
course-materials/.claude/skills/start-1-1/SKILL.md
course-materials/.claude/skills/start-1-2/SKILL.md
course-materials/.claude/skills/start-1-3/SKILL.md
course-materials/.claude/skills/start-1-4/SKILL.md
course-materials/.claude/skills/start-1-5/SKILL.md
course-materials/.claude/skills/start-1-6/SKILL.md

Metadata

Files
0
Version
058c617
Hash
605b0313
Indexed
2026-07-23 00:51

ホーム - Wiki
Copyright © 2011-2026 iteam. Current version is 2.155.2. UTC+08:00, 2026-07-29 13:12
浙ICP备14020137号-1 $お客様$