분류 전체보기98 Next.js란? 넥스트는 리액트로 웹을 편하게 개발할 수 있도록 도와주는 프레임워크이다. 초기에는 주로 서버 사이드 렌더링(SSR, Server Side Rendering) 프레임워크의 역할을 했지만, 요즘에는 리액트 프로젝트 시작할 때 권장되는 프레임 워크이다. 주요 특징CRA(Create React App)이나 Create Vite보다 더 많은 편의 기능을 제공한다.라우팅 : 리액트 라우터를 별도로 구성하지 않아도 되는 파일 기반 라우팅 시스템을 제공한다. 렌더링 : 클라이언트 사이드 렌더링뿐만 아니라 서버 사이드 렌더링도 지원한다.데이터 호출 : fetch를 확장해서 제공할 뿐만 아니라 데이터 캐싱, 유효성 확인 등의 기능을 제공한다.스타일링 : CSS 모듈 방식, CSS in JS 방식, Tailwind를 바로 .. 2024. 8. 10. Webpack의 주요 속성 웹팩의 주요 속성 4가지를 도식으로 나타내면 아래 그림과 같다.1. Entry : Webpack을 실행할 대상 file 즉, 진입점2. Output : Webpack의 결과물에 대한 정보를 입력하는 속성. 일반적으로 filename과 path를 정의3. Loader : JS파일이 아닌 CSS, 이미지 같은 파일을 웹팩이 인식하게 해주는 속성. 오른쪽에서 왼쪽 순으로 적용4. Plugin : Webpack으로 변환한 파일에 추가적인 기능을 더하고 싶을 때 사용하는 속성. Webpack의 전반적인 제어권을 가지고 있다. 아래는 전체적인 Webpack 예시이다.var path = require('path')var webpack = require('webpack')module.exports = { entry:.. 2024. 8. 9. [백준] 1654번 랜선 자르기(JavaScript) https://www.acmicpc.net/problem/1654let input = require('fs') .readFileSync(process.platform === 'linux' ? '/dev/stdin' : './input.txt') .toString() .trim() .split('\n'); let [K, N] = input.shift().split(' ').map(Number); input = input.map(Number).sort((a, b) => a - b); let start = 0; let end = input[K - 1]; let answer = Number.MIN_SAFE_INTEGER; while(start acc + Math.floor(cur / m.. 2024. 5. 7. [백준] 10816번 숫자 카드2(JavaScript) https://www.acmicpc.net/problem/108161. 객체 방법let input = require('fs') .readFileSync(process.platform === 'linux' ? '/dev/stdin' : './input.txt') .toString() .trim() .split('\n') .map((el) => el.split(' ').map(Number));let N = input.shift()[0];let first = input.shift().sort((a, b) => a - b);let M = input.shift()[0];let second = input.shift();let classFirst = first.reduce((acc, cur) => { ac.. 2024. 5. 6. 이전 1 2 3 4 5 6 ··· 25 다음
