- ‘코로나보드’ 개발자는
- 어떻게 하루 200만 뷰의 서비스를 이틀 만에 개발하고
- 안정적으로 운영하며 수익까지 창출할 수 있었을까?

일 200만, 누적 2억 뷰의 웹 서비스 ‘코로나보드’ 개발자가 코로나보드의 자동 크롤링 파이프라인, 운영, 수익화의 모든 것을 알려준다. 갑자기 많은 사용자가 접속해도 장애 없이 안정적으로 서비스하는 웹 서비스를 설계하려면 많은 경험이 필요하다. 저자는 대기업에서 대규모 트래픽을 감당하는 서비스를 개발한 경험을 살려 코르나보드를 개발했고, 노하우를 이 책에 녹였다. 완성도 높은 사이드 프로젝트를 원하는 분, 취준생, 풀스택 개발자로 거듭나고 싶은 분께 최고의 선택이 될 것이다. 껍데기만 따라 만들어서는 제대로 실력을 갖출 수 없다. 실제 동작하는 제대로 된 웹 서비스를 처음부터 끝까지 개발하면서 실력을 키워보자!

* 이 책에서 만들 ‘코로나보드’ 방문해보기 : https://coronaboard.kr
* 선수지식 : HTML, CSS, 자바스크립트(리액트까지 알면 더 좋다)

연세대학교 전기전자공학과 학사, 글로벌융합공학과 석사를 졸업하고 LINE에서 라인뮤직 iOS 앱과 서버를 4년간 개발했다. 작은 스타트업들과 라인 등의 회사를 거치며 다양한 경험을 쌓았고, 현재는 스퀘어랩에서 항공/호텔 예약 서비스를 개발한다. 다양한 서비스를 개발하면서 웹, 백엔드, CLI 자동화 툴 등 분야를 가리지 않고 자바스크립트를 실무에 사용해왔다. 2020년 1월에 개인 프로젝트로 서비스를 시작한 코로나19 실시간 상황판(https://coronaboard.kr) 또한 전부 자바스크립트로 개발했다. 현재는 여행 서비스를 개발하는 스퀘어랩에서 플레이윙즈와 카이트를 만들고 있으며 리모트 워크를 하면서 디지털 노마드로 살고 있는 풀스택 개발자입니다( letmecompile.com ).

00 개발 환경 구축

01장 코로나보드 아키텍처와 웹 서비스
__1.1 한눈에 보는 코로나보드
__1.2 개발 언어 선택하기
__1.3 프론트엔드 선택하기
__1.4 백엔드 설계하기
__1.5 코로나보드 아키텍처 핵심 포인트 요약
__학습 마무리

[1단계] 백엔드에서 서비스 준비하기

02장 API 서버 만들기
__2.1 코로나보드 API서버 아키텍처 소개
__2.2 노드JS알아보기
__2.3 익스프레스 준비하기
__2.4 데이터베이스 준비하기 : MySQL
__2.5 API서버와 데이터베이스 연동하기
__2.6 API 만들기
__학습 마무리

03장 저장소 구축하기 : 구글 시트
__3.1 코로나보드와 구글 시트
__3.2 구글 시트 API 사용 설정
__3.3 구글 시트 API로 데이터 읽기
__학습 마무리

04장 데이터 자동 수집하기 : 크롤링
__4.1 코로나보드와 크롤링
__4.2 크롬 [개발자 도구] 사용하기
__4.3 웹페이지 크롤링을 위한 배경 지식
__4.4 웹페이지 크롤러 만들기
__학습 마무리

[2단계] 프론트엔드로 사용자에게 다가가기

05장 웹사이트 UI 구성하기 : 개츠비
__5.1 코로나보드와 개츠비
__5.2 개츠비 개발 환경 구축하기
__5.3 리액트 컴포넌트 만들기
__5.4 정적 웹페이지 추가하기
__5.5 백엔드 데이터 불러오기
__5.6 정적 웹사이트 빌드하기
__학습 마무리

06 반응형 웹 디자인하기 : 부트스트랩
__6.1 코로나보드와 부트스트랩
__6.2 부트스트랩 UI컴포넌트 익히기
__6.3 그리드 시스템으로 반응형 현황판 만들기
__학습 마무리

07장 시각화로 핵심 정보 전달하기
__7.1 코로나보드와 시각화
__7.2 데이터 시각화 방법
__7.3 구글 차트 이용하기
__7.4 아파치 이차트 이용하기
__학습 마무리

[3단계] 〈PROJECT〉 코로나보드 만들기

08장 〈STEP 1〉 실전 크롤러 만들기
__8.1 크롤링 클론 사이트 소개
__8.2 코로나19 국내 통계 크롤러
__8.3 코로나19 국가별 통계 크롤링
__8.4 동작 및 데이터 확인
__학습 마무리

09장 〈STEP 2〉 대시보드와 공지사항 만들기
__9.1 사전 준비 : 라이브러리 설치
__9.2 대시보드 만들기
__9.3 공지사항 만들기
__학습 마무리

10장 〈STEP 3〉 슬라이드 만들기 I : 국가별, 글로벌 차트
__10.1 국가별 현황 슬라이드 만들기
__10.2 글로벌 차트 슬라이드 만들기
__학습 마무리

11장 〈STEP 4〉 슬라이드 만들기 II : 국내 차트, 유튜브
__11.1 국내 차트 슬라이드 만들기
__11.2 유튜브 슬라이드 만들기
__학습 마무리

12장 〈STEP 5〉 메뉴바 만들고 테스트하기
__12.1 사전 지식 : 단일 페이지 내에서 이동
__12.2 내부 메뉴바 만들기
__12.3 상단 고정 메뉴바 만들기
__12.4 화면 최상단 이동 버튼 만들기
__학습 마무리

[4단계] 〈PROJECT〉 배포하고 운영하기

__13장 〈STEP 1〉 데이터베이스 설정하기 : AWS RDS
__13.1 사전 준비 : AWS 가입 및 설정
__13.2 데이터베이스 서버 생성하기
__13.3 데이터베이스 서버에 접속하기
__13.4 보안 그룹 설정하기
__13.5 데이터베이스 서버 접속 및 기본 설정 확인하기
__학습 마무리

14장 〈STEP 2〉 서비스 올리기 : AWS EC2
__14.1 서버 인스턴스 생성하기
__14.2 서버 인스턴스 접속하기
__14.3 서버 인스턴스에 필요한 프로그램 설치하기
__14.4 API서버 배포하기
__14.5 크롤러 배포하기
__14.6 정적 웹사이트 빌드하기
__학습 마무리

15장 〈STEP 3〉 파일 서버 운영하기 : AWS S3
__15.1 S3버킷 생성 및 웹사이트 호스팅 설정하기
__15.2 웹사이트 파일을 S3에 배포하기
__15.3 배포 스케줄링하기
__학습 마무리

16장 〈STEP 4〉 도메인 연결하기
__16.1 사전 지식 : 도메인과 DNS
__16.2 클라우드플레어 설정하기
__학습 마무리

[5단계] 〈PROJECT〉 운영하며 광고 수익내기

17장 〈STEP 1〉 검색 엔진에 알리기
__17.1 사전 지식 : 검색 엔진의 동작 방식
__17.2 검색 엔진에 웹사이트 등록하기
__17.3 검색 엔진 최적화 작업하기
__17.4 개츠비 기반 웹사이트에서 메타 디스크립션 추가하기
__17.5 SNS에 공유하기
__학습 마무리

18장 〈STEP 2〉 사용자 분석하기 : 구글 애널리틱스 4
__18.1 구글 애널리틱스로 사용자 데이터 쌓기
__18.2 GA 웹 콘솔에서 분석하기
__학습 마무리

19장 〈STEP 3〉 광고로 웹사이트 수익화하기
__19.1 구글 애드센스로 광고 수익 창출하기
__19.2 쿠팡 파트너스로 광고 수익 창출하기
__학습 마무리

[부록] 비동기 함수와 async, await 키워드