세종 한솔고등학교 코딩 동아리 DTC의 공식 GitHub입니다.
수업자료 저장을 위해 만들어졌습니다
| # | 분류 | 강의 | 배우는 것 | 자료 |
|---|---|---|---|---|
| 1 |  |
혼자 쓰는 Git | add · commit · log · 되돌리기 · .gitignore |
슬라이드 · 코드 |
| 2 |  |
HTML | 문서의 뼈대 · 태그 문법 · 목록 · 링크 · 표 · 폼 · 시맨틱 | 슬라이드 · 코드 |
| 3 |  |
CSS | id · class · 글자 · 색 · 박스 모델 · display · flexbox |
슬라이드 · 코드 |
| 4 |  |
JavaScript 1강 | 변수 · 타입 · 비교 · 배열 · 객체 · 조건문 · 반복문 · 함수 | 슬라이드 · 코드 |
| 5 | |
JavaScript 2강 | class · 타이머 · Promise · async/await · DOM · 이벤트 |
슬라이드 · 코드 |
| 6 |  |
TypeScript 1강 | 기본 타입 · 함수 · interface · 유니온 · any와 unknown |
슬라이드 · 코드 |
| 7 | |
TypeScript 2강 | 제네릭 · 유틸리티 타입 · React 적용 · tsconfig |
슬라이드 · 코드 |
| 8 |  |
React 1강 | JSX · 컴포넌트 · props · 리스트 · 조건부 렌더링 |
슬라이드 · 코드 |
| 9 | |
React 2강 | useState · 이벤트 · 불변성 · 폼 · 상태 끌어올리기 |
슬라이드 · 코드 |
| 10 | |
React 3강 | useEffect · 의존성 배열 · 정리 함수 · 데이터 가져오기 |
슬라이드 · 코드 |
| 11 | |
React 4강 | Context · useRef · useMemo · 커스텀 훅 · 폴더 구조 |
슬라이드 · 코드 |
| 12 | |
React 5강 | 라우팅 · 빌드 · 배포 · 미니 프로젝트 | 슬라이드 · 코드 |
| 13 |  |
Next.js 1강 | 파일 기반 라우팅 · 동적 라우트 · layout |
슬라이드 · 코드 |
| 14 | |
Next.js 2강 | 서버 컴포넌트 · 'use client' · 경계 다루기 |
슬라이드 · 코드 |
| 15 | |
Next.js 3강 | async 컴포넌트 · loading · error · 캐싱 |
슬라이드 · 코드 |
| 16 | |
Next.js 4강 | 라우트 핸들러 · 서버 액션 · 메타데이터 · 배포 | 슬라이드 · 코드 |
| 17 | |
같이 쓰는 Git | 브랜치 · merge · 충돌 해결 · GitHub · Pull Request |
슬라이드 · 코드 |
슬라이드 링크를 누르면 브라우저에서 바로 열립니다. 설치할 것이 없습니다.
| 키 | 동작 |
|---|---|
→ Space |
다음으로 |
← |
이전으로 |
↓ ↑ |
같은 주제 안에서 단계 이동 |
O |
전체 슬라이드 한눈에 보기 |
F |
전체화면 |
순서대로 보려면 스페이스바나 오른쪽 화살표만 눌러도 됩니다
각 강의 저장소를 받아서 열 수도 있습니다.
git clone https://github.com/hansol-dtc/css.git
cd css
npm i --force
npm run dev