인기여정
JavaScript 배우기
무료 인터랙티브 온라인 JavaScript 강의입니다. 모든 레슨에서 직접 JS를 작성합니다 — 문법, 최신 ES6 기능, 함수, DOM까지. 막힐 땐 AI 힌트가 도와주고, 끝까지 마치면 수료증도 받습니다.
245,770+ 명의 codders가 등록함
- 초보자 환영
AI 코딩 도우미
실습 중심의 대화형 강의
모든 레슨에 음성 나레이션 제공
지식을 확인하는 퀴즈
무료 수료증
커리큘럼
섹션 1
기초
섹션 시작하기시작펼치기접기필수 개념과 기본 기술로 튼튼한 기초를 구축하세요소개
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
논리 & 흐름
섹션 시작하기시작펼치기접기문제 해결 기술을 개발하고 동적이고 상호작용적인 프로그램을 생성하세요문자열 심화
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 소개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
객체 지향 프로그래밍
섹션 시작하기시작펼치기접기클래스, 객체, 재사용 가능한 구조로 코드를 구성하는 방법을 알아보세요객체와 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스마트 홈 기기 시스템챌린지
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에 공유하거나 이력서에 넣을 수 있습니다. 단순히 튜토리얼 영상을 본 게 아니라 체계적인 인터랙티브 코스를 끝까지 완주했다는 검증 가능한 증거예요.
