Next.js 5 [Next] Next 14 app router에서 PWA가 될까? 들어가며무료한 주말.. 최근에 react conf(2024)와 js conf(2024)가 올라와서 이것저것 보면서 시간을 보내다 갑자기 PWA 기능에 대한 POC를 진행해 봤다.PWAprogressive web app인가 줄임말인데. 이것에 대한 설명은 다른 곳에서도 많으니 간략하게 살펴보겠다.pwa란 웹 기술을 사용하여 네이티브 앱과 유사한 UX/UI를 제공하는 웹 애플리케이션 기술을 의미한다. 기존에 웹브라우저에서 제한적이었던 푸시 알람, 앱 설치, 오프라인 사용등을 지원한다.번외로 pwa는 구글 진형에서는 나름 밀고 있는데, ios 쪽에선 반대한다고 한다.구현우선 내가 검증하고 싶은 포인트는 총 3개였다.PWA에서도 스토리지들이 잘 동작할까?PWA에서도 worker, wasm 등이 제대로 동작할까?.. 2024. 7. 28. [Next.js] NextAuth를 활용한 우아한 유저 관리 들어가며 이번 글은 NextAuth를 활용하여 실제 서비스에서 우아하게 유저를 관리한 경험에 대해 말씀드리는 글입니다. NextAuth와 Middleware를 이용해서 인증, 인가를 어떻게 관리하였는가에 대한 주제를 다룹니다. 다루지 않는 내용 해당 글에서는 NextAuth의 기본 사용법에 대해 상세히 알려주지 않습니다. (공식문서 아주 추천) Next13 환경에서 구현된 예시지만, 다른 버전에서도 크게 상이하진 않습니다. 우아한 유저 관리 이전까지 NextAuth는 주로 구글인증기로만 써왔습니다. 정확히 말하자면 인증만 썼던 거죠. 하지만 실제 서비스를 하다 보면 인증으로만 끝나지 않고 해당 유저에게 권한까지 주는 인가 단계를 거쳐야 합니다. 이전까지 구현한 서비스들은 인증, 인가에 대한 큰 구별 없이.. 2024. 2. 25. [상태관리] 내가 Zustand를 선택한 이유 (over the Recoil) 들어가며 편리함을 추구하는 프론트엔드 개발자 핸디입니다. 최근에 새롭게 진행한 사이드프로젝트에서는 recoil 대신에 zustand를 사용해 보았습니다. 그래서 이번 글에서는 zustand와 Recoil를 비교하고 zustand의 장점부터 사용법에 대해 설명하도록 하겠습니다 대상독자 간단하고 직관적인 상태관리 라이브러리에 대한 기초 지식이 필요한 개발자 zustand와 recoil 사이에서 고민하는 개발자 본문 들어가기 전에 잠깐 살펴본 npm Trend입니다. recoil의 0.7.6의 버전, 가장 많은 zustand의 star수와 압도적으로 작은 사이즈가 눈에 뜹니다. 그럼 이제 편리한 zustand의 세상으로 떠나보시죠. Zustand 독일어로 ‘상태’라는 뜻을 가진 라이브러리입니다. Jotai를 .. 2023. 1. 24. [자바스크립트] IndexedDB 실전 사용법 (idb) 들어가며 예전에 localstorage 관련 글 마지막에 localstorage 보다는 indexedDB 사용을 권고한다는 글로 끝맺음했었습니다. 시간이 흘러 이번 프로젝트에서 IndexedDB를 이용해 네트워크 리소스를 최적화한 경험이 있어 공유드립니다. 개발 환경은 Next, React를 사용했지만 바닐라 자바스크립트 기반으로도 동작하는 코드이니 살펴보시면 좋겠습니다. 대상 독자 프론트엔드 개발을 하다가 localstorage, sessionstorage를 넘어 indexedDB도 써보려는 개발자 같은 파일을 여러 번 요청하는 게 안타까운 최적화에 특화된 개발자 [Next] localstorage를 사용하는 방법 #1 localStorage 란? 웹 스토리지 객체(web storage object)의.. 2022. 9. 30. 이전 1 2 다음
