본문 바로가기

전체 글179

/* eslint-disable @typescript-eslint/no-use-before-define */ react에서 no-use-before-define 검사 끄는 방법 : 맨위에 /* eslint-disable @typescript-eslint/no-use-before-define */ 선언. 2023. 10. 4.
전국 시, 도 데이터 { "list": [ { "si": "서울", "gu": ["강남","강동","강북","강서","관악","광진","구로","금천","노원","도봉","동대문","동작","마포","서대문","서초","성동","성북","송파","양천","영등포","용산","은평","종로","중구","중랑"] }, { "si": "경기", "gu": ["고양","과천","광명","광주","구리","군포","김포","남양주","동두천","부천","성남","수원","시흥","안산","안성","안양","양주","오산","용인","의왕","의정부","이천","파주","평택","포천","하남","화성","가평","양평","여주","연천"] }, { "si": "인천", "gu": ["강화", "남동", "동구", "부평", "서구",.. 2023. 10. 3.
은행리스트 { "list": [ "KEB하나은행", "SC제일은행", "국민은행", "신한은행", "외환은행", "우리은행", "한국시티은행", "지방은행", "경남은행", "광주은행", "대구은행", "전북은행", "부산은행", "제주은행", "특수은행", "기업은행", "농협", "수협", "한국산업은행", "한국수출입은행" ] } 2023. 10. 3.
tree구조 데이터를 postorder traversal방식으로 javascript로 구현해보자 데이터구조 : tree구조 출처 : https://ko.wikipedia.org/wiki/%ED%8A%B8%EB%A6%AC_%EC%88%9C%ED%9A%8C 트리 순회 - 위키백과, 우리 모두의 백과사전 위키백과, 우리 모두의 백과사전. 전산학에서 트리 순회(Tree traversal)는 트리 구조에서 각각의 노드를 정확히 한 번만, 체계적인 방법으로 방문하는 과정을 말한다. 이는 노드를 방문하는 순서에 ko.wikipedia.org sample 데이터 : let rootTest = { name: 'root', children: [ { name: 'root-1', children: [ { name: 'root-1-1', children: [] }, { name: 'root-1-2', children: [.. 2023. 9. 5.
GET http://localhost:3000/insert.js net::ERR_ABORTED 404 (Not Found) localhost 는 public폴더 안의 main.js만을 인식할 수 있다. 폴더구조 아래와 같이 바꾸니 잘 작동됌. 2023. 8. 28.
재귀 for문에서 return을 만났는데도 함수를 안빠져 나온다? addSiblingButton.addEventListener('click', () => { if (selectedId == null) { return; } const parentElem = findSelectedElementParents(); console.log(parentElem, "parent 여기 와야하는데요?") parentElem.children.push({ id: `${parentElem.id}-${parentElem.children.length +1}`, text: `${parentElem.id}-${parentElem.children.length +1}`, children: [], }); render(); }) const findSelectedElementParents = (elem = .. 2023. 8. 28.
error: 127.0.0.1 - GET /_next/webpack-hmr 404 - 0.275 ms - message: Not found 이 에러가 난 이유가 뭘까? 2023. 8. 27.
E11000 duplicate key error collection 기존에 몽구스에서 required였던 값을 false로 바꾸고 새로 콜렉션을 쌓으면 생기는 오류다. 몽고디비를 몽구스로 사용하는데 최초등록한 key값을 나중에 지워야하는 경우로, 스키마에서 unique값만 바꾼다고해서 기존의 collection에 들어가 있던 키 설정이 지워지지 않기때문에 db로 들어가서 key를 삭제해줘야한다. 2023. 8. 18.
useCallback과 useMemo에 대해 완벽하게 이해해보기. 1. useCallback : useCallback()은 함수를 메모이제이션(memoization)하기 위해서 사용되는 hook 함수입니다. 첫번째 인자로 넘어온 함수를, 두번째 인자로 넘어온 배열 내의 값이 변경될 때까지 저장해놓고 재사용할 수 있게 해줍니다. 아래 코드에서는 컴포넌트의 랜더링이 일어날때마다 onSave라는 함수를 생성해서 자식에게 넘겨준다 import { useState } from 'react'; import TestTwo from './frag/test-two'; const TestPage = () => { const [name, setName] = useState(''); const onSave = () => { console.log('hello.'); }; return ( se.. 2023. 8. 17.
javascript 요일 알아내기 .getDay() 월요일이 1 화요일이 2 ... 일요일은 0이라고함. 사용방법 const today = new Date(); const day = today.getDay(); 오늘이 월요일이면 1 화요일이면 2 나옴. 2023. 8. 15.
mongodb에서 가져온 object의 개수가 하나 더해서 나온다? 이상해서 콘솔창을 찍어봤더니 $init이라는 key가 가장 앞에 더해져 있었다. $init이 대체 뭘까? 알고보니 json데이터로 변환하지 않은 mongodb데이터 그자체라 키 값이 달랐던거고 json()으로 변환해주니 알맞은 객체의 길이를 반환했다. teacherInfo.term.toJSON() 2023. 8. 11.
비트코인 선물 개념 선물이란 ? 미래의 특정 시점에 정해진 가격으로 자산을 사고파는 계약으로 실제 비트코인이 아닌, 비트코인의 가격 변동에 대한 베팅이다. 돈을 기반으로 만들어진 가상의 거래 단위로, 가격 변동을 예측하고 투자하는 것임.  선물 가격이 현물 가격과 다른 이유?선물 가격이 현물 가격보다 높을 때 : 앞으로 비트코인의 가격이 오를 것이라는 기대가 있다면, 선물 가격은 현물 가격보다 높게 형성될 수 있음.  예약 거래테익프로핏(TL) : 이 정도의 이득을 보면 익절하겠다스탑리밋(SL) : 내 손으로 손절 못하겠을 때 자동으로 걸어놓는 것 펀딩비플러스일때는 비율만큼 숏이 받고 마이너스일때는 비율만큼 롱이 받음. 8시간 마다 발생한다. 1. 양수인 경우 : 선물 가격이 현물가격보다 높을 때 발생한다. 롱 포지션 보유.. 2023. 8. 7.
div테그 밖으로 p테그 글들이 나갈때 overflow될때 해결방법 div에 아래 속성을 추가한다. word-break: break-all; 2023. 6. 11.
csp error const { expressCspHeader, INLINE, SELF } = require('express-csp-header'); app.use( expressCspHeader({ directives: { 'script-src': [ SELF, INLINE, 'https://cdn.ckeditor.com/ckeditor5/37.1.0/decoupled-document/ckeditor.js', 'https://unpkg.com', ], }, }) ); 2023. 5. 28.
ServersideProps와 useEffect가 동시에 사용이 안된다?(훅의 규칙 / Hook의 규칙) getServerSideProps로 SSR로 받아왔는데 useEffect가 작동이 안되는? 에러가 떴다. 에러 내용 : React Hook "useEffect" is called conditionally. React Hooks must be called in the exact same order in every component render.eslintreact-hooks/rules-of-hooks 알고보니 ServersideProps는 관계가 없고 Hook의 규칙을 어겨서 에러가 난거였다. 훅의규칙 내용 : 최상위(at the Top Level)에서만 Hook을 호출해야 합니다(반복문, 조건문 혹은 중첩된 함수 내에서 Hook을 호출하지 마세요. 그리고 early return이 실행되기 전에 항상 Re.. 2023. 5. 4.
div 안의 이미지에 공백이 생기는 현상 img가 inline 이라서 생긴다고 한다. 해결방법 : img { vertical-align : bottom; } 2023. 4. 21.
후.. 몽고디비 비밀번호 잊어버렸다(mongodb 비밀번호 분실) ==> 변경하는 방법 알려드림 왼쪽 바에서 Database Access 버튼 누르면됨. 2023. 3. 27.
사파리 글꼴이 이상하다..? 적용이 안되는 이유는 사용자(나)의 브라우저(사파리)에 프리텐다드 라는 글꼴이 없기 때문이였다. 정의된 첫번째 글꼴을 브라우저에서 찾음 -> 못찾으면 웹폰트 찾음 -> 두번째로 정의된 폰트 찾음 -> 못찾으면 웹폰트 찾음... 이것을 반복하기 때문이다. 결론적으로 해줘야 할 점. 1. body에 글꼴을 선언할 때 마지막 글꼴에 sans-serif를 추가해야 한다. 2. 웹폰트를 global.css파일 최상단에 넣어줘야 한다. @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css'); html, body { font-family: 'Pretendard', sans-.. 2023. 3. 26.
정말 모든것을 다 완벽히 셋팅했는데 lint작동이 안된다 알고보니 extension을 다운받지 않은 거였다. 이거 설치함. 근데 왜 유튜브나 블로그 글에서 플러그인 설치하라는 말을 해주지 않는 걸까? 잘 모르겠다.. 2023. 3. 25.
link로 페이지에 들어가면 에러가 난다(400에러) 다음과 같은 페이지 구조였다. 알고보니 my-project의 process폴더에 가지 않고 [id].tsx에 process라는 id가 들어가서 400에러가 났던 것이었다. index.tsx폴더에서 query를 이용해 status를 가져가도록 바꿔주었음. 2023. 3. 17.
애니메이션 끝나고 그대로 멈춰있게 만드는 방법 animation: moveupx 3s linear , moveupy 3s cubic-bezier(0.41, 0.04, 0.83, 0.53); animation-fill-mode: forwards; 2023. 3. 13.
typescript 에서 button의 event(e.target.value) 출력하기 타입에러나는것 해결방법 event의 타입은 event: React.MouseEvent 이고 target대신 currentTarget을 써야한다. const onMenuClick = (event: React.MouseEvent) => { console.log(event.currentTarget.name); }; 2023. 3. 13.
로그인 안되어있으면 로그인 페이지로 가라.. => 그런데 login에서 계속 login페이지로 가버리는 코드를 만들었다. 코드 : const init = async () => { const token = await auth.getToken(); if (token) { const myUserFromServer = await verifyToken(); setIsLoggedIn(true); setLoginInfo({ ...myUserFromServer, token, }); } else { setIsLoggedIn(false); router.push('/login'); } }; 고친 것 : login에서는 또 login으로 가버리면 안된다. 그렇기 때문에 이렇게 써야하는 것이다.. const init = async () => { const token = await auth.getToken(); if (token) { const m.. 2023. 3. 10.
'React'은(는) UMD 전역을 참조하지만 현재 파일은 모듈입니다. 대신 가져오기를 추가해 보세요. main페이지에 썼던 fragment를 가져와서 서브 페이지에 동일하게 넣었더니 이런 오류가 떴다. 컴포넌트, 폴더 이름이 겹쳐서 생기는 문제로 이름을 변경했더니 오류가 나지 않았다. 2023. 3. 9.
Homebrew설치 중 Warning: /opt/homebrew/bin is not in your PATH. 에러 해결 에러가 발생했다. Warning: /opt/homebrew/bin is not in your PATH. 첫번째 해결 방법 echo 'export PATH=/opt/homebrew/bin:$PATH' >> ~/.zshrc echo 'export PATH=/opt/homebrew/bin:$PATH' >> ~/.zshrc 로 보면 내용이 들어간것을 볼수있다. 그 다음 source ~/.zshrc 치고 엔터했다. brew --version 을 쳤더니 잘 입력이 되었다. 2023. 3. 4.
이지윅 에디터 에러 Invariant Violation: Unknown DraftEntity key: null. Invariant Violation: Unknown DraftEntity key: null. Application error: a client-side exception has occurred (see the browser console for more information). 대체 왜.. 이유 : 한글을 치면 오류가 난다. 해결방법 : 이지윅 에디터 버전 다운그레이드 "draft-js": "^0.10.0", 해결~! 2023. 2. 23.
[무료커플테스트] 재미로보는 결혼퀴즈! 를 통해 서로에 대해 배워가기 / 무료연애테스트 / 연애심리검사 / 같이보는 결혼테스트 아래의 웹사이트에 접속해서 서로의 이메일을 적고 30여개의 질문에 대한 답을 남기면 둘의 답을 비교하면서 다른 가치관에 대해 이해할 수 있어요. 즉, 채점 기준은 따로 없고 연인의 답이 일치하면 정답이고 다르면 오답이에요. ​ 웹사이트 : www.couple-quiz.com 메인페이지와 같이 우리의 커플테스트 총 점수를 볼수 있고 총 3가지 영역의 세부 점수가 있어요. 갈등해결영역, 생활영역, 결제 영역으로 나뉘어져있어서 어느 부분에서 가치관이 잘 맞고, 어느 부분에서는 맞지 않는지 한번에 볼수있어요. ​ 새롭게 인연이 생겨 사귀게 되었거나 또는 결혼을 준비하고있는 연인이 카페에서 가볍게 테스트를 하며 서로에 대해 알아갈 수 있는 시간을 보내면 좋을 거 같아요!! ​ 지금 테스트 시작 버튼을 누르면 나의.. 2023. 2. 12.
웹사이트 다 만든 후 검색최적화 적용하기 내가만든 커플테스트 웹사이트 : https://www.couple-quiz.com 재미로보는 결혼테스트 재미로보는 결혼테스트 함께보는 모의시험을 통해 서로의 심리에 대한 이해 완료 www.couple-quiz.com 1. robots.txt만들기 User-agent: * Allow: / 넥스트에서 위치 : 2. 메타테그 달기 3. 네이버 웹마스터도구에 등록 https://searchadvisor.naver.com/console/board 네이버 네이버에 로그인 하고 나를 위한 다양한 서비스를 이용해 보세요 nid.naver.com 소유권 확인을 위해 메타테그에 추가한것 간단체크 결과 http는 검색로봇이 조회 못한다는데 https는 가능하다고 한다. https://searchadvisor.naver.co.. 2023. 2. 12.
노코드 툴 참고 버블 : https://bubble.io/showcase?ref=usecases-header 떵케블 : https://docs.thunkable.com/time-input 아웃칼마 : https://outkarma.org/ 글라이드 : https://go.glideapps.com/template/blp0mSEmMTUcRHRmNgeK-template/dl/da19fa/s/97d221/r/5RKkTRpQRk2PihTQB2mCSA?mdid=18630d96d8d635-0e257243a5f6f9-16525635-384000-18630d96d8e1d3e 2023. 2. 8.
nginx: [emerg] bind() to 0.0.0.0:80 failed 가 떴다.. 그리고 웃긴건 nginx 상태는 failed인데 접속이 되고 요청도 간다는 것이다. 누구냐넌!! 엔진엑스 상태를 보면 fail이라고 뜨는데 실행은 아주 잘되고있다. 아마도 루트권한하고 그냥 ubuntu계정하고 짬뽕해서 nginx를 써서 그런것 같다. 해결방법 : 80포트 누가 쓰고있는지 확인 : sudo netstat -anp | grep LISTEN | grep :80 => 엔진엑스가 쓰고있다고 나옴 80포트 사용하고있던 것들 죽임 : sudo fuser -k -n tcp 80 => 최후의 방법이었음. . 다시 nginx시작 : systemctl start nginx pm2를 쓰던 nginx를 쓰던 root권한에서 돌리지 말고 ubuntu권한에서 돌리는게 맞는가보다. 짧은 지식은 여기까지이니.. 일단 .. 2023. 2. 3.

티스토리툴바