전체 글
-
uuid 설치 없이 unique ID 만들기 (crypto.randomUUID)Front-end/Javascript 2023. 2. 5. 21:24
UUID 나는 Javascript(or Typescript)를 기준으로 작업을 하고 있다. id를 줄 때는 항상 unique하게 사용하여야한다는 것을 알 것이다. 그러다보니 보통 uuid를 설치해서 아래와 같이 사용하곤 했다. import { v4 as uuid } from 'uuid' uuid는 MAC 주소와 현재 날짜 및 시간의 조합을 사용하여 생성되며 가능한 조합 수가 2의 128승으로 굉장히 많은 수이기 때문에 수년 동안 매초 수조 개의 ID를 생성하지 않는 한 똑같은 ID를 나타내기 거의 불가능하다고 한다. 그래서 이런 uuid를 설치해서 사용하게 되는데, 어쨋든 이런 것이 node_modules의 사이즈를 크게 만든다. 그래서 uuid를 설치하지 않고 unique ID를 사용 할 방법을 찾았는..
-
Error: listen EADDRINUSE: address already in use :::5000Concern & Opinion 2023. 1. 28. 20:28
"typescript express + mongoose를 연결하던 중 already in use 5000... 이라는 에러문구가 나왔다. 당연히 나는 사용하지 않는 포트인데 이게 왜 나왔는지 찾아보았다. 잘 정리를 해준 분의 글을 볼 수 있었는데, 각설하고... 맥북 업데이트를 하면서 나타난 에러라고 생각되어진다. 이를 해결하기 위해서는 "셋팅" -> "공유" -> "에어플레이"에 들어가서 모든 토글을 off 시켜주면 된다. 이후 서버를 다시 재가동 시켜보면 잘 작동하는 것을 볼 수 있을 것이다. I'm using a macbook pro intel version. When I try to connect typescript express with mongoose, the error was popped t..
-
typescript react + typescript express s settingBack-end/Node.js 2023. 1. 28. 19:05
## 타입스크립트로 서버 기본 셋팅하기 리액트의 경우 typescript template을 사용하면 빠르게 설치가 가능하지만, 서버의 경우 설치를 따로 해줘야하므로 기록을 하려고 한다. Frontend typescript setting 리액트의 경우 앞서 말한대로 template을 이용하면 간단하게 설치가 가능하다. 사이트에 들어가보면 참고를 할 수 있을 것이다. yarn create react-app my-app --template typescript 나의 경우 yarn을 사용하기 때문에 이렇게 install을 해서 사용 할 수 있다. frontend, backend 둘 다를 건들여야할 때는 나의 경우 폴더 트리를 아래와 같이 가져가고 있다. typescript-setting |__ client |__..
-
Firebase Error "Missing or insufficient permissions." 해결방법Concern & Opinion 2022. 12. 1. 22:36
요즘 Firebase를 통해서 chat-app을 만들어보고 있다. API를 사용하는 것이나, 백엔드를 짜서 만드는 것은 생각하고 있었지만 이상하게 파이어베이스를 이용해서 해볼 생각은 해보지 못하고 있었다. 얼마 전, "코딩이 재미있는가?" 라는 질문에 한 멘토의 말이 "너는 니가 만들고 싶은 것을 만들고 있는가?" 였다. 그래서 누군가에게 보여주기 위해서 등이 아닌 나의 궁금증 해결과 학습을 위해서 파이어베이스를 이용한 가벼운 채팅앱을 만들어 보고 싶었다. 본론 해서 파이어베이스를 이용해서 채팅앱을 짜던 중 하나의 에러를 발견했는데, 한참 해결하려고 보다가 생각보다 쉽게 해결 할 수 있던 것이었어서 남겨두려고 한다. "Missing or insufficient permissions." 이러한 에러 메세지..
-
vim(neovim) editor를 사용하는 이유Concern & Opinion 2022. 8. 29. 15:01
VIM Editor를 사용하는 이유 season 2 vim(neovim) editor를 사용하는 이유 2 _ lazyvim몇 달 째 인기 글 1위인 vim(neovim) editor를 사용하는 이유신기하게도 2년 전에 작성한 글인 vim(neovim) editor를 사용하는 이유 가 내가 쓴 글 중 가장 인기가 많다.그런 현상이 몇 주씩 아니 몇 달씩 이patrick-f.tistory.com - vi 공부를 시작 한 이유...나는 비전공자에 독학으로 프로그래밍 공부를 시작했다.마케팅 회사에 다니면서 독학을 했기 때문에 회사에 2시간 일찍 출근해서 공부하고, 일이 끝나면 집에와서 새벽까지 공부를 했다.아무것도 모르는 사람이 독학을 했을 때 가장 큰 문제는 아는게 없으니 길을 잡기 힘들다는 것이었다.처음에..
-
리액트 파일 업로드, 파일 다운로드 File upload, download with javascript reactFront-end/React 2022. 6. 24. 17:24
최근에 맡아본 업무 중 하나가 파일을 업로드하고 다운로드 할 수 있는 기능을 만드는 것이었다. 원래 어려운 것이 아닐 수 있으나... 적어도 나에게는 생각보다 복잡한 과정을 거쳐야 했으므로 정리를 해두고 싶은 생각이 들었다. 그리고 이런 것들을 이해 할 수 있는 이론 지식을 가져야겠다는 마음도 함께 생겼다. 나에게 주어진 옵션은 이러했다. 1. 파일은 어떤 종류의 확장자던지 올릴 수 있어야한다. 2. 업로드 하는 파일의 크기는 50MB를 넘어가서는 안된다. 3. 파일 이름 + 파일크기가 나와야하고, 파일 크기는 사이즈에 따라서 convert되어야 한다. 4. 드래그앤드롭으로 파일을 넣을 수 있어야한다. 나는 이런 옵션을 가지고 개발을 시작했다. (** 추가 : 파일업로드, 다운로드에 초점을 맞추므로 UI..
-
특정 브랜치만 git clone 하는 방법Git&Github 2022. 4. 28. 10:12
작업을 하다보면 여러가지 git branch가 나타나게 된다. 우리 회사의 경우 version을 업그레이드 해왔기 때문에 크게보면 v2.0.0, v3.0.0, v4.0.0 이런 식으로 업데이트 된 브랜치들이 존재하고 있다. 최신의 버전을 원하는 경우 git clone을 한 다음에 pull을 당겨도 되긴하겠지만, conflict가 나는 경우가 있었다. 그래서 한번에 깨끗하게 내가 원하는 버전을 당기고 싶었다. 그렇다면 어떻게 git에서 내가 원하는 특정 branch만 clone 할 수 있을까? git clone -b [branch name] --single-branch [git url] 예) git clone -b v4.0.0 --single-branch https://github..... 이렇게 위와 ..
-
웹페이지 미리보기 : OGP(OG) (Open Graph protocol)그 외 다양한 웹 지식 2022. 1. 3. 17:32
이번에 작업을 하면서 처음 ogp에 대해서 알아보았다. 이는 흔히 우리가 카카오톡이나 슬랙 등에 url을 넣으면 나오는 아래와 같이 나오는 웹페이지 미리보기 같은 것이다. 처음에는 자동으로 크롤링이 되면서 필요한 부분이 크롭되어 나오는 것으로 생각 했는데, 찾아보니 ogp라는 것이 있어서 이번에 배포를 하면서 적용하게 되었다. OGP는 Open Graph protocol 이라고 하여 OG라고도 불리는 것 같다. 이는 meta-tag(메타태그)이며, html에 적용하면 되는 것이다. 메타태그는 무슨 용도일까? 이는 사람에게 보여주기 위한 정보가 아닌, 웹 서버와 브라우저 간의 상호 정보 전달을 위해 사용된다고 할 수 있다. 문서의 디자인에는 영향을 미치지 않으며, 어떤 정보를 담고 있고, 누가 만들었고, ..