👉  Page Router현재 많은 기업에서 사용되고 있는 안정적인 라우터React Router 처럼 페이지 라우팅 기능을 제공  👉  프리페칭(Pre-fetching) - 빠른 페이지 이동을 위해 제공되는 기능!이동할 가능성이 있는 페이지를 미리 불러오는 기능경로별로 컴포넌트들을 Spliting 해서 저장을 미리 해놓음 현재 페이지에만 필요한 JS Bundle만 전달 됨요청된 페이지의 JS Bundle 만 불러오기 때문에 Hydration 빠르게 가능 (용량 경량화)Pre Feching 으로 연결된 모든 페이지의 JS Bundle 파일을 미리 불러옴개발모드일 경우에는 Pre Feching이 적용되지 않음 Build 후 production 모드로 실행해줘야함Link Component로 이뤄지지 않은 ..

👉  Dynamic Routing여러개의 URL 파라미터를 넣을 때 [...id] Catch all segment파라미터가 없을 경우에 [[...id]] Optional catch all segment👉  Layout 동작 방식 Layout 안에 chlidren 으로 page 가 들어있음  Layout 이 위 아래로 있을 경우 중첩됨👉  Route Group (소괄호로 작성) 경로상에는 아무런 영향을 미치지 않음각기 다른 경로들을 하나의 페이지로 묶어둘 수 있음경로가 달라도 공통적인 layout을 적용하고 싶을 때👉  React Server Component (React 18v 부터, 새로운 유형의 서버측 컴포넌트 )Page Router 버전의 Next.js 에는 어떤 문제가 있었을까?정적 페이지..

👉  사전 렌더링 (Next.js 의 기본 동작 방식)브라우저 요청에 사전에 렌더링이 완료된 HTML을 응답하는 렌더링 방식CIient Side Rendering의 단점을 효율적으로 해결하는 기술👉  CIient Side Rendering(CSR)React.js 앱의 기본적인 렌더링 방식클라이언트(브라우저)에서 직접 화면을 렌더링하는 방식장점: 초기접속 이후의 페이지 이동이 매우 빠르고 쾌적단점: FCP(초기접속 속도)가 느려짐👉  Next.js에서는 CIient Side Rendering의 문제를 어떻게 해결할까? - 사전 렌더링서버에서 직접 JS를 실행 -> 렌더링이 완료된 HTML을 응답JS 실행 (렌더링)JS코드를 HTML코드로 변환하는 과정화면 렌더링HTML코드를 브라우저가 화면에 그려내는..

기능 구현의 주도권이 누구에게 있는가?👉  Library - 개발자기능 구현의 주도권을 개발자가 가짐ex) 페이지 라우팅 기능을 구현해야 함 -> React router, tanstack Router우리가 사용하고 싶은 도구를 마음대로 사용할 수 있음자유도가 높다. -> 기본 기능 외 제공 X👉  Framework  - 개발자 X 주도권을 Framework 가 가짐Framework에서 제공하는 기능을 사용하거나 허용하는 범위 내에서만 추가기능 사용 가능큰틀, 방법은 정해져 있음자유도가 낮다.거의 모든 기능을 제공Page RoutingSever Pre RenderingReact.js 의 확장판     출처: https://www.inflearn.com/course/%ED%95%9C%EC%9E%85-%E..

👉  JavaScript 정렬 라이브러리JavaScript에서는 배열에 포함된 데이터를 정렬하는 sort() 함수를 제공최악의 경우 시간 복잡도 O(NlogN)을 보장알고리즘 및 코딩 테스트 문제를 해결할 때 정렬 기능이 필요하다면, sort() 함수 사용 권장만약 sort()함수의 사용이 제한된다면, 병합 정렬과 같은 알고리즘을 직접 구현하여 사용👉  sort() 오름차순 예시 (내림차순은  b가 더 작게 표현)arr.sort(compareFunction)//정렬 기준 함수//오름차순function compareFunction(a, b){ if(a b) return 1; else return 0 // result 0 b가 우선순위가 높아, 앞에 위치한다. // 0 a와 b의 순서를 ..

👉  분할 정복(Divide and Conquer)분할(divide): 큰 문제를 작은 부분 문제(쉬운 문제)로 분할정복(conquer): 작은 부분 문제를 각각 해결조합(combine): 해결한 부분 문제의 답을 이용하여 다시 큰 문제를 해결일반적으로 재귀 함수를 이용하여 구현이유? 큰 문제를 작은 문제로 "분할하는 방식이 동일한" 경우가 많기 때문더 이상 쪼갤 수 없는 크기가 될 때까지 계속하여 분할분할 정복의 단점일반적으로 재귀 함수를 사용한다는 점에서 함수 호출 횟수가 많이 발생이는 오버헤드(overhead)로 이어진다. 👉  병합 정렬(Merge Sort)병합 정렬은 전형적인 분할 정복(divide and conquer) 알고리즘이다.시간 복잡도 O(NlogN)을 보장하는 빠른 알고리즘 중 ..

👉  삽입 정렬(Insertion Sort)삽입 정렬이란 각 숫자를 적절한 위치에 삽입하는 정렬 기법각 단계에서 현재 원소가 삽입될 위치를 찾는다.적절한 위치에 도달할 때까지 반복적으로 왼쪽으로 이동한다.매 단계에서 현재 처리 중인 원소가 삽입될 위치를 찾기 위해 약 N번의 연산이 필요결과적으로 약 N개의 단계를 거친다는 점에서 최악의 경우 O(N²)의 시간 복잡도를 가진다.  출처: https://fastcampus.co.kr/dev_online_upjscodingtest JavaScript 코딩테스트 131개 예제 & CS지식으로 끝내기 | 패스트캠퍼스25시간 대비 과정 / '코테 레전드' 유튜버 강사님께 핵심만 배우고 빠르게 합격하세요.fastcampus.co.kr

👉  버블 정렬선택정렬보다 비효율성이 높음단순히 인접한 두 원소를 확인하여, 정렬이 안 되어 있다면 위치를 서로 변경한다서로 인접한 두 원소를 비교하는 형태가 거품과 같다고 하여 붙여진 이름시간 복잡도 O(N²)로 비효율적인 정렬 알고리즘 중 하나첫째와 둘째를 비교, 둘째와 셋째를 비교, 셋째와 넷째를 비교하는 방식~5단계까지 계속 반복한다.이미 정렬된 배열에 대해서 모든 비교가 필요하므로, 굉장히 비효율적인 정렬 알고리즘 중 하나 출처: https://fastcampus.co.kr/dev_online_upjscodingtest JavaScript 코딩테스트 131개 예제 & CS지식으로 끝내기 | 패스트캠퍼스25시간 대비 과정 / '코테 레전드' 유튜버 강사님께 핵심만 배우고 빠르게 합격하세요.fas..