고정 헤더 영역
상세 컨텐츠
본문
타입 단언 as
단언 강력하게 주장하다
내가맞다고 우기기
정확히 추론을 할 수 없을 떄 개발자가 명시적으로 타입을 지정
기존 타입을 바꿀때 사용
단언컨대 내가 맞아
주의점 무분별한 사용 x ,
컴퓨터는 실수 하지 않지만 개발자는 실수 한다
as 사용시 개발자 니말이 맞아 ! 해줄수있음
주의
as를 잘못 선언시 Runtime error 가 발생할수있다 .
타입단언은 정말로 확실한 타입을 확신할떄만 선언한다
유틸리티 타입
기본타입들을 변형하거나 확장할수있는 내장 타이틀
미리만들어진 툴 같은것 . 새로운걸 만들때 빠르게 만들 수있게 도와줌
1.Partial<T>
부분적 , 선택적인 type
객체일부 속성만 업데이트하거나 초기화 할떄 유용
모든값을 선택적으로 만들기 . 값을 안넣어도 되게 만드는 것 .
type Person = { name: string; age: number };
type MaybePerson = Partial<Person>;
이렇게 하면 이름이나 나이를 넣을 수도있고 안넣어도됨
2.Pick <T,K>
특정 속성만 선택 가능
객체의 일부 속성만 필요할떄 유용
type PersonName = Pick<Person, 'name'>;
3.Omit<T,K>
빠트리다 ,생략 , 특정속성 제외
type 에서 뺴준다 .
filter 는 js 배열에서 method filter 랑 다르다 .
필요없는 부분을 빼줌
type Person = { name: string; age: number };
type NoAge = Omit<Person, 'age'>;
4.Record<K,T>
객체의 키와 값의 타입으로 동적으로 설정 할떄 유용
새로운 박스를 만든다 생각 하고 박스안에 키 와 값이 들어가있다
type WordDictionary = Record<string, string>;
Next.js
웹싸이트를 더 쉽게 만들 수있도록 도와줌
서버사이드 렌더링 SSR (SERVER SIDE RENDERING)
웹페이지를 보여주는 방법
서버가 먼저 , 그리고 우리에게 보내주는것 빠르게 화면을 보여줄수있다
ssr->서버에서 컴포넌트 html 미리생성후 클라이언트에게 전달
서버에서 조립 클라이언트에게 보여줌
클라이언트 사이드 렌더링 CSR (CILENT SIDE RENDERING)
클라이언트가 직접 웹페이지를 만드는 방식
서버는 기본 뼈대만 보내줌
클라이언트가 만들어서 화면을 그려줌 클라이언트가 모든것을 처리
예시
이케아 -클라이언트사이드렌더링 시키면 부품이와서 손님이 직접 조립해야됨
동서가구 -서버사이드렌더링 - 주문한가구 완전체로 배송옴
ssr 의 장점
seo 개선 , 검색 최적화 에 유리
빠른 초기 렌더링
단점 . 과부화 ,복잡한 구현성 증가
서버 부담이 큼 서버에서 모든일 을 처리해야하기 때문
페이지 간 이동이 느림 . 페이지를 바꿀때마다 서버에서 다시 처리햐야됨 . 시간 걸림
csr 장점
빠른 상호작용 . 한번 로드 된 후 페이지간 이동이빠름
클라이언트에서 처리 , 서버에서는 부담이 적고 복잡한 Ui 쉽게 구현 가능
단점
초기 로디이 느림 . 처음 페이지를 열떄 시간이 오래걸림
서버컴포넌트
서버에서 처리되는 부분
클라이언트가 일을 하기 전에 서버가 먼저 웹페이지 내용을 만들어서 보내줌
서버에서 미리 준비 해줘서 빠르게 웹싸이트를 볼수있음
클라이언트가적은일을 하게 됨 가벼움
요리사가 음식 다 만들어서 가져다줌 .
기다리지 않고 그냥 먹기만 하면됨 .
클라이언트 컴포넌트
클라이언트에서 처리되는 부분
서버는 기본적인 정보만전달, 클라이언트가 직접 페이지를 만들고 처리
음식 요리 하는 것과 비슷 하다고 생각 하면됨 .
서버는 재료만 주고 , 클라이언트가 직접 요리
시간 소요
