[웹] 혹시 당신… 웹 개발이 처음인가요?

지난 학기에 동아리에서 진행했던 스터디 자료로 사용한 문서입니다.

참고자료: https://lipcoder.tistory.com/514

[서버 가이드북] 1. 서버(Server) 란?

VSCode 설치와 세팅

ESLint, Prettier 알아서 설치후 세팅하세용

참고자료: https://seogeurim.tistory.com/15?category=981579

내 프로젝트에 ESLint & Prettier 도입하기 (VSCode)

왜 Prettier를 쓰나요?

사람마다 코드 스타일이 다를 수 있습니다.

if (foo) 
{ 
    bar(); 
}

if (foo) {
    bar();
}

이러면 특히 협업할 때에 깔끔하게 보이지 않기 때문에 코드 스타일을 통일시켜줍니다.

NodeJS 설치

Node.js는 Chrome V8 JavaScript 엔진으로 빌드 된 JavaScript 런타임입니다.

nvm으로 설치하면 노드 버전을 프로젝트마다 관리할 수 있어 편리합니다.

JavaScript 기본 문법

어렵지 않습니다.

다만 좀 이상합니다.

TypeScript는 왜 쓸까요?

TypeScript(이하 TS)는 JavaScript(이하 JS)의 확장 언어라고 볼 수 있습니다. TS로 작성된 코드를 컴파일하면 JS로 변환이 됩니다. 그럼 왜 쓸까요?

JS는 동적 언어입니다.

let a = 11, b = "a";
const mul = (a, b) => {
    return a * b;
}
mul(a, b);

위와 같은 코드를 생각해보면, JS는 위 코드를 문제없이 컴파일할 것입니다. TS는 정적 언어이기 때문에,

let a = 11, b = "a";
const mul = (a: number, b: number) => {
    return a * b;
}
mul(a, b); // error! 

위와 같이 타입을 명시해줄 수 있어 컴파일단에서 오류를 잡아줍니다. 개발 할 때에 오류를 포착하기 쉽고, 타입을 명시적으로 작성해주기 때문에 코드를 읽을 때 가독성이 좋아집니다.

Git

Git이란?

버전 관리 시스템입니다. 자세한 내용은 혼자 찾아보시길..!~

Git 설치

먼저 git을 내 컴퓨터에 설치합니다.

• 윈도우의 경우 여기에서 64-bit Git for Windows Setup 를 클릭합니다.
• Mac OS의 경우 이미 설치되어있을 확률이 높은데 없으면 여기에서 다운받아 설치합니다.
• 설치 과정 중 다른 것들은 기본 설정으로 유지한 채 Next를 누릅니다.

알아둬야 할 것들

• API란? https://blog.wishket.com/api란-쉽게-설명-그린클라이언트/
• Rest API란? https://meetup.toast.com/posts/92