
한 번에 끝내는 자바스크립트: 바닐라 자바스크립트로 SPA 개발까지
효빈 Hyobin
₩35,200
초급 / JavaScript, REST API, SPA, DOM
4.8
(163)
8,500+
답변 활발
답변 활발
프론트엔드 개발자를 희망한다면? 자바스크립트의 기초~심화 문법을 학습해보세요 🔥
초급
JavaScript, REST API, SPA

이 강의는 AI 시대에 개발 생산성을 극대화하는 방법을 배우고 싶은 분들을 위한 실전 중심 강의입니다. 단순히 AI를 사용하는 방법을 넘어서, 실제 개발 환경에서 Claude Code를 어떻게 활용해야 하는지, 그리고 어떻게 하면 “제대로 된 결과”를 만들 수 있는지에 집중합니다. 많은 개발자들이 AI를 사용하면서도 ❌ 결과가 일관되지 않거나 ❌ 코드 품질이 떨어지거나 ❌ 프로젝트가 점점 복잡해지는 문제를 겪고 있습니다. 이 강의에서는 이러한 문제를 해결하기 위해 ✔ 스펙 기반 워크플로우 ✔ 구조화된 명령어 시스템 ✔ 서브에이전트 및 자동화 전략 을 통해 AI를 도구가 아닌 ‘개발 파트너’로 활용하는 방법을 알려드립니다. 또한 Firebase, Figma, GitHub, Vercel과 같은 실제 서비스와 연동하여 처음부터 끝까지 하나의 애플리케이션을 완성하고 배포하는 경험을 제공합니다.





LGCNS
임직원들도 이 강의를 듣고 있어요!





LGCNS
임직원들도 이 강의를 듣고 있어요!
Claude Code를 활용하여 개발 속도를 획기적으로 향상시키는 방법
스펙 기반(Plan & Spec) AI 개발 워크플로우 설계
Slash Commands, Hooks, Plugins를 활용한 자동화 시스템 구축
Subagent를 활용한 작업 분리 및 병렬 처리
MCP 서버를 통해 외부 API 및 서비스(Firebase, Figma 등) 연동
GitHub과 통합하여 PR 리뷰 및 협업 자동화
Vercel을 이용한 실제 서비스 배포
AI 도구를 사용하고 있지만 결과가 일정하지 않거나,
코드 품질이 들쭉날쭉해서 답답함을 느끼고 계신가요?
이 강의는 단순히 AI를 사용하는 방법이 아니라,
AI를 ‘제대로’ 활용하는 구조와 방식을 배우고 싶은 분들을 위한 강의입니다.
ChatGPT나 Claude를 사용하지만 실무에 적용하기 어려운 개발자
반복 작업이 많아 개발 속도가 느려진다고 느끼는 분
AI를 활용한 자동화와 생산성 향상에 관심 있는 분
실제 프로젝트를 통해 AI 기반 개발을 배우고 싶은 분
GitHub, Firebase, Vercel 등과 연결된 실전 워크플로우를 경험하고 싶은 개발자
“그럴듯한 결과”가 아니라 실제로 동작하는 서비스를 만들고 싶은 분
이 강의를 수강한 후에는 다음과 같은 변화를 경험하게 됩니다:
Claude Code를 활용해 개발 속도를 획기적으로 향상
스펙 기반 워크플로우를 통해 프로젝트 구조를 체계적으로 관리
반복 작업을 자동화하여 시간 낭비 최소화
Subagent와 Plugins를 활용해 복잡한 작업을 효율적으로 분리 및 처리
GitHub 연동을 통해 코드 리뷰 및 협업 자동화
최종적으로 실제 서비스 수준의 프로젝트를 완성하고 배포
👉 결과적으로,
단순히 코드를 작성하는 수준을 넘어서
AI와 협업하는 개발 방식을 익히게 됩니다.
Claude Code 기본 개념과 실전 활용법
Slash Commands, Hooks, Custom Commands를 활용한 자동화
Context 관리 (파일, 이미지, 컨텍스트 윈도우)
Spec 기반 개발 (Plan Mode, Extended Thinking)
💡 학습 자료 예시
실제 코드 흐름 다이어그램
명령어 구조 시각화
AI 응답 구조 비교 예시
MCP 서버를 통한 외부 서비스 연동 (Firebase, Figma, Context7)
Subagent를 활용한 작업 분리 및 병렬 처리
Plugins & Skills로 Claude 확장
GitHub 통합 (PR 리뷰, 자동화)
Vercel을 통한 실제 서비스 배포
💡 학습 자료 예시
전체 시스템 아키텍처 다이어그램
워크플로우 흐름도
실전 프로젝트 결과 화면
Write at least three questions and answers that prospective students may have before enrolling. Instead of generic responses, show your personality and expertise in your answers.
AI는 이미 개발 방식 자체를 바꾸고 있습니다.
하지만 단순히 AI를 사용하는 것만으로는 충분하지 않습니다.
이 강의에서는
👉 “어떻게 사용해야 실제로 생산성이 올라가는지”
👉 “어떻게 하면 결과 품질을 유지할 수 있는지”
를 실전 중심으로 배우게 됩니다.
AI 기반으로 웹 애플리케이션 개발
반복 작업 자동화 시스템 구축
GitHub 기반 협업 자동화
실제 서비스 배포 및 운영
즉, AI를 활용한 실전 개발 능력을 갖추게 됩니다.
중급 수준입니다.
기본적인 JavaScript 또는 웹 개발 지식이 있다면 충분히 따라올 수 있습니다.
다만, 내용 자체는 실무 수준까지 깊게 다루기 때문에
초급자에게도 도전적인 강의가 될 수 있습니다.
기본적인 프로그래밍 지식
HTML / CSS / JavaScript 또는 TypeScript
(선택) React / Next.js
네, 가능합니다.
이 강의는 이론 중심이 아니라
👉 실제 프로젝트 기반으로 진행되며
👉 Firebase, GitHub, Vercel 등 실무 도구를 사용합니다.
따라서 수강 후 바로 프로젝트나 업무에 적용할 수 있습니다.
기본적인 코딩 지식이 있으면 더 효과적으로 학습할 수 있습니다.
모든 강의는 실제 개발 환경을 기준으로 진행됩니다.
강의는 지속적으로 업데이트될 수 있습니다.
💬 질문 방법
강의 Q&A를 통해 언제든지 질문 가능
실습 중 막히는 부분도 구체적으로 답변 제공
🎯 추천 학습 방법
단순 시청이 아닌 직접 따라하면서 학습
강의 프로젝트를 기반으로 자신만의 프로젝트 확장
학습 대상은
누구일까요?
AI를 활용해 개발 생산성을 높이고 싶은 초급~중급 개발자
ChatGPT, Claude 등을 사용하지만 제대로 활용하지 못하고 있는 분
반복 작업을 자동화하고 효율적인 개발 워크플로우를 만들고 싶은 개발자
실제 프로젝트를 통해 AI 기반 개발을 배우고 싶은 분
선수 지식,
필요할까요?
기본적인 프로그래밍 지식
HTML, CSS, JavaScript 또는 TypeScript 기초
(선택) React 또는 Next.js 기본 이해
전체
66개 ∙ (6시간 52분)
해당 강의에서 제공:
2. Claude Code 설치하기
06:35
3. 스타터 프로젝트 가져오기
10:00
4. Claude Code에 질문하기
03:53
5. 코드 변경하기
02:45
6. 대화 관리
04:04
7. 모델과 사용 방법
06:36
8. 슬래시 명령어 (/ 명령어)
03:34
9. CLAUDE.md 파일
12:17
10. 파일을 컨텍스트로 추가하기
06:03
11. 이미지를 컨텍스트로 추가하기
04:29
12. 컨텍스트 윈도우
07:47
13. 도구 (Tools)
03:40
14. 권한 및 허용된 도구
10:30
15. 커스텀 명령어
12:22
16. Bash 모드
05:00
17. 명령어 인자
10:14
18. 훅 만들기
06:30
19. jq 사용하기
06:13
21. 스펙 기반 워크플로우
02:38
22. 스펙 명령어 만들기
06:45
23. 새로운 스펙 생성하기
05:05
24. 플랜 모드
10:29
같은 분야의 다른 강의를 만나보세요!