리액트 입문을 마친 여러분

이제는 심화 과정입니다 💪

▶ 타입스크립트 100% 활용 풀스탭 개발 프로젝트

1차 웹 개발 입문 클래스, 2차 리액트 입문 클래스에 이어서 이번 3차 클래스에서는 주니어 개발자를 위한 TypeScript 100% 활용 풀스택 개발 클래스를 준비했습니다. 이번 클래스는 리액트 기초에서 한 발 더 나아가, TypeScript를 활용한 타입 체크, RPC의 정의와 구현, 인증, 로그인, 세션까지 모두 담았습니다.

TypeScript

꼭 배워야 하나요?

최근 대부분의 웹 개발자 채용 공고에서 TypeScript 개발 경험을 요구하는 것을 볼 수 있습니다. TypeScript는 무엇이고, 왜 필요한 걸까요? 결론부터 말씀 드리자면

TypeScript를 사용하면 여러분의 개발이 '훨씬' 편해집니다

많은 분들이 TypeScript를 아예 다른 언어라고 생각하시는 것 같습니다. 그래서 우선은 JavaScript 를 마스터한 뒤 TypeScript 를 배워야 한다고 생각하는 거죠. 하지만 TypeScript는 우리에게 새로운 언어가 아닙니다. 특히나 JavaScript를 배운 여러분에게는요.

TypeScript 공식 사이트에서 정의하는 내용을 직역하면, TypeScript는 타입을 위한 구문이 있는 JavaScript라고 설명합니다. 문장이 어색하죠? 쉽게 말하면, TypeScript는 JavaScript와 100% 호환되는 언어로, JavaScript의 모든 기능을 포함하면서도 개발자를 위한 많은 개선점을 가지고 있습니다.

가장 큰 특징 중 하나는, TypeScirpt를 사용하면 코드에 타입을 명시하고 타입에 맞지 않는 변수나 함수들에서 에러를 발생시켜 버그를 사전에 제거합니다.

TypeScript를 100%

활용하는 방법을 알려드립니다

이 클래스에서는 최소한의 외부 모듈만 사용하여 필요한 기능을 직접 구현합니다. 유행하는 라이브러리의 사용법을 배우는 것이 아닌, 그 라이브러리가 내부적으로 어떻게 동작하는 지에 대해 생각해 봅니다.

이 클래스에서는 처음부터 끝까지 하나의 SNS 서비스를 만듭니다. 완성된 서비스의 예시는 링크 에서 확인하실 수 있습니다. 다만 이 예시는 말 그대로 하나의 예시일 뿐입니다. 강의 전반에 걸쳐서, 모든 코드는 유지보수가 용이하게 작성됩니다. 클래스를 완주한 뒤에는 간단한 코드 몇 줄을 추가하는 것 만으로 새로운 기능을 구현해서, 한 번의 명령어 실행으로 배포할 수 있습니다. 여러분만의 서비스를 만들어서 운영해보세요!

📝 자료 제공

모든 챕터에 해당하는 코드를 Github 또는 압축파일로 제공해드립니다.

커리큘럼 미리보기

📍Express, React, TypeScript

백엔드는 Express, 프론트엔드는 React를 기반으로 하며, 모두 TypeScript를 사용합니다. 앱의 다양한 부분에 TypeScript를 최대로 활용하여 유지 보수하기 쉬운 코드를 작성합니다. 타입 울렁증이 있다면 이번 클래스에서 충격 요법으로 치료 됩니다.

📍 RPC 구현

Typescript의 타입 체킹을 활용하여 IDE 친화적인 통신 프로토콜을 직접 구현합니다.

📍 OAuth2

OAuth2 프로토콜을 이해한 뒤 라이브러리 없이 직접 카카오 서버로 요청을 보내서 카카오로 로그인을 구현합니다. 세션 관리까지 직접 해봅니다.

📍 데이터베이스 연동 + AWS 배포까지

MariaDB(MySQL)을 설치하고 쿼리를 작성합니다. 완성된 앱은 AWS통해 배포하며, 쉘 스크립트를 통해 빌드와 배포를 자동화합니다.

여기까지 마쳤다면, 축하합니다. 풀스택 웹 개발자를 위한 첫 걸음을 시작했군요!

기술 스택만큼 중요한 것을 알려드립니다.

트렌드는 끝없이 변화하고 매일 새로운 기술이 쏟아져 나옵니다. 그리고 한 명의 개발자가 세상에 존재하는 모든 프레임워크에 대해 통달하는 것은 불가능하죠. 개발자에게 정말 중요한 것은 단순 기술 스택이 아니라, 프로그래밍을 근본적으로 이해하고 응용할 수 있는 사고력에 있습니다. 그리고 이 클래스는 여러분들이 새로운 프레임워크/라이브러리의 사용법을 쉽게 배울 수 있도록 기초 역량을 기르는 것에 초점이 맞춰져 있습니다.

TypeScript를 활용한 풀스택 개발 프로젝트, 시작해봅시다!

클래스 실습 환경

• 기본적으로 Windows 10을 기준으로 진행되지만, 운영체제에 의존적인 챕터는 없기 때문에 MacOS 등 다른 운영체제를 사용하셔도 됩니다.
• IDE에 의존적인 챕터 또한 없기 때문에 vscode, WebStorm, IntelliJ 등 본인이 익숙한 프로그램을 사용하시면 됩니다.