프론트엔드 코딩 실습 랩 – JavaScript TypeScript React 무료 문제

Coding Learning Lab기초 학습부터 실습 채점까지

기초를 배우고 바로 실습하는 코딩 학습 랩

짧게 개념을 확인한 뒤 JavaScript, TypeScript, React 문제를 직접 풀고 채점합니다. 처음 온 학습자도 기초 학습에서 실습 문제로 자연스럽게 이어지도록 구성했습니다.

기초 학습 시작문제 풀기
75무료 공개 문제
30JavaScript 실습
30TypeScript 실습
15React 실전 예제

추천 학습 흐름

기초 8단계 → JavaScript 30문제 → TypeScript 30문제 순서로 진행하면 읽기와 실습이 끊기지 않습니다.

학습자는 무엇을 하면 되나요?

먼저 기초 페이지에서 핵심 개념을 확인하고, 이어서 실습 랩에서 같은 주제의 문제를 풉니다. 막히면 힌트와 해설을 확인한 뒤 다시 시도하면 됩니다.

1. 배우기함수, 조건문, 반복문, 배열, 객체를 짧은 단위로 확인합니다.
2. 풀기브라우저에서 코드를 입력하고 바로 채점 결과를 봅니다.
3. 확장하기실무 팁과 추가 과제로 문제를 한 번 더 변형합니다.
함수와 반환값
조건문과 분기
반복문과 누적값
배열 filter/map/reduce
객체 데이터 가공
문자열 처리
DOM 기초
비동기 JavaScript

현재 제공되는 학습

회원가입 없이 무료 문제를 풀 수 있고, 진행률은 사용 중인 브라우저에 저장됩니다. 가격이나 유료 전환보다 먼저 학습 경험과 콘텐츠 완성도를 높이는 단계입니다.

무료 범위

JavaScript 30문제, TypeScript 30문제, React 15문제를 바로 풀 수 있습니다.

저장 방식

문제 풀이 진행률은 현재 브라우저에 저장됩니다.

채점 방식

테스트 케이스가 작성한 코드를 실행하고 예상 결과와 비교합니다.

함수입문무료

문제 제목

문제 설명
solution.jsCtrl+Enter로 채점
JavaScript 무료 30문제함수, 조건문, 반복문, 문자열, 배열, 객체, DOM, 비동기까지 실무 예제로 연습.
TypeScript 무료 30문제타입, 선택 속성, 유니온, 제네릭, API 응답, 유틸리티 타입까지 실무 예제로 연습.
React 무료 5문제상태, 입력값, 리스트, 필터, 로딩 상태를 작은 컴포넌트 예제로 연습.
심화 학습 자료문제를 푼 뒤 더 연습할 수 있도록 해설, 학습 루틴, 실무 예제를 계속 보강합니다.
LEARNING UPDATE

오답 해설과 30일 복습 루틴 받기

문제를 풀다 막히는 지점을 알려주면, 다음 자료를 만들 때 우선 반영합니다. 새 문제, 오답 원인 해설, 실무 예제 업데이트가 있을 때만 이메일로 안내합니다.

Blank Form (#3)