Do it 클론 코딩 줌 - 노마드 코더와 만드는 화상 채팅 서비스

똑같이 만들어 보는 것만큼 초보자에게
효과적인 학습법은 없다!
왜냐면 클론 코딩은 "진짜"를 만드니까!

주니어 개발자들의 필수 북마크, '노마드 코더'의 대표 강사 니꼴라스는 세상에서 가장 빠르게 프로그래밍을 배울 수 있는 방법은 '클론 코딩'이라고 말한다. 클론 코딩은 줌, 트위터, 넷플릭스, 인스타그램과 같은 실제 서비스를 복제해 보는 프로그래밍 학습 방법이다. 클론 코딩은 코드를 입력할 때마다 눈앞에 결과물이 바로바로 보이므로 프로그래밍을 빠르고 재미있게 배울 수 있다. HTML, CSS, 자바스크립트를 이제 막 뗀 웹 개발 초보자도 3일이면 충분하다!
이 책은 클론 코딩 시리즈의 세 번째이자, 화상 채팅 서비스인 줌(ZOOM)을 똑같이 만들어 본다. 웹 소켓을 이용한 실시간 메시지 교환, 채팅룸 생성, 그리고 실시간 화상 채팅까지 줌의 핵심 서비스를 똑같이 구현한다. 그야말로 진짜 서비스를 만드는 것이다.

01 클론 코딩 줌 시작하기

__01-1 클론 코딩 줌, 이런 기능을 만들어요!
__01-2 클론 코딩 수업 준비하기
__01-3 프로젝트 생성하기
__01-4 서버를 위한 준비 작업
__01-5 프런트엔드를 위한 준비 작업

02 웹소켓을 이용한 실시간 기능 구현하기

__02-1 HTTP와 비교하면 이해되는 웹소켓
__02-2 웹소켓 설치하고 서버 만들기
__02-3 웹소켓 이벤트
__02-4 메시지 주고받기

03 실시간 채팅 완성하기

__03-1 채팅 기능 준비하기
__03-2 사용자 간 채팅하기
__03-3 닉네임 추가하기 1
__03-4 닉네임 추가하기 2

04 socket.io를 이용한 채팅룸 만들기

__04-1 socket.io 설치하기
__04-2 socket.io 다루기
__04-3 채팅룸 만들기
__04-4 채팅룸 안에서 메시지 교환하기
__04-5 채팅룸 알람 보내기

05 채팅룸 완성하기

__05-1 닉네임 추가하기
__05-2 채팅룸 관리하기
__05-3 사용자 수 표시하기
__05-4 Admin panel 사용하기

06 화상 채팅 준비하기

__06-1 카메라 불러오기
__06-2 비디오와 오디오 제어하기
__06-3 카메라 변경하기

07 화상 채팅 완성하기

__07-1 WebRTC 알아보기
__07-2 채팅룸 만들고 관리하기
__07-3 데이터 교환을 위한 offer 보내기
__07-4 offer에 응답하는 answer 보내기
__07-5 peer-to-peer 연결 생성하기
__07-6 미디어 트랙 제어하기
__07-7 메시지 교환 기능 추가하기

08 스타일시트 추가하기

__08-1 스타일 정의를 위한 준비
__08-2 스타일 정의하기