분류 전체보기 (56) 썸네일형 리스트형 Next.js 14 PWA 적용하는 방법! 1. next-pwa 설치 next-pwaNext.js with PWA, powered by workbox.. Latest version: 5.6.0, last published: 3 years ago. Start using next-pwa in your project by running `npm i next-pwa`. There are 85 other projects in the npm registry using next-pwa.www.npmjs.com 2. mainfest 추가public 폴더에 넣으면 됩니다. PWA Manifest Generator | ProgressierThis free tool allows you create an app manifestprogressier.com{ "sho.. 프로젝트에서 Route Handler 안 쓰고 Server Action만 쓴 이유 (feat. Supabase) Next.js로 모하루(개인 프로젝트)를 진행하면서, 모든 서버 통신은 Server Action을 이용해 구현했습니다.Route Handler와 Server Action 중에서 Server Action을 선택한 이유는비즈니스 로직을 클라이언트로부터 분리하고, 보안을 강화하기 위해서Server Action은 서버 환경에서만 실행되기 때문에, 민감한 로직이나 API 키, 인증 정보 등을 클라이언트에 노출시키지 않고 안전하게 처리할 수 있습니다.Supabase를 백엔드로 사용했기 때문입니다.Supabase에서 제공하는 메서드들은 fetch로 직접 호출하는 방식이 아니라, 서버 환경에서 동작하는 클라이언트를 통해 호출해야 하기 때문에, Server Action을 활용하는 것이 더 적합했습니다.모든 서버 통신이 .. 카카오맵 API 타입스크립트로 사용하기 (kakao.maps.d.ts로 Type 적용) 카카오맵을 사용한 프로젝트를 진행하고 있는데, 타입 정의 문제가 발생했다.처음에는 kakao 객체 존재 여부를 TS에서 인식하지 못하기 때문에, 객체가 window에 있다고 선언했다.declare global { interface Window { kakao: any; }} 카카오에서도 이렇게 선언하라고 했는데, (https://devtalk.kakao.com/t/typescript/126917/2)개발 과정에서는 문제 없이 실행되더라도, 문제는 빌드였다.빌드 과정에서 any 타입에 모든 빨간줄을,,, ㅠㅠ 카카오에서는 API 타입을 따로 제공하지 않았다 😱그래서 임시로 장소 결과 객체 타입을 정의했으나export type KakaoPlace = { address_name: string; //.. [JS] 귤 고르기 (Map 사용하기) 문제 풀이해당 문제에서 구해야 하는 것은 귤 k개를 고를 때, 귤의 크기 차이를 최소화 하는 것이다.아이디어는 단순하게, 크기가 많은 것부터 선택해야 차이가 나는 귤의 종류를 최소화할 수 있다.주어진 배열에 크기에 따른 귤의 개수를 알아야 하므로 Map을 사용해서 구현했다. Mapkey-value 쌍의 형태로 데이터를 저장하는 자료구조이다.객체와 비슷하지만, 객체의 key 타입은 문자열과 Symbol만 가능하지만, Map은 문자열, 함수, 배열 등 모든 자료형이 가능하다는 차이점이 있다. 1. key-value 형태의 이터러블을 인수로 전달const map = new Map(); // Map(0) {}const map = new Map([['k1', 'v1'], ['k2', 'v2']]) // Map(.. [JS] 소수 찾기 (에라토스테네스의 체) 소수는 1과 자기 자신만을 약수로 가지는 수를 말한다.소수를 구하는 대표적인 방법으로는 brute force로 제곱근까지 단순 나눗셈을 하는 방법, 에라토스테네스의 체가 있다. 에라토스테네스의 체를 구현해보고, gpt와 함께 개선점을 찾았다 에라토스테네스의 체 O(N * log log N)에라토스테네스의 체는 다수의 소수(2~n)를 빠르게 구할 수 있는 알고리즘이다. 2부터 시작해서, 방문한 수의 모든 배수를 지우는 방법이다 (배수는 당연히 소수가 아니므로)결과적으로 남은 수는 모두 소수이다. 첫번째 코드개념을 보고 적용한 방법이다.function solution(n) { var answer = 0; const arr = Array(n+1).fill(true) // n+1 만큼의 배열을.. 스파르타코딩클럽 내일배움캠프 React 트랙 5기 수료 후기 🎓 벚꽃이 개화할 때부터 한 여름까지 4.5개월 동안의 과정이 끝났다.9-9으로 진행하기 때문에 식사 시간도 안맞고, 잠을 잘때가 많아서 오랜만에 가족들이랑 같이 저녁을 먹었다.1. 내일배움캠프(내배캠) 참여하기 전 백그라운드나는 전공자이고, 리액트로 간단한 웹사이트까지는 만들 수 있는 상태에서 내배캠에 참여했다.학교에서는 프론트 개발 경험이 없었고, 졸업반 때 짧게 일을 하면서 시작했다.프론트엔드는 결과가 즉각적으로 보이고, 사용자 경험을 디자인한다는 점에서 매력적인 직무라고 생각한다. 2. 내배캠을 선택한 이유신청할 때가 새해쯤이었던 거 같은데, 새해 초에 느끼는 불안감과 도전의식으로 신청했다. - 강제성 필요- 저번에 신청한 내일 배움 카드가 있었음 = 국비 지원으로 공짜인데, 훈련장려금도 준다- 다른.. 이전 1 2 3 4 ··· 10 다음 목록 더보기
