솔미는 성장중

버그를 줄이기 위해서 필요한 정적코드 분석! - 정적 코드 분석이란? : 실행과 별개로 코드 자체만으로 문제의 소지가 있는 코드를 사전에 수정하는 것을 의미 - 정적 코드 분석 도구: ESLint 그러면 ESLint 코드는 어떻게 코드를 분석하는 걸까?! ESLint의 코드 분석 방법 1. JS코드를 문자열로 읽는다. 2. JS코드를 분석할 수 있는 파서로 코드를 구조화한다. 여기서 구조화 한 트리는 AST(Abstract Syntax Tree)라고 한다. 3. 구조화한 트리를 기준으로 각종 규칙과 대조한다. 4. 규칙을 위반한 코드를 알리거나 수정한다. (report & fix) # 파서(parsesr)로 코드를 구조화 ESLint는 기본값으로 espree 파서를 사용한다. 코드가 변수인지, 함수인지,..

Recoil - RecoilRoot를 선언해 하나의 스토어를 만들고, atom이라는 상태단위를 스토어에 등록한다. - RecoilRoot: Recoil에서 생성되는 상태값을 저장하기 위한 스토어를 생성 + 변경된 상태를 하위 컴포넌트로 전파해 컴포넌트에 리렌더링을 일으킴 - atom: 상태를 나타내는 recoil의 최소 상태 단위. 각 값은 고유한 key 값을 바탕으로 구별된다. 컴포넌트는 recoil에서 제공하는 훅(useRecoilValue, useRecoilState..)을 통해 상태 변화를 구독하고, 값이 변경되면 forceUpdate 같은 기법을 통해 리렌더링을 실행해 최신 atom을 가져오게 된다. Jotai - recoil의 atom 모델에 영감 받아 만들어진 상태관리 라이브러리 - 상향식..

Next.js란 ? react-page에서 영감을 받아 만들어진 프레임워크. (서버사이드 렌더링) nextJS는 기본적으로 pre-rendering을 한다! Pre-rendering : HTML을 미리 렌더링 ▶︎ hydration (js를 불러오며 인터랙션 가능해짐) 브라우저처럼 동작하지 않는(JS를 실행하지 않는) 검색엔진에서도 데이터를 조회할 수 있기에 SEO 향상된다! (SSG(빌드타임에 pre-render), SSR(요청타임에 pre-render) 데이터 패칭 방식을 이용해야 함) No Pre-rendering: JS가 load되어야지만 화면이 보임 (대부분의 SPA) Next 시작하기 npx create-next-app@latest --ts Next 기본 파일 (예약어로 관리되는 페이지) 뜯어..

보호되어 있는 글입니다.

보호되어 있는 글입니다.