인기여정

JavaScript 배우기

무료 인터랙티브 온라인 JavaScript 강의입니다. 모든 레슨에서 직접 JS를 작성합니다. 막힐 땐 AI 힌트가 도와주고, 끝까지 마치면 수료증도 받습니다.

학습 시작(무료)

커리큘럼 보기 플레이그라운드에서 시도

257,728+ 명의 codders가 등록함

초보자 환영
AI 코딩 도우미
실습 중심의 대화형 강의
모든 레슨에 음성 나레이션 제공
지식을 확인하는 퀴즈
무료 수료증
초보자 환영
AI 코딩 도우미
실습 중심의 대화형 강의
모든 레슨에 음성 나레이션 제공
지식을 확인하는 퀴즈
무료 수료증

커리큘럼

4 섹션10 프로젝트271 개 강의219 챌린지1,458 퀴즈 문제

섹션 1
기초
섹션 시작하기시작펼치기접기필수 개념과 기본 기술로 튼튼한 기초를 구축하세요77 개 강의101 챌린지391 문제3 프로젝트
소개
4 개 강의223
01언어 소개챌린지
02Hello World!챌린지퀴즈
03주석퀴즈
04코드 구조퀴즈
변수
7 개 강의1247
01숫자챌린지마스터리퀴즈
02문자열챌린지마스터리퀴즈
03불리언챌린지마스터리퀴즈
04명명 규칙챌린지마스터리퀴즈
05빈 변수챌린지퀴즈
06요약 - 변수 초기화챌린지
07상수챌린지마스터리퀴즈
연산자 파트 1
6 개 강의1037
01산술 연산자챌린지마스터리퀴즈
02나머지 연산자챌린지마스터리퀴즈
03산술 연산 단축 표기챌린지마스터리퀴즈
04비교 연산자챌린지마스터리퀴즈
05엄격한 비교 vs 느슨한 비교챌린지퀴즈
06요약 - 간단한 수학챌린지
연산자 파트 2
5 개 강의831
01논리 연산자 파트 1챌린지마스터리퀴즈
02논리 연산자 파트 2챌린지마스터리퀴즈
03정리 - 간단한 논리챌린지
04논리 연산자 파트 3챌린지마스터리퀴즈
05타입 강제 변환챌린지퀴즈
조건문
5 개 강의729
01If 문챌린지마스터리퀴즈
02If - Else 문챌린지마스터리퀴즈
03복습 - 간단한 계산기챌린지
04중첩 If - Else 문챌린지퀴즈
05Switch 문챌린지퀴즈
기초 입출력
6 개 강의931
01출력챌린지마스터리퀴즈
02변수를 사용한 출력챌린지마스터리퀴즈
03형 변환 - 파트 1챌린지마스터리퀴즈
04형 변환 - 파트 2챌린지퀴즈
05복습 - 120까지챌린지
06복습 - 참 또는 거짓챌린지
금액 분할 계산기
프로젝트4 개 강의1
01환영 메시지챌린지
02팁과 총액 계산하기프로젝트
03금액 나누기프로젝트
04포맷팅된 출력프로젝트
반복문
7 개 강의1345
01For 반복문챌린지마스터리퀴즈
02While 반복문챌린지마스터리퀴즈
03Break챌린지마스터리퀴즈
04Continue챌린지마스터리퀴즈
05요약 - 팩토리얼챌린지
06Do While 반복문챌린지마스터리퀴즈
07중첩 반복문챌린지마스터리퀴즈
함수
8 개 강의1250
01함수 선언하기챌린지마스터리퀴즈
02인자챌린지마스터리퀴즈
03반환챌린지마스터리퀴즈
04복습 - Sigma 함수챌린지
05함수 표현식챌린지마스터리퀴즈
06기본 매개변수퀴즈
07화살표 함수챌린지마스터리퀴즈
08복습 - Validation 함수챌린지
색다른 FizzBuzz
프로젝트4 개 강의1
01게임 개요챌린지
02FizzBuzz 함수프로젝트
03숫자 반복하기프로젝트
04변형 요소 추가하기프로젝트
배열 Part 1
6 개 강의1037
01배열 선언하기챌린지마스터리퀴즈
02배열 요소에 접근하기챌린지마스터리퀴즈
03배열 수정하기챌린지퀴즈
04배열 메서드 Part 1챌린지마스터리퀴즈
05배열 메서드 Part 2챌린지마스터리퀴즈
06요약 - 배열 프로세서챌린지
배열 Part 2
8 개 강의1254
01배열 순회하기챌린지퀴즈
02forEach 메서드챌린지퀴즈
03for...of 루프챌린지마스터리퀴즈
04복습 - P 카운터챌린지
05배열 슬라이싱챌린지마스터리퀴즈
06배열 메서드 Part 3챌린지마스터리퀴즈
07배열 메서드 Part 4챌린지마스터리퀴즈
08포함 여부 확인챌린지퀴즈
식료품 목록 관리기
프로젝트4 개 강의1
01프로젝트 개요챌린지
02항목 추가프로젝트
03항목 삭제프로젝트
04목록 보기프로젝트
최종 도전
3 개 강의37
01숫자 피라미드챌린지퀴즈
02홀수 두 배로 만들기챌린지
03무엇을 살까챌린지
섹션 2
논리 & 흐름
섹션 시작하기시작펼치기접기문제 해결 기술을 개발하고 동적이고 상호작용적인 프로그램을 생성하세요65 개 강의60 챌린지325 문제2 프로젝트
문자열 심화
5 개 강의630
01문자열 기초퀴즈
02문자열 순회챌린지마스터리퀴즈
03템플릿 리터럴챌린지퀴즈
04문자열 메서드챌린지마스터리퀴즈
05요약 - String Weaver챌린지
다차원 배열
9 개 강의1452
012차원 배열 기초퀴즈
022차원 배열 요소 접근하기챌린지마스터리퀴즈
032차원 배열과 중첩 루프챌린지마스터리퀴즈
04요약 - 2차원 배열챌린지
05행렬의 덧셈과 뺄셈챌린지마스터리퀴즈
06가변 배열챌린지마스터리퀴즈
073차원 배열 그 이상챌린지마스터리퀴즈
08주요 2차원 배열 패턴챌린지마스터리퀴즈
09요약 - 배열의 모든 것챌린지
JSON 파트 1
7 개 강의944
01JSON이란 무엇인가요?퀴즈
02키 존재 여부 확인하기챌린지마스터리퀴즈
03객체 메서드챌린지마스터리퀴즈
04Spread 연산자 파트 1퀴즈
05Spread 연산자 파트 2챌린지마스터리퀴즈
06키 삭제하기챌린지마스터리퀴즈
07요약 - JSON 키 조작하기챌린지
JSON 파트 2
6 개 강의530
01JSON 순회하기챌린지퀴즈
02중첩된 JSON챌린지퀴즈
03JSON 옵셔널 체이닝퀴즈
04얕은 복사와 깊은 복사챌린지퀴즈
05복습 - 자전거 상점챌린지
06복습 - 태양계챌린지
Set 파트 1
8 개 강의749
01Set이란 무엇인가요?챌린지퀴즈
02Set 순회하기퀴즈
03요소 추가하기챌린지퀴즈
04요소 삭제하기챌린지퀴즈
05요소 존재 여부 확인하기챌린지퀴즈
06크기 및 비어 있는지 확인챌린지퀴즈
07복사 및 비우기챌린지퀴즈
08요약 - Set의 기초챌린지
집합 파트 2
6 개 강의637
01수학 - 합집합챌린지퀴즈
02수학 - 교집합챌린지퀴즈
03수학 - 차집합챌린지퀴즈
04수학 - 대칭차집합챌린지퀴즈
05부분집합과 상위집합챌린지퀴즈
06복습 - 친구 그룹화챌린지
도서 관리 시스템
프로젝트5 개 강의1
01프로젝트 개요챌린지
02도서 추가하기프로젝트
03제목으로 검색하기프로젝트
04장르별 필터링프로젝트
05읽음 상태로 표시하기프로젝트
배열의 흥미로운 주제들
4 개 강의422
01배열 구조 분해 할당챌린지퀴즈
02배열에서의 Spread 문법챌린지퀴즈
03희소 배열챌린지퀴즈
04복습 - 배열 워크숍챌린지
고급 배열 메서드
9 개 강의761
01Join 및 Split 메서드퀴즈
02Map 메서드챌린지마스터리퀴즈
03Filter 메서드챌린지퀴즈
04Reduce 메서드챌린지퀴즈
05배열 메서드 체이닝챌린지퀴즈
06ForEach와 Map은 같을까?퀴즈
07Sort 메서드챌린지퀴즈
08Find 및 FindIndex 메서드퀴즈
09요약 - 체인 마스터챌린지
축제 시스템 관리하기
프로젝트6 개 강의1
01프로젝트 개요챌린지
02영화 및 상영관 추가하기프로젝트
03상영 일정 추가하기프로젝트
04티켓 예매하기프로젝트
05영화 평점 남기기프로젝트
06상영 취소하기프로젝트
섹션 3
TypeScript 소개전용 페이지
섹션 시작하기시작펼치기접기JavaScript에 대해 배운 후 TypeScript 소개73 개 강의58 챌린지438 문제2 프로젝트
TS 시작하기
5 개 강의232
01TypeScript란 무엇인가요?퀴즈
02왜 TypeScript를 사용해야 할까요?퀴즈
03첫 번째 TypeScript 코드 작성하기챌린지퀴즈
04컴파일 과정 및 에러퀴즈
05요약: TS 입문챌린지
핵심 타입
7 개 강의748
01기본 타입: str, num, boolean챌린지퀴즈
02'any' 타입: 탈출구챌린지퀴즈
03'unknown' 타입챌린지퀴즈
04'null' & 'undefined' 다루기챌린지퀴즈
05타입 추론의 활용챌린지퀴즈
06명시적 타입 어노테이션챌린지퀴즈
07요약: 핵심 타입 실습챌린지
자료구조: 배열과 튜플
9 개 강의862
01타입이 지정된 배열챌린지퀴즈
02배열의 'readonly' 수식어챌린지퀴즈
03튜플이란 무엇인가?퀴즈
04튜플 선언과 접근챌린지퀴즈
05튜플 구조 분해챌린지퀴즈
06읽기 전용 튜플챌린지퀴즈
07다차원 타입 배열챌린지퀴즈
08배열과 Spread Operator챌린지퀴즈
09요약: 배열과 튜플챌린지
함수 활용하기
8 개 강의855
01매개변수 및 반환값 타입 지정챌린지퀴즈
02화살표 함수 타입 지정챌린지퀴즈
03'void' 반환 타입챌린지퀴즈
04'?'를 사용한 선택적 매개변수챌린지퀴즈
05기본 매개변수 값챌린지퀴즈
06나머지 매개변수 타입 지정챌린지퀴즈
07함수 타입 정의하기챌린지퀴즈
08요약: 타입이 지정된 함수 작성하기챌린지
타입: 별칭, 유니온 및 인터섹션
7 개 강의751
01원시 타입을 위한 타입 별칭챌린지퀴즈
02유니온 타입 ('|')챌린지퀴즈
03유니온 타입 활용하기챌린지퀴즈
04리터럴 타입챌린지퀴즈
05인터섹션 타입 ('&')챌린지퀴즈
06타입 별칭 결합하기챌린지퀴즈
07요약: 고급 타입 조합챌린지
객체와 인터페이스 타입 정의
8 개 강의757
01인라인 객체 타입 어노테이션챌린지퀴즈
02객체를 위한 타입 별칭챌린지퀴즈
03인터페이스 소개챌린지퀴즈
04인터페이스 vs 타입 별칭퀴즈
05선택적 속성과 읽기 전용 속성챌린지퀴즈
06인터페이스와 타입 확장하기챌린지퀴즈
07인터페이스에 메서드 추가하기챌린지퀴즈
08요약: 객체 구조 정의하기챌린지
프로젝트: 간단한 할 일 목록
프로젝트6 개 강의18
01프로젝트: Task 구조체 정의하기챌린지퀴즈
02할 일 추가 함수프로젝트
03할 일 상태 변경 함수프로젝트
04함수: 상태별 할 일 목록 보기프로젝트
05함수: 할 일 요약 출력하기프로젝트
06하나로 합치기프로젝트
열거형
6 개 강의638
01숫자형 열거형이란 무엇인가요?챌린지퀴즈
02숫자형 열거형 사용하기챌린지퀴즈
03문자열 열거형이란 무엇인가요?챌린지퀴즈
04문자열 열거형 사용하기챌린지퀴즈
05이종 열거형챌린지퀴즈
06요약: 열거형 사용하기챌린지
제네릭: 살펴보기
6 개 강의537
01제네릭이 해결하는 문제퀴즈
02제네릭 Identity 함수 만들기챌린지퀴즈
03제네릭 함수 사용하기챌린지퀴즈
04제네릭 배열챌린지퀴즈
05제네릭 인터페이스챌린지퀴즈
06요약: 제네릭 함수 연습챌린지
프로젝트: 재고 관리
프로젝트5 개 강의18
01프로젝트: 제네릭 재고 아이템챌린지퀴즈
02함수: 재고에 아이템 추가하기프로젝트
03ID로 아이템을 찾는 함수프로젝트
04특정 재고 유형 생성하기프로젝트
05아이템 상세 정보를 가져오는 함수프로젝트
고급 주제
6 개 강의642
01타입 단언챌린지퀴즈
02타입 가드: in & instanceof챌린지퀴즈
03'never' 타입챌린지퀴즈
04Nullable 타입 ('strictNull')챌린지퀴즈
05객체 인덱스 시그니처챌린지퀴즈
06요약: 타입 세부 조정챌린지
섹션 4
객체 지향 프로그래밍
섹션 시작하기시작펼치기접기클래스, 객체, 재사용 가능한 구조로 코드를 구성하는 방법을 알아보세요56 개 강의49 챌린지304 문제3 프로젝트
객체와 this 키워드
6 개 강의642
01객체 빠른 복습챌린지퀴즈
02객체에 메서드 추가하기챌린지퀴즈
03this 키워드 이해하기챌린지퀴즈
04생성자 함수챌린지퀴즈
05new 키워드챌린지퀴즈
06요약 챌린지챌린지
코드 구조화하기
4 개 강의434
01모듈이란 무엇인가요?챌린지퀴즈
02export로 내보내기챌린지퀴즈
03import로 가져오기챌린지퀴즈
04기본 내보내기 vs. 이름 지정 내보내기챌린지퀴즈
클래스와 객체
4 개 강의426
01클래스란 무엇인가요?챌린지퀴즈
02인스턴스 생성하기챌린지퀴즈
03프로퍼티와 메서드챌린지퀴즈
04복습 챌린지챌린지
메서드와 상태 관리
2 개 강의218
01상태를 변경하는 메서드챌린지퀴즈
02메서드 체이닝 패턴챌린지퀴즈
캡슐화와 접근
4 개 강의426
01캡슐화챌린지퀴즈
02Public & Private 클래스 필드챌린지퀴즈
03Private 메서드챌린지퀴즈
04복습 챌린지챌린지
프로젝트: 간단한 은행 계좌
프로젝트3 개 강의1
01BankAccount 클래스챌린지
02입금과 출금프로젝트
03Private 필드로 잔액 관리프로젝트
상속과 extends 키워드
6 개 강의645
01상속챌린지퀴즈
02"is-a" 관계챌린지퀴즈
03extends 키워드챌린지퀴즈
04super() 메서드챌린지퀴즈
05속성과 메서드 상속하기챌린지퀴즈
06복습 챌린지챌린지
OOP 코드 구조화하기
1 레슨19
01클래스를 모듈로 구성하기챌린지퀴즈
정적 메서드와 프로퍼티
4 개 강의425
01클래스 레벨 vs 인스턴스 레벨챌린지퀴즈
02정적 프로퍼티챌린지퀴즈
03정적 유틸리티 메서드챌린지퀴즈
04복습 챌린지챌린지
다형성
4 개 강의425
01다형성이란 무엇인가요?챌린지퀴즈
02상속된 메서드 오버라이딩챌린지퀴즈
03super 사용하기챌린지퀴즈
04복습 챌린지챌린지
프로젝트: 도형 렌더러
프로젝트4 개 강의1
01설정: Shape 클래스와 Export챌린지
02Circle 클래스 상속프로젝트
03오버라이딩과 Area 메서드프로젝트
04정적 Shape 카운터프로젝트
Getter와 Setter
4 개 강의426
01get 및 set 키워드챌린지퀴즈
02계산된 속성챌린지퀴즈
03유효성 검사와 부수 효과챌린지퀴즈
04복습 챌린지챌린지
합성 vs 상속
3 개 강의328
01"has-a" vs "is-a" 관계챌린지퀴즈
02깊은 상속의 한계챌린지퀴즈
03객체 구축하기챌린지퀴즈
도서 관리 시스템
프로젝트3 개 강의1
01도서관 설계하기챌린지
02컴포지션을 활용한 Book 클래스프로젝트
03도서 저자 유효성 검사프로젝트
최종 챌린지
4 개 강의4
01게임 캐릭터 빌더챌린지
02이커머스 상품 시스템챌린지
03대학교 관리 시스템챌린지
04스마트 홈 기기 시스템챌린지

JavaScript 코스

브라우저에서 무료로 시작하는 실습형 JavaScript 코스.

자료구조

입문자 챌린지 - 기초 개념 연습하기

Coddy에서 JavaScript을 배우는 이유

브라우저에서 JavaScript를 바로 실행하세요. Node.js 설치도, IDE 설정도 필요 없습니다. 에디터와 출력이 나란히 배치되어 있어 JavaScript 피드백 루프가 짧습니다.
모던 JavaScript: ES6+ 문법, arrow function, promise, async/await, 구조 분해 할당, 모듈까지 - 레거시 패턴이 아니라 실무에서 실제로 쓰는 JavaScript를 다룹니다.
AI 힌트는 정답을 알려주지 않으면서 막힌 부분을 디버깅하도록 도와줍니다. 덕분에 다음에 JS 코드를 작성할 때 도움이 되는 사고 모델을 스스로 쌓게 됩니다.
JavaScript 과정을 마치면 LinkedIn이나 이력서에 추가할 수 있는 무료 수료증을 받을 수 있습니다.

JavaScript 학습에 대한 자주 묻는 질문

JavaScript은 배우기 쉬운가요?

JavaScript는 입문하기에 비교적 쉬운 프로그래밍 언어 중 하나입니다. 문법이 관대하고, 어떤 브라우저에서든 코드를 바로 실행할 수 있으며, 기본적인 상호작용(버튼 클릭, alert)이 즉각적인 시각 피드백을 줍니다. 까다로운 부분 - 비동기 코드, 클로저, this 바인딩 - 은 나중에 등장하며, 코스는 실습 예제와 함께 이들을 점진적으로 소개합니다.

JavaScript을 배우는 데 얼마나 걸리나요?

JavaScript의 기초는 매일 연습하면 보통 1~2주 안에 익힐 수 있습니다. 실제 프로젝트를 편하게 만들려면 속도에 따라 1~3개월 정도를 잡는 것이 좋습니다.

JavaScript을 배우기 전에 HTML과 CSS를 먼저 배워야 하나요?

도움이 됩니다. 실제 페이지를 직접 바꿔볼 수 있으면 - 요소를 숨기고, 텍스트를 바꾸고, 클릭에 반응하게 만들고 - JavaScript가 훨씬 더 구체적으로 다가옵니다. HTML과 CSS 강의는 짧고, DOM을 다루는 JavaScript 강의로 자연스럽게 이어집니다. 물론 순수 JavaScript 로직부터 시작해도 됩니다.

JavaScript을 온라인에서 무료로 배울 수 있나요?

네. 인터랙티브 JavaScript 강좌는 무료입니다 - 전체 레슨, 코딩 실습, 퀴즈, 그리고 수료증까지 포함되어 있어요. 에디터가 브라우저에서 바로 실행되기 때문에 JS를 작성하기 위해 Node.js나 다른 도구를 따로 설치할 필요가 없습니다.

JavaScript와 Java의 차이는 무엇인가요?

이름은 비슷하지만, 둘은 서로 관련 없는 언어입니다. Java는 정적 타입의 클래스 기반 언어로 서버와 Android에서 많이 쓰입니다. JavaScript는 동적 타입 언어이고 브라우저와 Node.js에서 실행됩니다. 웹을 한다면 JavaScript를, Android나 대규모 엔터프라이즈 백엔드를 한다면 Java를 배우세요.

JavaScript 강의를 마치면 수료증을 받을 수 있나요?

네. JavaScript 코스를 끝내면 무료 수료증을 받을 수 있고, LinkedIn에 공유하거나 이력서에 넣을 수 있습니다. 단순히 튜토리얼 영상을 본 게 아니라 체계적인 인터랙티브 코스를 끝까지 완주했다는 검증 가능한 증거예요.

Coddy programming languages illustration

Coddy와 함께 JavaScript 배우기

시작하기

JavaScript 배우기

기초

소개

변수

연산자 파트 1

연산자 파트 2

조건문

기초 입출력

금액 분할 계산기

반복문

함수

색다른 FizzBuzz

배열 Part 1

배열 Part 2

식료품 목록 관리기

최종 도전

논리 & 흐름

문자열 심화

다차원 배열

JSON 파트 1

JSON 파트 2

Set 파트 1

집합 파트 2

도서 관리 시스템

배열의 흥미로운 주제들

고급 배열 메서드

축제 시스템 관리하기

TypeScript 소개전용 페이지

TS 시작하기

핵심 타입

자료구조: 배열과 튜플

함수 활용하기

타입: 별칭, 유니온 및 인터섹션

객체와 인터페이스 타입 정의

프로젝트: 간단한 할 일 목록

열거형

제네릭: 살펴보기

프로젝트: 재고 관리

고급 주제

객체 지향 프로그래밍

객체와 this 키워드

코드 구조화하기

클래스와 객체

메서드와 상태 관리

캡슐화와 접근

프로젝트: 간단한 은행 계좌

상속과 extends 키워드

OOP 코드 구조화하기

정적 메서드와 프로퍼티

다형성

프로젝트: 도형 렌더러

Getter와 Setter

합성 vs 상속