Interview Debounce / Throttle 일정 시간동안 동일한 이벤트가 발생했을 때, 이벤트 횟수를 한 번으로 제한하는 것을 말한다. 불필요한 이벤트 핸들러가 동일하게 호출되는 것을 방지하여 앱 성능을 개선할 수 있다. resize, keyboard 등의 단 시간에 반복적으로 발생하는 이벤트에 사용할 수 있다. Debo...
Dev
취소Interview 24장 - debounce / throttle
React Native 2장 - 기초
React Native React Native API 문서를 보며 작성해보는 네이티브 기초 기본 개념 안드로이드에서는 Kotlin 또는 Java로 작성되고, IOS에서는 Swift 또는 Objective-C를 사용하여 개발된다. 하지만 리액트 네이티브를 사용하면 자바스크립트를 통해 리액트 컴포넌트 호출이 가능하다. 리액트 ...
React Native 1장 - 기초 및 세팅
React Native 앱을 개발하기 위해 사용되는 기술은 크게 Flutter, React Native가 있다. Flutter은 Dart 언어를 기반으로 하고, React Native는 React를 사용하는 것처럼 Javascript로 작성된 코드를 컴파일 하여 애플리케이션을 생성한다는 차이점이 있다. 리액트 네이티브 안에는 React ...
React 74장 - chart.js
React Chart.js 공식문서 관련 자료가 많고 커스텀이 쉽다고 하여 차트를 그리는 여러가지 라이브러리 중 선택 공식문서에서 볼 수 있는 여러 가지 컴포넌트 중 본인이 사용할 컴포넌트를 가져온다. data라는 객체 안에 본인이 사용할 데이터에 대한 라벨이나 값을 설정한다. registor()는 사용할 여러 기능들을...
React 73장 - React-Query hooks 초깃값 설정하기
React React-Query query hook의 최초 실행 리액트 쿼리를 사용하다 적어보는 포스터 리액트 쿼리를 hook으로 만들어 사용하는 것은, 반복되는 로직을 줄일 수 있고 코드를 관리하기 편하다는 장점이 있다. 이전 프로젝트의 경우, 선택된 stack이라는 데이터 값을 쿼리 훅에 넘겨주고, 전달받은 데이터를 API요청에 ...
Interview 23장 - 자바스크립트
Interview Javascript 브라우저 자체에 내장돼있는 JS엔진으로 동작되며 코드를 한 줄 한 줄 읽고 실행하는 런타임 과정을 거친다. 싱글스레드이다. 스코프 변수를 참조할 수 있고 접근할 수 있는 영역을 말한다. 선언된 위치에 따라 유효 범위가 결정되며 블록 내에서만 유효하여 블록 밖에서는 참조할 수 없다. 지...
Interview 22장 - 리액트
Interview React 페이스북에서 만든 자바스크립트 라이브러리로, 재사용성이 높은 컴포넌트 라는 단위를 기반으로한 개발이 가능하다. 데이터는 부모요소에서 자식요소로 단방향으로 흐른다는 특징을 갖고 있다. JSX 리액트에서 사용하는 문법으로 자바스크립트에 XML(데이터를 기술하는)이 합쳐진 문법으로, HTML 태그에 중괄호...
Next 24장 - dynamic routes
Next dynamic routes 커뮤니티 페이지를 만들던 중 페이지네이션 구현을 위해 page params가 필요해졌다. 14버전에서는 getServerSideProps... 와 같은 함수를 사용하지 않기에 params를 가져올 여러 방법을 고민했다. 시간 낭비 (1) SSR을 유지하며 페이지 네이션을 구현하고 싶었기에 (게...
Next 23장 - css 중첩 에러
Next style error 기존의 next13 을 사용했던 사이드 프로젝트를 14로 올리는 과정에서 발생한 에러 next 13에서 사용헀던 mui, styled-components를 tailwind로 마이그레이션 하는 과정에서 아래와 같은 에러가 발생했다. http://localhost:3000/_next/static/css/app...
Next 22장 - SEO
Next SEO 검색 엔진 최적화인 SEO, Next에서는 SSR로 동작하기 때문에 빈 태그가 아닌 실제 요소들이 들어가 있고, 그렇기에 SEO에 대한 강점을 가진다. 이 외에도 여러 가지의 평가 항목 중 meta data를 활용하여 검색 엔진에 우위를 가질 수 있다. Next 14 버전에서는 <Head> 태그를 사용하는 것...