최근글
-
Information
[정보]앞으로 도움이 많이 될 사이트 목록 (2024-12-08)
https://react-svgr.com/playground/ ← SVGR (일반 SVG파일의 코드를 React 혹은 React Native용 코드로 변환해주는 사이트) https://pixabay.com/ko/← 픽사베이 (이미지 관련 저작권에 대해 정확하게 알지 못해 무료 혹은 부분 무료라는 내용을 삭제했습니다.) https://www.freepik.com← 프리픽 (이미지 관련 저작권에 대해 정확하게 알지 못해 무료 혹은 부분 무료라는 내용을 삭제했습니다.) https://www.flickr.com/← 플리커 (이미지 관련 저작권에 대해 정확하게 알지 못해 무료 혹은 부분 무료라는 내용을 삭제했습니다.) http://www.webjangi.com/ ← 웹쟁이 (무료 웹 소스 저정소) http:/..
더보기
-
JavaScript
[JavaScript] 리액트에 indexedDB 사용하기
일전에 사이드프로젝트를 진행하면서 로컬스토리지와 세션스토리지 그리고 쿠키를 이용했었고지금도 회사업무를 진행하면서 세션과 로컬스토리지, 쿠키를 이용하고있습니다. 하지만.... 사이드프로젝트를 진행할 당시 뭔가... 뭔가가 부족했었는데...요즘이야 백, 프론트 상관없이 올포지션을 다 다룰수 있어야하지만... 난 아직도 부족하기 때문에백엔드 프로젝트를 혼자서 구현하기가 아직도 버거워요. 그러다가 문득 찾은 것이 indexedDB!!! 이름 그대로 DB이다! mdn web docs 에서는 이렇게 설명하고 있습니다. IndexedDB는 파일이나 블롭 등 많은 양의 구조화된 데이터를 클라이언트에 저장하기 위한 로우 레벨 API입니다. IndexedDB API는 인덱스를 사용해 데이터를 고성능으로 탐색할 수 있습니다..
더보기
-
Next.js
[Next.js] Next 프로젝트 시놀로지에 배포한 척 하기
-리액트 배포는 쉬웠는데... 일단 리액트 프로젝트를 공부한답시고 시놀로지에 배포를 해본 적은 있었기 때문에 비교적 어렵지 않았습니다. React 프로젝트를 시놀로지에 배포하는 방법은 먼저 React 프로젝트를 build 하여 말아주고 시놀로지의 Docker 를 사용하여 컨테이너를 하나 만들어줍니다. 도커 생성 시 마운트 경로를 위의 사진과 같이 /home/node/app 으로 설정해 줍니다. 이 때 port 번호는 사용 할 포트번호를 입력해주고 그리고 해당 디렉토리에 위와같이 node_modules을 설정해주고 index.js 파일을 설정해주고... 같은 위치에 React build 디렉토리를 넣어준 후 Docker를 실행하면 프로젝트 배포가 됩니다. 도커를 사용하니 따로 ssh를 사용하여 nohup을..
더보기
-
React
[React] 카카오맵 API 커스텀 해보기-1
따로 사이드 프로젝트와 회사 프로젝트를 진행하다보니 생각보다 카카오맵을 많이 사용하게되서혹시라도 저와 비슷한 고민을 하는분들이 있지 않을까 싶어 작성하게 됬습니다. 절대로 100% 정확한 답이 아니지만 그래도 도움이 되면 좋겠네요. 1. 그래서 카카오맵 API 를 React에서 어떻게 사용한다고??!! (또다시 반복!)https://kkt102.tistory.com/69네... 일단 JavaScript Key도 발급 받아야하고 사용 할 URL도 등록해주고... 기본 작업은 동일합니다.근데 카카오맵 API 가이드에는 스와이프처럼 다른 프레임워크 기준으로 가이드가 없다보니 저는 처음에 삽질아닌 삽질을 많이 했었습니다.나중에 와서 능력자 한분이 카카오맵 API를 React Module로 배포한 적이 있는 걸 ..
더보기
