개발 179 [자바스크립트] IndexedDB 실전 사용법 (idb) 들어가며 예전에 localstorage 관련 글 마지막에 localstorage 보다는 indexedDB 사용을 권고한다는 글로 끝맺음했었습니다. 시간이 흘러 이번 프로젝트에서 IndexedDB를 이용해 네트워크 리소스를 최적화한 경험이 있어 공유드립니다. 개발 환경은 Next, React를 사용했지만 바닐라 자바스크립트 기반으로도 동작하는 코드이니 살펴보시면 좋겠습니다. 대상 독자 프론트엔드 개발을 하다가 localstorage, sessionstorage를 넘어 indexedDB도 써보려는 개발자 같은 파일을 여러 번 요청하는 게 안타까운 최적화에 특화된 개발자 [Next] localstorage를 사용하는 방법 #1 localStorage 란? 웹 스토리지 객체(web storage object)의.. 2022. 9. 30. [리액트] snackbar에 대해서 (react-toastify, react-hot-toast, notistack) 들어가며 개발을 진행하다가 웹소켓을 통해 들어온 알람을 유저에게 전달해야 하는 경우가 생겼습니다. 이때 주로 사용하는 방법이 snackbar를 통해 오른쪽 하단 또는 중앙 상단에 텍스트 창을 띄우는 것입니다. 이번 글에서는 snackbar에 기본부터, 이를 구현한 라이브러리 3종(notistack, react-hot-toast, react-toastify)의 사용법과 비교해보도록 하겠습니다. 그리고 더 나아가 실제 프로젝트에 어떤 식으로 사용하면 좋을까 개인적인 사용방법에 대해 언급하며 마무리하겠습니다. Snackbar snackbar(이하 스낵바)의 정의는 여러가지입니다만, 구글의 디자인 철학에 의하면 아래와 같습니다. Snackbars provide brief messages about app pro.. 2022. 9. 15. [Docker] Next 프로젝트 도커 배포 삽질기 들어가며 기존에서는 Amplify 또는 vercel로만 배포, 빌드해서 도메인과 관련된 이슈만 해결하면 별다른 이상 없이 배포를 할 수가 있었습니다. (이게 바로 툴이지!!) 근데 이번에 도커이미지를 직접 생성하여 배포를 해야 하는 상황이라 해당 업무를 진행하면서 삽질했던 간단 경험을 적어보겠습니다. Next Docker 배포 next 프로젝트를 배포하는 가장 쉬운 방법은 vercel를 이용하는 겁니다. 거의 제로 config에 걸맞는 조합을 자랑하고 (실은 같은 회사인) 공식 문서상에서도 vercel을 이용하라고 조언해줍니다. Deployment | Next.js Learn how to deploy your Next.js app to production, either managed or self-hos.. 2022. 8. 28. [개발지식] 다른 회사는 어떤 걸 써요? ( Wappalyzer ) 들어가며 오늘은 꽤 멋진 extendsion에 대한 소개글을 가져왔습니다. 바로 Wappalyzer 입니다. 이름만 들어서는 알 수 없는 이 친구는 바로 사이트의 기술 스택을 분석해주는 도구입니다. 저는 사이드프로젝트를 할때 다른 기술스택을 써보려고 합니다. 매번 어떤걸 쓰면 좋을지 몰라 다른 회사의 기술스택으로 해보려고 하는데요. 그럴때 도움을 주는 Wappalyzer에 대해 간단히 살펴보고 이 도구가 어떤 이점을 주는지 확인해보겠습니다. Wappalyzer Wappalyzer의 대문 페이지를 가져온 것입니다. 설명에 쓰인 대로 "웹사이트의 기술을 식별해준다" 라네요. 사용하는 방법은 아주 간단합니다. 설치방법 그냥 크롬의 익스텐션으로 설치하면 끝입니다. 설치 링크는 여기입니다. Wappalyzer -.. 2022. 8. 15. 이전 1 ··· 8 9 10 11 12 13 14 ··· 45 다음
