Sign in

dev

it dev nextjs useeffect

[React] useEffect란?

오늘은 useEffect()에 대해 알아보겠습니다. [ useEffect ] useEffect() 함수는 React component가 렌더링 될 때마다 특정 작업(Sied effect)을 실행할 수 있도록 하는 리액트 Hook입니다.여기서 Side effect는 component가 렌더링 된 이후에 비동기로 처리되어야 하는 부수적인 효과들을 뜻합니다. 이러한 기능으로 인해 함수형 컴포넌트에서도 클래스형 컴포넌트에서 사용했던 생명주기 메서드를 사용할 수 있게 되었습니다. useEffect는 component가 mount 됐을 때, component가 unmount 됐을 때, component가 update 됐을 때, 특정 작업을 처리할 수 있습니다. 즉, 클래스형 컴포넌트에서 사용할 수 있었던 생명주기 ..
wono | discuss |
it dev vscode typescript

tsconfig.json을 설정해보자

Typescript는 동적 타입 언어인 Javascript를 타입이 있는 언어로 사용할 수 있게 해주는 언어이다. Typescript로 작성된 코드는 트랜스파일러(컴파일러)를 통해 Javascript로 변환된다. 아래 명령어로 컴파일을 한다. tsc index.ts 컴파일 과정에서 여러 옵션을 정할 수 있는데, 해당 옵션들을 작성하는 파일이 tsconfig.json 이다. Typescript에 가장 기본이 되는 tsconfig.json 파일을 설정해보자. 디렉토리에 tsconfig.json 파일이 있다면 해당 디렉토리가 Typescript 프로젝트의 루트가 된다. tsconfig.json 파일은 프로젝트를 컴파일하는 데 필요한 루트 파일과 컴파일러 옵션을 지정한다. 설치하기 npx tsc --init t..
wono | comment (1) |
it dev nestjs prisma

[nest.js] prisma schema 분리

old - prisma schema 분리서론글을 작성 하던 도중, prisma 에서 드디어 스키마 분리를 지원해 준다는 이슈가 작성 되었다. Support for splitting Prisma schema into multiple files · Issue #2377 · prisma/prismaProblem Prisma currently only supports one single Prisma Schema file. Developers want more flexibility for managing their Prisma Schema files. Motivations: breaking up large schema files to make th...github.com Hey, we just released s..
wono | discuss |
it dev nextjs redux

[Next.js 14] Redux, Redux-toolkit 환경세팅, 사용법

안녕하세요.Next.js와 TypeScript를 사용하며 Redux-toolkit 및 Redux를 세팅하는방법이 조금 까다로운 부분이 있어 포스팅하게되었습니다.Next.js의 버전은 14버전을 기준으로 하니, 참고해주세요. Redux우선 Redux를 알아보기전에 '상태'를 먼저 간단히 알아보겠습니다.React에서 State는 Component 안에서 관리되는 것입니다.자식 컴포넌트들 간 데이터를 주곱다을 때는 상태를 관리하는 부모컴포넌트를 통해 주고받습니다.하지만 이러한 상태를 관리하는 상위 컴포넌트에서 Props의 형식으로 계속 내려받아야 하는 특성상, 자식컴포넌트가 많아진다면 상태관리가 매우 복잡해지기 마련입니다.또한, 자식컴포넌트측에서 props로 받아온 state를 변경한다고 해도, 부모컴포넌트에..
wono | discuss |