방종민 블로그?

배경: SSG를 사용하기에 데이터 업데이트를 위해 하루에 한 번씩 재배포를 하려했으나 서비스에 영향이 있으므로 ISR로 변경ISR: 정적 페이지를 생성하지만 일정 주기마다 페이지(또는 데이터) 재생성동작 방식초기: fetch를 통해 데이터를 가져와 페이지 생성캐싱 및 제공: 생성된 정적 페이지는 캐시에 저장되고, 이후 요청에 대해 캐시된 페이지 제공백그라운드 재생성: revalidate 옵션에 설정된 시간이 지나면, 다음 요청 시 백그라운드에서 fetch 요청페이지 업데이트: 새로운 페이지로 캐싱 및 제공 ISR을 적용하는 방법에는 개별 fetch에 적용하거나, 컴포넌트 전체에 적용할 수 있습니다. 1. 개별 fetch에 적용app directory가 아니면 getStaticProps 함수 사용expor..

gooey effect: 끈적끈적해 보이는 이펙트입니다. contrast를 올리면 blur 효과를 줘도 흐릿해지지 않는 현상을 이용하여 표현합니다.  blur와 contrast 관계블러 효과가 강해져도 대비 효과가 강해지면 선명해 보임1. canvas css 직접 설정하기 canvas { background-color: whitesmoke; filter: blur(10px) contrast(30); }css filter의 단점ctx.fillStye= ‘blue’ 이지만 흰색 배경과 섞여 보라색 테두리가 생김배경색이 없으면 적용이 안됨⇒ svg 필터 사용 2. svg태그로 설정 ..

배경: SSG를 사용하여 하루에 한 번 업데이트하기 위해 Vercel의 Cron Jobs 기능을 활용/app/api/cron/route.ts: 일정 주기마다 반복할 코드를 생성합니다. deploy hook url 가져오기deploy hook url: 특정 브랜치를 배포 트리거 URLvercel의 setting -> Git 메뉴에 있습니다.아래 코드에서는 환경변수로 입력했기에 vercel(setting -> Environment Variables)에서도 추가해줘야합니다.codeimport fetch from "node-fetch";import { NextRequest, NextResponse } from "next/server";export async function POST(req: NextRequest..

: react-kakao-maps-sdk 사용법 간단히, 카카오 스크립트를 비동기로 불러왔는데 로드가 안되는 건에 관하여 간단 사용법 설치 npm install react-kakao-maps-sdk # or yarn add react-kakao-maps-sdk 타입 스크립트 사용 시에는 kakao.maps.d.ts 설치 tsconfig.json에 추가 까지 해주면 된다. // tsconfig.json "compilerOptions":{ ... "types": ["kakao.maps.d.ts"] } API KEY 발급 과정 카카오 개발자사이트 (https://developers.kakao.com) 접속 개발자 등록 및 앱 생성 웹 플랫폼 추가: 앱 선택 – [플랫폼] – [Web 플랫폼 등록] – 사이트 ..

2022.12.16 테크톡 요약: 개발자가 작성한 스크립트 언어를 실행 가능한 언어로 변형하여 실행, 실행 순서 및 메모리를 관리하는 엔진 필요(여기선 V8) 자바스크립트 런타임: 엔진을 포함한 API 및 기능 집합 자바스크립트 엔진: 좁은 의미로 인터프리팅 역할 ⇒ V8 엔진을 기반한 런타임으로 Chrome이 동작한다. 인터프리터 언어 보통의 인터프리터 언어는 한 줄마다 실행되어 같은 변수가 나오더라도 기계어로 번역하여 효율적이지 못함 요즘 인터프리터 언어는 아래의 과정을 거침 (1)JIT 컴파일 (2)수행 과정 엔진 및 런타임 자바스크립트 엔진 Heap: 각 함수 별 선언 및 할당되는 모든 변수 및 함수를 적재하는 메모리 영역 Call Stack: 함수 실행 순서에 맞게 쌓이는 스택, Heap에 있는..

순열과 조합을 알아보고 문제에 적용1. 순열(Permutation) : 0 서로 다른 n개의 원소에서 r개를 중복없이 순서를 고려하여 선택하거나 나열하거나 하는 것아마 예전에 본 적있는 공식일거예요. [예시]‘1~5까지 숫자가 쓰여진 5장의 카드에서 무작위로 카드를 골라 나열된 숫자의 경우의 수는?’하면 5 * 4 * 3 * 2 * 1 을 합니다. 3장을 뽑는다고 하면? 5 * 4 * 3 을 합니다.5 * 4 * 3 을 !을 사용한 공식으로 바꿔보면 5! / 2! 입니다. nPr = n! / (n - r)!  이거든요. 하지만 쉽게 n * n-1 * n-2 ... 이 r개가 되게 만들면 됩니다. 5P3 = 5 * 4 * 35개에서 3개를 고름 ! 순열을 이용하는 문제 풀이[문제]백준 N과M(1) - N..