# 디자인 셋으로 홈페이지와 플랫폼 한 번에 만들기

1강·2강을 마친 홈페이지에 TheNoun. 디자인을 입히고 platform. 주소에 로그인·관리 화면을 만드는 8단계 무료 강의예요. 1강·2강을 마쳐 내 주소로 홈페이지가 열리는 분께 맞아요. 강의는 무료이고, 수파베이스 무료 플랜·클라우드플레어도 무료이고 TheNoun. 디자인 도구는 academy 로그인 하나로 써서 새로 결제할 것이 없어요. 직접 따라 하는 시간은 40분 정도이고, 내가 할 일은 가입·로그인·메일 확인·허락 누르기뿐이에요.

- 주소: https://academy.thenoun.ai/l/design-platform/
- 난이도: 중급
- 강의 보기: 무료(로그인 필요)
- 단계: 9단계 · 직접 하는 시간 약 40분
- 주제: 디자인 시스템, TheNoun. 디자인, 홈페이지 디자인, 플랫폼, 대시보드, 로그인 화면, 수파베이스, Supabase, 클로드 코드, 클로드 스킬, Claude Code, 요구사항
- 기준일: 2026-10-08

## 이 강의로 얻는 것

- 나에게 생기는 것: 내 홈페이지에 TheNoun. 디자인이 입혀지고, platform. 주소에 가입·로그인이 되는 로그인 화면과 관리 화면이 열려요. 원하는 화면은 말로 정확히 요구하면 같은 디자인으로 만들어 줘요.
- AI가 새로 할 수 있는 일: 1강·2강으로 올린 홈페이지에 디자인을 입히고, 로그인과 관리 화면이 있는 플랫폼을 platform. 주소로 만들어 올리는 일
- 직접 따라 하는 시간: 약 40분
- 강의 밖 비용: 새로 결제할 것은 없어요. 수파베이스 무료 플랜과 클라우드플레어는 무료이고 디자인 도구는 academy 로그인 하나로 쓰며, 클로드 요금제와 도메인은 1강에서 쓰던 그대로예요(2026-10-08 기준)
- 내가 직접 할 일: 가입·로그인(수파베이스, 클라우드플레어 — 비밀번호는 그 화면 칸에 직접) · 가입 확인 메일 버튼 누르기(시험 가입) · 「허용」 누르기(깃허브에 보관·인터넷에 올릴 때) · 고르기(대표 색 한 가지)

## 누구에게 맞나요?

- 1강·2강으로 올린 홈페이지에 제대로 된 디자인을 입히고 싶은 분
- 홈페이지 말고 로그인해서 쓰는 내 서비스 화면(플랫폼)도 갖고 싶은 분
- 화면을 만들 때마다 모양이 달라지는 것이 걱정인 분

## 무엇을 배우나요?

- 1강·2강으로 올린 내 홈페이지에 TheNoun. 디자인이 입혀져요. 2강에서 한 검색 설정은 그대로 남아요.
- platform. 으로 시작하는 주소에 로그인 화면과 관리 화면(대시보드)이 열려요.
- 로그인은 수파베이스(Supabase)에 안전하게 보관돼요. 가입과 로그인이 실제로 돼요.
- 원하는 화면을 말로 정확하게 요구하는 법을 알게 돼요.

## 무엇이 필요한가요?

- 1강·2강을 마쳐 인터넷에 올라가 있는 내 홈페이지와 「내 홈페이지」 폴더
- 클로드 유료 요금제와 클로드 데스크톱 앱(1강과 같아요)
- 수파베이스(Supabase) 가입과 새 프로젝트 하나(무료)
- 어사이드에서 수파베이스·클라우드플레어·깃허브 로그인

## 순서

1. 강의 소개
2. 준비물 확인
3. 실습 시작
4. 질문 창 미리 보기
5. 자동 진행 단계
6. 직접 할 일
7. 요구사항 말하기
8. 자주 묻는 질문
9. 마무리

## 비용은 얼마나 드나요? (2026-10-08 기준)

| 항목 | 비용 |
|---|---|
| TheNoun. 디자인 도구(academy MCP 안) | 무료(academy 로그인 하나로 — 따로 가입·카드 없음) |
| 수파베이스(로그인 보관함) 무료 플랜 | 월 $0, 일주일 동안 쓰지 않으면 잠시 멈춰요 |
| 클라우드플레어(platform. 주소도 같은 곳) | 무료 |

클로드 요금제와 도메인은 1강에서 쓰던 그대로예요. 이 강의에서 새로 결제할 것은 없어요. 수파베이스는 쓰는 양이 늘면 유료로 올릴 수 있어요.

## 얼마나 걸리나요?

platform. 주소가 열리기까지 몇 분 걸릴 수 있어요.

## 자주 묻는 질문

### 이 강의에서 무엇을 하나요?

1강·2강으로 올린 홈페이지에 TheNoun. 디자인을 입히고, platform. 주소에 로그인 화면과 관리 화면이 있는 플랫폼을 만들어 올려요. 로그인은 수파베이스에 보관해요. 클로드에게 한 줄만 보내면 클로드가 끝까지 해요.

### 먼저 해야 하는 강의가 있나요?

1강 클로드 코드로 홈페이지 만들기(https://academy.thenoun.ai/l/claude-homepage/)와 2강 서치어드바이저 등록부터 AI 검색까지(https://academy.thenoun.ai/l/search-setup/)를 꼭 먼저 마쳐야 해요. 홈페이지가 인터넷에 올라가 있어야 디자인을 입히고 플랫폼 주소를 이을 수 있어요.

### 누구에게 맞는 강의인가요?

1강·2강으로 올린 홈페이지에 제대로 된 디자인을 입히고 싶은 분, 로그인해서 쓰는 내 서비스 화면(플랫폼)도 갖고 싶은 분, 화면을 만들 때마다 모양이 달라지는 것이 걱정인 분께 맞아요.

### 비용은 얼마나 드나요?

강의는 무료예요. 처음 듣는 강의 하나는 로그인 없이 열리고, 이 강의는 로그인해요. 수파베이스 무료 플랜·클라우드플레어는 무료이고, TheNoun. 디자인 도구는 따로 가입 없이 academy 로그인 하나로 써요. 수파베이스 무료 프로젝트는 일주일 동안 쓰지 않으면 잠시 멈추고, 필요하면 유료로 올릴 수 있어요. 클로드 요금제와 도메인은 1강에서 쓰던 그대로예요.

### 얼마나 걸리나요?

직접 따라 하는 시간은 40분 정도예요. 클로드가 0단계부터 7단계까지 이어서 하고, 나는 가입·로그인·가입 확인 메일 누르기·「허용」 누르기를 할 때만 손을 대요.

### 로그인은 어떻게 만들어지나요?

수파베이스(Supabase, 로그인 정보를 안전하게 보관해 주는 곳)에 내 프로젝트를 만들고, 이메일과 비밀번호로 가입·로그인하게 해요. 가입은 내가 하고, 나머지는 클로드가 해요. 비밀 키는 열지도 쓰지도 않아요.

강의 소개는 누구나 볼 수 있고, 강의 단계는 Google·카카오·이메일 중 하나로 로그인하면 열려요.

이 강의가 쓰는 스킬: https://academy.thenoun.ai/skills/thenoun-platform/
