분류 전체보기146 SWR 활용하기 with React, TypeScript ** 본 게시글은 ZeroCho의 Sleact 강의를 학습하며 정리한 내용을 포함하고 있습니다.SWR 데이터 가져오기를 위한 React Hooks – SWRSWR is a React Hooks library for data fetching. SWR first returns the data from cache (stale), then sends the fetch request (revalidate), and finally comes with the up-to-date data again.swr.vercel.appStale-While-Revalidate의 약자로, React 컴포넌트에서 사용할 수 있는 훅 형태의 SWR 라이브러리다.간편하게 데이터를 가져오고, 캐시하고, 최신 데이터를 가져온다.설치$ npm.. 2024. 11. 29. [Lv.2] 전력망을 둘로 나누기 - JavaScript 프로그래머스코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요.programmers.co.kr 문제n개의 송전탑이 전선을 통해 하나의 트리 형태로 연결되어 있습니다. 당신은 이 전선들 중 하나를 끊어서 현재의 전력망 네트워크를 2개로 분할하려고 합니다. 이때, 두 전력망이 갖게 되는 송전탑의 개수를 최대한 비슷하게 맞추고자 합니다.송전탑의 개수 n, 그리고 전선 정보 wires가 매개변수로 주어집니다. 전선들 중 하나를 끊어서 송전탑 개수가 가능한 비슷하도록 두 전력망으로 나누었을 때, 두 전력망이 가지고 있는 송전탑 개수의 차이(절대값)를 return 하도록 solution 함수를 완성해주세요. 풀이fu.. 2024. 9. 7. [Git] 브랜치명 변경하고 원격 저장소에 반영하기 보호되어 있는 글 입니다. 2024. 4. 18. [Lv.2] 석유 시추 - JavaScript 문제 https://school.programmers.co.kr/learn/courses/30/lessons/250136 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 풀이 각 영역에 대해 너비 우선 탐색을 하며 석유가 있는 영역에 oilId를 부여한다. oilId를 key로, 영역의 크기를 value로 하는 자료를 저장한다. 이차원 배열에 oilId를 값으로 갖는 석유 지도(?)를 만든다. 세로로 한 줄씩 순회하며 마주치는 석유 영역의 크기를 합산한다. 단, 이전에 합산했던 석유 영역은 건너뛰어야 한다. 코드 function solution(land) .. 2024. 1. 4. [React] i18n으로 다국어 지원하기 (i18next, react-i18next) 프로젝트에서 다국어 지원 기능을 적용하게 되었다. 나는 다른 분이 만들어 놓은 것을 적용만 했지만 해당 라이브러리를 어떻게 사용하는지 궁금해서 알아보기로 했다. 처음에는 브라우저에서 지원하는 한영변환인줄 알았는데, 그냥 서비스 안에서 따로 구현된 것이었음,, 그래서 제공될 다국어도 json으로 직접 작성해야 한다! 프로젝트에서는 라이브러리 i18n 을 사용했다. Introduction - react-i18next documentation Hello {{name}} , you have {{count}} unread message(s). Go to messages. react.i18next.com i18next 라는 라이브러리와 이를 react에서 아주 쉽게 사용하도록 만들어진 react-i18next를 설.. 2023. 10. 22. React를 위한 상태관리 라이브러리 - Recoil https://recoiljs.org/ko/docs/introduction/installation 설치 | Recoil NPM recoiljs.org Recoil? 2020년에 Facebook에서 발표한, React 전용 상태관리 라이브러리이다. Recoil을 통한 상태관리는 아주 간결하다는 장점이 있다. Redux의 경우 Flux 패턴을 사용하여 안정적으로 상태관리가 가능하지만, React 전용 라이브러리가 아니다. 초기 세팅이 요구된다. 비동기 데이터를 사용하려면 추가적인 라이브러리 설치가 필요하다. 많은 양의 **보일러플레이트 코드를 작성해야 한다. 는 단점을 가지고 있기도 하다. Recoil은 이러한 단점을 보완한다. ** Boilerplate Code : 변화 없이 여러 군데에서 반복되는 코드 .. 2023. 9. 12. [모던 자바스크립트] 38장 브라우저의 렌더링 과정 ** 본 글은 모던 자바스크립트 Deep Dive 도서 내용을 정리한 것임을 밝힙니다. 웹 애플리케이션의 클라이언트 사이드 자바스크립트는 브라우저에서 HTML, CSS와 함께 실행된다. 브라우저가 HTML, CSS, 자바스크립트로 작성된 텍스트 문서를 어떻게 파싱(해석)하여 브라우저에 렌더링(출력)하는지 살펴보자. 브라우저는 다음과 같은 과정을 거쳐 렌더링을 수행한다. HTML, CSS, 자바스크립트, 이미지, 폰트 파일 등 렌더링에 필요한 리소스를 요청하고 서버로부터 응답을 받는다. 브라우저의 렌더링 엔진은 응답된 HTML, CSS를 파싱하여 DOM, CSSOM을 생성하고 이들을 결합하여 렌더 트리를 생성한다. 브라우저의 자바스크립트 엔진은 응답된 자바스크립트를 파싱하여 AST를 생성하고 바이트코드로 .. 2023. 8. 6. [모던 자바스크립트] 26장 ES6 함수의 추가 기능 ** 본 글은 모던 자바스크립트 Deep Dive 도서 내용을 정리한 것임을 밝힙니다. 26.1 함수의 구분 ES6 이전까지 자바스크립트의 함수는 별다른 구분 없이 다양한 목적으로 사용되었다. ES6 이전의 함수는 다음과 같이 활용될 수 있었다. 자바스크립트의 함수는 일반적인 함수로서 호출할 수 있다. new 연산자와 함께 호출하여 인스턴스를 생성할 수 있는 생성자 함수로서 호출할 수 있다. 객체에 바인딩되어 메서드로서 호출할 수도 있다. ES6 이전의 함수는 동일한 함수라도 다양한 형태로 호출할 수 있다. var foo = function () { return 1; }; // 일반적인 함수로서 호출 foo(); // -> 1 // 생성자 함수로서 호출 new foo(); // -> foo {} // 메.. 2023. 7. 25. [모던 자바스크립트] 16장 프로퍼티 어트리뷰트 ** 본 글은 모던 자바스크립트 Deep Dive 도서 내용을 정리한 것임을 밝힙니다. 16.1 내부 슬롯과 내부 메서드 앞으로 프로퍼티 어트리뷰트를 이해하기 위해서는 내부 슬롯과 내부 메서드의 개념에 대해 알아야 한다. 내부 슬롯과 내부 메서드는 자바스크립트 엔진의 구현 알고리즘을 설명하기 위해 ECMAScript 사양에서 사용하는 의사 프로퍼티와 의사 메서드다. ECMAScript 사양에 등장하는 이중 대괄호( [[…]] )로 감싼 이름들이 내부 슬롯과 내부 메서드다. 조금 쉽게 이해해보자면 ECMAScript 문서에서 자바스크립트 내부의 동작을 설명하기 위한 가상 메서드이다. 내부 슬롯과 내부 메서드는 ECMAScript 사양에 정의된 대로 구현되어 자바스크립트 엔진에서 실제로 동작하지만 개발자가 .. 2023. 7. 24. [모던 자바스크립트] 15장 let, const 키워드와 블록 레벨 스코프 ** 본 글은 모던 자바스크립트 Deep Dive 도서 내용을 정리한 것임을 밝힙니다. ES5 까지 변수를 선언할 수 있는 유일한 방법은 var 키워드를 사용하는 것이었다. var 키워드로 선언된 변수는 다음과 같은 특징이 있다. 15.1 var 키워드로 선언한 변수의 문제점 var 키워드로 선언된 변수는 다음과 같은 특징이 있다. 15.1.1 변수 중복 선언 허용 var 키워드로 선언한 변수는 중복 선언이 가능하다. var x = 1; var y = 1; // var 키워드로 선언된 변수는 같은 스코프 내에서 중복 선언을 허용한다. // 초기화 문이 있는 변수 선언은 var 키워드가 없는 것 처럼 동작한다. var x = 100; // 초기화 문이 없는 변수 선언문은 무시한다. var y; consol.. 2023. 7. 24. 이전 1 2 3 4 ··· 15 다음
