글쓴 개요 바닐라 스크립트로 브라우저&&모바일 체크 함수를 구현했습니다. 처음에는 class형식으로 코드를 구현했지만 IE에서는 작동이 안되어 prototype형식으로 리팩토링 했습니다. function detection() { //사용방법 const $check_device = new Check_device(navigator.userAgent.toLowerCase()); //브라우저만 확인 console.log("브라우저만 확인 " + $check_device.check_browser()); //모바일만 확인 console.log("모바일만 확인 " + $check_device.check_mobile()); //브라우저 && 모바일 확인 console.log("브라우저 && 모바일 확인 " + $che..

글쓴 개요 : 백준 3052번 문제를 푸는 과정 중에 알게된 내장 객체 사용 방법을 소개하고자 작성했습니다. Set 객체 사용 방법 var mySet = new Set(); mySet.add(1); // Set { 1 } mySet.add(5); // Set { 1, 5 } mySet.add(5); // Set { 1, 5 } mySet.add('some text'); // Set { 1, 5, 'some text' } var o = {a: 1, b: 2}; mySet.add(o); mySet.add({a: 1, b: 2}); // o와 다른 객체를 참조하므로 괜찮음 mySet.has(1); // true mySet.has(3); // false, 3은 set에 추가되지 않았음 mySet.has(5); ..

React Query란 서버 상태(server state)를 관리하는 라이브러리다. 서버 상태란 원격에 위치한 공간에 저장되며 앱이 소유하거나 제어하지 않는다 데이터를 가져오고 업데이트하기 위해선 비동기 API가 필요하다 다른 사람과 함께 사용하며, 내가 모르는 사이에 업데이트될 수 있다 앱에서 사용하는 데이터가 “유효 기간이 지난” 상태가 될 가능성을 가진다. 예를 들어 쇼핑몰의 상품 목록, 게시판의 댓글, 배달앱의 주문 진행 상황 등은 모두 위와 같은 특성을 가지고 있다. 그렇기에 다음과 같은 작업에 대한 필요가 생긴다. 캐싱 서버 데이터 중복 호출 제거 만료된 데이터를 백그라운드에서 제거하기 데이터가 언제 만료되는지 알고 있기 만료된 데이터는 가능한 빨리 업데이트하기 페이지네이션, 레이지 로딩 데이..

글쓴 개요 : 기존 react router dom을 설치 후 발생한 hook들의 오류로 인해 확인 결과, v6로 업그레이드 되면서 변경 된 부분들이 생겨 작성하게 되었습니다. 사용 가능 버전 : React >= 16.8 1. Switch -> Routes로 네이밍 변경 2. exact 옵션 삭제 3. component={} || render={()=>} -> element={} 형식으로 변경 4. path="/web/:id" -> path=":id"로 상대경로로 지정 5. useHistory -> useNavigate로 변경 // v5 import React from "react"; import { BrowserRouter, Route, Routes } from "react-router-dom"; imp..

우선 저는 linux(ubuntu) 환경에서 nginx서버의 리버스 프록시를 이용해 Nextjs(Node)를 연결했습니다. 여기서 들었던 의문 사항이 1. 리버스 프록시를 이용하지 않고 node서버 하나만 띄우면 안될까? 2. 리버스 프록시를 사용하므로써 ssl은 문제가 없을까? 이 두 가지가 계속 생각이 났습니다. 그래서 직접 경험 && 검색을 토대로 정리해보겠습니다. 1. 리버스 프록시를 이용하지 않고 pm2로 node서버를 띄우기 이 부분에서 우선적으로 확인이 필요했던 사항이 있습니다. pm2는 해당 서버에서 동작관련해서 access,error로그의 확인이 가능한가? #정확한 이유는 모르겠으나 pm2는 access,error log가 일반적인 apache,nginx log와 같이 서버의 로그를 보여..

배포 환경 linux(ubuntu), nginx *react설치 방법과 다르게 처음부터 linux에서 작업이 시작됩니다. 1. Node 설치 Node.js는 Node Version Manager를 통해서 설치하는 것이 편리하므로, NVM을 설치한다. 먼저, 다음의 명령어로 설치 스크립트를 다운로드 받아서 실행한다. curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.38.0/install.sh | bash nvm이 잘 설치되었다면 다음 명령어를 입력했을 때 nvm이 출력될 것이다. 만약 뜨지 않는다면 다시 접속하거나 Bash를 다시 실행해서 시도해본다. (source .bashrc) command -v nvm Node.js 홈페이지에 들어가 현재 버전을 ..