sohyeon kim

💡 Next.js 공식문서 정리 - 데이터 가져오기 Data Fetching1. 데이터 가져오기 Data Fetching데이터 가져오기는 모든 애플리케이션의 핵심 부분이다. 선호하는 방법을 사용해 데이터를 가져오는 모범 사례를 살펴보자. 데이터를 서버에서 가져올까, 클라이언트에서 가져올까?이는 구축 중인 UI 의 유형에 따라 다르다. 실시간 데이터(e.g. 폴링)가 필요하지 않은 경우, 서버 컴포넌트를 사용해 서버에서 데이터를 가져올 수 있다. 이렇게 하면 몇 가지 이점이 있다.단일 서버 라운드 트립으로 데이터를 가져올 수 있어 네트워크 요청 수와 클라이언트-서버 워터폴을 줄일 수 있다.클아이언트에 노출되면 안되는 민감한 정보(e.g. 액세스 토큰 및 API 키)를 보할 수 있다.애플리케이션 코드와 D..

💡 렉시컬 환경 : 어떤 함수가 선언(생성)될 때 그 당시의 외부 변수가 저장되는 곳! 그 정보들 : 외부 변수 등등 const x = 1; // 전역 스코프 function outerFunc() { const x = 10; // outerFunc 스코프 function innerFunc() { console.log("x : " + x); // x : 10 // (innerFunc 스코프에 x 가 없으니 이 함수가 선언될 때의 LE 인 outerFunc 로 찾으러 감) } innerFunc(); } outerFunc(); console.log("x : " + x); // x : 1 ➕ 함수를 어디서 '호출' 했는지가 아니라, 어디에 '정의' 했는지에 따라 스코프(상위 스코프) 가 결정된다! outer 내..

자바스크립트는 어휘적 환경을 갖는다. 어휘적 환경 Lexical Environment let one; // undefined one = 1; // 1 function addOne(num) { console.log(one + num); } addOne(5); // 6 // 전역 Lexical 환경 // one : 1 // addOne : function // ^ 전역 Lexical 환경을 참조함 !!! 참조 순서 : 내부 > 외부 > 전역 // 내부 Lexical 환경 // num : 5 function makeAdder(x) { return function (y) { // y를 가지고 있고, 상위함수인 makeAdder의 x에 접근 가능 return x + y; }; } const add3 = makeA..