◆ 파일 기반 라우팅각 페이지는 `page.js`라는 파일에 정의되고, 이 파일은 NextJS에게 페이지를 렌더링해야 한다는 것을 알려줍니다.이것은 NextJS의 강력한 기능 중 하나이며, 파일 시스템을 사용하여 애플리케이션의 구조를 자연스럽게 관리할 수 있습니다. ◆ 파일 시스템을 통한 경로 추가새로운 경로를 추가하기 위해 `app` 폴더 내에 새 폴더를 만들고 하위에 `page.js` 파일을 생성하면 됩니다.예를 들어 `/app/about/page.js` 파일을 생성하면 `/about` 페이지가 추가됩니다. ◆ 페이지 간 이동Server-side(Backend) : 서버 컴포넌트 함수를 실행하는 과정에서 최종적으로 렌더링될 HTML 코드를 생성합니다.Client-side(Frontend) : 렌더링될..

◆ NextJS란?: React 프레임워크의 확장판이며, 서버 사이드 렌더링(SSR), 정적 사이트 생성(SSG), API 라우팅 등을 쉽게 구현할 수 있도록 도와주는 도구입니다. ◆ NextJS의 필요성: NextJS는풀스택 리액트 프레임워크이기 때문에 리액트로 풀스택 애플리케이션을 구축하는 과정을 단순화합니다.풀스택 애플리케이션을 구축하는데 필요한 라우팅, 폼 제출, 데이터 처리, 인증 등의 기능을 제공합니다. ◆ NextJS 주요기능 및 장점풀스택 애플리케이션 구축프론트엔드와 백엔드에서 실행되는 코드를 모두 작성할 수 있어 풀스택 애플리케이션을 쉽게 구축할 수 있습니다.파일 시스템 기반의 경로 설정 (File-based Routing)파일 시스템을 사용하여 페이지의 경로를 설정할 수 있어 코드 기반..

◆ 11. Using Typesnumberstring: ' ', " ", ` `(템플릿 리터럴)booleanapp.tsfunction add(n1: number, n2: number) { return n1 + n2;}const number1 = 5;const number2 = 2.8;const result = add(number1, number2);console.log(result); // 7.8함수의 매개변수에 타입을 지정하여 컴파일 시 오류를 예방할 수 있습니다.예를 들어 `number1`에 문자열이 넘어가면 타입 오류가 발생합니다. 이는 개발 중에만 확인이 가능하고, 컴파일된 JS에서는 오류가 발생하지 않습니다. ◆ 12. TypeScript 타입 vs. JavaScript 타입JavaScript..

이번 주부터 유데미 'Typescript: 기초부터 실전형 프로젝트까지 with React + NodeJS' 강의 스터디를 진행하게 되었습니다. 스터디는 총 4주간 진행되며, 각 주차마다 강의 섹션별로 학습 내용을 나누어 계획을 세웠습니다. 매주 공부한 내용을 포스팅으로 정리하면서 복습할 예정입니다.◆ TypeScript란? TypeScript는 자바스크립트의 수퍼셋(Superset)으로, 자바스크립트의 모든 기능을 포함하면서, 타입 시스템과 클래스, 인터페이스 등 고급 기능이 추가된 프로그래밍 언어입니다. 하지만 타입스크립트 코드는 브라우저에서 바로 실행되지 않습니다. 브라우저가 타입스크립트를 이해할 수 없으므로, 먼저 자바스크립트 코드로 컴파일한 후에 실행해야 합니다. 타입스크립트는 컴파일러 역할을 ..