치춘짱베리굿나이스

CSR, SSR, SSG 이걸 설명해줄 일이 생겼었는데 나도 뭔가 횡설수설 하는 감이 있어서 정리하기로 했다 Next.JS 공부는 계속 하는데 뭔가 이론적인 면에서 공부가 너무 부족한것 같아서… CSR Client-Side Rendering 페이지의 핵심이 되는 HTML을 클라이언트에서 생성한다면 클라이언트 사이드 렌더링이라고 부른다 서버로부터는 최소한의 HTML만 전달받고, 클라이언트에서 대부분의 렌더링을 수행하면 클라이언트 사이드 렌더링이 된다 과정 클라이언트가 특정 URL로 페이지를 요청한다 서버는 최소한의 HTML만을 클라이언트에 응답한다 클라이언트는 HTML을 파싱하고, 필요한 리소스를 파악한 뒤 추가적으로 요청한다 (JS, CSS, 미디어 등) 서버는 리소스를 응답한다 (미디어의 경우, 외부 ..

문제 제목 문제 정수 A, B 가 주어진다. 세로 길이가 A cm, 가로 길이가 B cm 인 아래와 같은 직사각형의 넓이를 cm2 단위로 구하시오. 입력 표준 입력에 다음과 같은 형태로 입력이 주어진다. A B 출력 세로 길이가 A cm, 가로 길이가 B cm인 직사각형의 넓이를 cm2 단위로 구하고, 단위 (cm2)를 생략하여 출력한다. 풀이 const square = () => { const [a, b] = require("fs") .readFileSync("/dev/stdin") .toString() .trim() .split("\n"); console.log(a * b); }; square();

Can you add this? 문제 Given two integers, calculate and output their sum. 입력 The input contains several test cases. The first line contains and integer t (t ≤ 100) denoting the number of test cases. Then t tests follow, each of them consisiting of two space separated integers x and y (−109 ≤ x, y ≤ 109). 출력 For each test case output output the sum of the corresponding integers. 풀이 const add = () ..

UnhandledPromiseRejection [UnhandledPromiseRejection: 이 오류는 async 함수 내에서 catch 블록 없이 예외가 던져졌거나, promise가 .catch() 체인을 통해 핸들되지 않은 채 reject되었을 때 발생합니다. Promise는 다음의 이유로 reject 되었습니다: "window is not initialized"] 필자가 프로젝트에 Next.js 를 써서 그런진 모르겠지만 빌드를 할 때마다 window 객체가 존재하지 않을 때의 예외처리가 제대로 되어있지 않다는!! 오류를 겪었다 서버사이드 렌더링 시에는 당연히 window 객체가 존재하지 않겠죠? 문제는 검색해본 대로 try-catch문을 여기저기 달아봐도 오류 핸들링이 되지 않는 것이었다… 해..

Who is in the middle? 문제 In the story Goldilocks and the Three Bears, each bear had a bowl of porridge to eat while sitting at his/her favourite chair. What the story didn’t tell us is that Goldilocks moved the bowls around on the table, so the bowls were not at the right seats anymore. The bowls can be sorted by weight with the lightest bowl being the Baby Bear’s bowl, the medium bowl being the..

삼각형 문제 평면상에 세 개의 점이 주어지면, 그 세 점으로 이루어지는 삼각형은 유일하게 결정된다. 또는, 삼각형이 이루어지지 않기도 한다. 세 점의 좌표가 주어졌을 때 다음에 따라 이 삼각형의 종류를 판단하는 프로그램을 작성하시오. 세 점이 일직선 위에 있으면 - ‘삼각형이 아님’ 출력할 때는 X 세 변의 길이가 같으면 - ‘정삼각형’ 출력할 때는 JungTriangle 두 변의 길이가 같으면 가장 큰 각이 90°보다 크면 - ‘둔각이등변삼각형’ 출력할 때는 Dunkak2Triangle 가장 큰 각이 90°이면 - ‘직각이등변삼각형’ 출력할 때는 Jikkak2Triangle 가장 큰 각이 90°보다 작으면 - ‘예각이등변삼각형’ 출력할 때는 Yeahkak2Triangle 세 변의 길이가 모두 다르면 가..

인덱스 시그니쳐 interface Record { [key: string]: string; } 이러한 코드를 언젠가 본 적이 있을 것이다 나도 종종 썼는데 이게 인덱스 시그니쳐인 줄은 몰랐었다 인덱스 시그니쳐란 { [key: T]: U } 위와 같은 형식으로, T와 U 모두 타입을 의미한다 인덱스 시그니쳐는 키 (Key) 와 값 (Value) 의 타입을 정확히 명시해야 하는 경우이면서 객체가 형식일 때 사용되는 타입이다 { 'chichoon': { site: 'blog.chichoon.com', name: 'chichoon', }, 'nongdamgom': { blog: 'nagano-market.co.jp', name: 'nongdamgom', } 'babo': { blog: 'babo.com', na..

줄번호 문제 텍스트에서 줄을 입력받은 뒤, 줄 번호를 출력하는 프로그램을 작성하시오. 입력 첫째 줄에 줄의 수 N이 주어진다. 둘째 줄부터 N개의 줄에 각 줄의 내용이 주어진다. 각 줄에 있는 글자의 개수는 50글자를 넘지 않는다. 출력 각 문장의 앞에 줄 번호를 추가한 뒤 출력한다. 줄 번호는 1번부터 시작한다. 줄번호를 추가하는 형식은 출력 예제를 참고하면 된다. 풀이 const lineNo = () => { let input = require("fs") .readFileSync("/dev/stdin") .toString() .trim() .split("\n"); input.shift(); for (let i in input) console.log(`${Number(i) + 1}. ${input[i]..