프로젝트 캠프 : Next.js 2기 - 1주 회고

Liked

운이 좋게 프로젝트 Next.js2기에 참여하게 되었다. 3주 동안 JavaScript, TypeScript, React, Next.js을 공부하고 기업 프로젝트를 진행하게 된다. 

JavaScript와 React는 학습과 프로젝트 경험이 있어 복습을 하고 다시 개념을 다지기 좋은 기회라 생각이 든다. 또 Next.js은 단순 프로젝트 경험만 있어 아쉬웠는데 개념적인 부분부터 탄탄한 학습을 할 수 있을 거 같아 기대가 된다. 

 

첫 주는 JavaScript 를 위주로 진행되었다. 강사님께서 정말 잘 설명해 주셔서 머릿속에서 떠돌고 있던 개념이 유기적으로 잘 정리된 느낌이어서 좋았다👍

모던 자바스크립트 스터디를 하면서 어려웠던 개념도 확실히 기초부터 하니 이해하게 된 거 같다. 

1주일 동안 배운 내용과 모던 자바스크립트 책을 한번 더 보면서 개념을 다시 정립하는 주간이었다. 

 

Learned

첫 주는 javaScript와 TypeScript를 배웠다.

자바스크립트의 동작원리의 기본인 콜스택과 실행 컨텍스트부터 클래스 등 주요 개념을 순차적으로 다시 익힐 수 있어  좋았다.

이전부터 개인적으로 헷갈렸던 개념들은 추가로 공부해서 헷갈리는 키워드와 함께 비교하며 정리했다.  

특히 타입스크립트를 공부하면서 프로젝트할 때 interface와 type 중 어떤 게 적절한지 고민을 하곤 했었는데 수업을 들으며 정리가 되었다. 

 

interface

1. 객체 타입을 정의한다. 

interface IUser {
    name: string;
    age: number;
}

2. extends키워드를 통해 확장(상속)할 수 있다.

interface Ijob extends IUser {
	title: string;
}

const user: Ijob = {
    title: "developer",
    name: "an",
	age: 20,
};

3. 같은 이름으로 선언된 interface는 병합된다. 

interface IUser {
    name: string;
    readonly age: number;
    height?: number;
  }

  interface IUser {
    gender: string;
  }
  
  const user1: IUser = {//같은 이름의 인터페이스는 병합이 된다.
    name: "kim",
    age: 20,
    gender: "male",
    height: 100,
  };

 

typeScript

1. 객체를 포함한 모든 타입 정의가 가능하다. 

type TName = string; // primitive
type TAge = number;
type TPerson = [string, number, boolean]; // tuple
type TNumberString = string | number; // union

 

2. & 기호를 사용해 확장(상속)할 수 있다.

const user: TUser = {
    name: "kim",
    age:20
  };

type TJob = {
    title: "d";
};

type TUserAndJob = TUser & TJob;

 

3. 선언적 확장은 불가능하다. 

type TUser = {name: string; age: number; gender: "male" | "female"; };//Error:Duplicate identifier 'TUser'.
type TUser = {job: string }; //Error:Duplicate identifier 'TUser'.

 

 

보통 위와 같은 특성으로 인해 객체 타입 정의 시에는 interface를 그 외의 타입 정의 시에는 type을 사용하게 된다. 프로젝트를 할 때 팀원분들과 미리 컨벤션을 약속하지 않고 개발을 하다 보면 이 둘을 구분하는 기준이 모호해질 때가 있다. 그래서 구체적으로 어떻게 둘을 구분해 사용하는 것이 좋을까 고민을 했었는데 강의를 들으며 고민을 해결할 수 있었다. 

 

 

강사님께서는 type으로만으로도 개발을 하신다고 하셨다.

type은 상속도 가능하고, 가독성 특히 위와 같이 개발 환경 툴팁에서의 강점이 있었다. 

type은 interface와 달리 타입이 명시적으로 보여 의미파악이 쉽고 개발에 용의 하다는 이점이 있다.

사실상 모든 타입을 type만으로 정의해도 괜찮다는 것이다.

 

결국에 중요한 건 팀 협업할 때 서로 협의한 타입 정의 규칙에 맞춰 일관성 있는 코드를 유지하는 것이 중요한 거 같다. 또한 코드를 작성할 때 타당한 근거나 이유를 알고 개발하는 것이 도움이 많이 된다는 것을 느꼈다. 

 

Lacked

온라인에 익숙하다가 오프라인 출퇴근을 하려니 조금 피곤했다😅

이 때문에 이번주 사이드 프로젝트 작업을 많이 못한 거 같아 컨디션 관리에 신경 쓰려한다. 

그날 무리하는 것보다 적절한 수면이 다음날 학습과 작업 효율을 훨씬 높인다는 것을 깨달았고 낮에 최대한 집중하는 게 중요하다는 생각이 든다.  

 

Longed for

다시 정리한 자바스크립트와 타입스크립트를 바탕으로 노션 클로닝 프로젝트를 타입스크립트로 다시 개발해볼까 한다. 이번에는 파일 구조도 전체적으로 변경하고 효율적인 방향을 많이 고민해서 개발해보고 싶다.

 

 

 

 

본 후기는 본 후기는 [유데미x스나이퍼팩토리] 프로젝트 캠프 : Next.js 2기 과정(B-log) 리뷰로 작성되었습니다.