개발(250)
-
배포순서
배포는 파일을 다 옴기고 뒷단부터 천처니
2024.03.15 -
useLayoutEffect를 언제 사용해야 할까?
요소의 실제 크기에 따라 UI를 조정해야하기 때문에 발생하는 시각적 "결함"을 제거해야하는 경우에만 useLayoutEffect를 사용하세요. 다른 모든 경우에는 useEffect를 사용하세요. 그리고 이펙트가 필요하지 않을 수 있습니다. 출처: https://velog.io/@tap_kim/no-more-flickering-ui?utm_source=substack&utm_medium=email (번역) "깜빡이는" UI를 거부하세요. useLayoutEffect, 페인팅 그리고 브라우저 이야기 DOM 측정값을 기반으로 요소를 변경하는 방법에 대해 살펴봅니다. useEffect의 문제는 무엇이며, 그 문제를 useLayoutEffect로 어떻게 해결하는지, 브라우저 페인팅이 무엇이며, 여기서 SSR은 어..
2024.03.15 -
sql 반복문으로 년도 만들기
sql 에서 join을 위해 년도 테이블을 읨의로 만드는 방법 SELECT T.date AS 'year', COUNT(r.issue_de) AS year_count FROM ( SELECT DATE_FORMAT(DATE_SUB(CURDATE(), INTERVAL seq - 1 YEAR), '%Y') AS date FROM ( SELECT @num := @num + 1 AS seq FROM information_schema.tables a , information_schema.tables b , (SELECT @num := 0) c ) seq_table WHERE seq
2024.03.12 -
그래프 비교하기
년도별 스택차트 옆에 일반 바 차트 만들기 https://www.amcharts.com/ JavaScript Charts & Maps - amCharts JavaScript charts and maps data-viz libraries for web, dashboards, and applications. Fast and flexible. React/Angular compatible. Since 2006. www.amcharts.com https://nivo.rocks/ Home | nivo nivo.rocks https://plotly.com/javascript/ Plotly A plotly.com 다 원하는 구현이 쉽게 안된어서 최종적으로 https://recharts.org/en-US 이걸로 결정
2024.03.12 -
Map {}
Map이란? Map은 key-value 형태로 데이터를 저장하는 자료구조이며, key 값을 통해서 데이터를 검색, 저장, 삭제한다. 이 때, map은 중복된 key 값은 허용되지 않는다. 예를 들어, 전화번호부의 경우 같은 전화번호에 여러 이름은 저장되지 않는다. 따라서 전화번호를 key 값으로, 이름을 value로 map에 저장하면 된다. Dictionary란? Dictionary는 기본적으로 map과 같이 key-value 형태로 데이터를 저장하지만, map과 달리 중복된 key 값이 허용된다. 예를 들어 단어 사전의 경우 하나의 단어에 여러 가지 뜻이 있을 수 있다. 따라서 단어를 key 값으로, 단어의 뜻을 value로 dictionary에 저장하면 된다. 성능도 일반적으로 Map 이 더 좋다. ..
2024.03.07 -
2019 카카오 개발자 겨울 인턴십
호텔 방 배정 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr function solution(k, room_number) { var answer = []; var room = [] for (i= 0 ; i { if(room[i-1] == false){ answer.push(i) room[i-1] = true } else { let j = i if(i > min && ..
2024.03.07 -
PRI key 관리하기
사건의 발단 어라 ? DB중에 ID 값이 없는 녀석을 발견했다. 질문은 주임의 특권 '과장님 이거 오토인크리먼트로 바꿔두 될까요? ' 결론만 놓고보면 바꿔두 된다. 우리가 DB를 작업 같이 하고 있기때문 단! 여러가지 고려해야 한다. 1. 다른 디비들 과의 통일성 - 프로젝트 마다 관리하고 있는 방법이 다르므로 이거한번 채크 해볼것 2. 산출물 > 코드 3줄 줄이기위해 오토 인크리먼트 추가했다가 산출물 10개를 다 바꾸러 찾으러 다녀야 할 수고 있습니다. 3. 개발자가 바꿀수 있는 환경인가? 4. 만약 db가 변경 될 가능성은? 오라클이 마리아 혹은 다른 디비로 바뀌게 되었을때 재공해 주는 기능인가? 그렇다면 그떄 수정해야 할 코드 량은? 그다음에 성능과 방법을 탐구 1. get으로 가져온 다음 없는 값..
2024.02.22 -
InfluxDB와 Elasticsearch
InfluxDB: 장점: InfluxDB는 순수하게 시계열 데이터를 위해 설계된 데이터베이스로, 이러한 유형의 데이터를 처리하는 데 특화되어 있습니다. 데이터 쓰기 및 조회 성능이 뛰어납니다. 또한 자동화된 복제와 샤딩 기능을 제공하여 확장성을 보장합니다. SQL과 유사한 쿼리 언어를 제공하여 사용자가 쉽게 데이터를 쿼리할 수 있습니다. 단점: 비교적 새로운 시스템이므로, 일부 버그나 문제가 여전히 존재할 수 있습니다. 시계열 데이터 외의 다른 데이터 유형을 처리하는 데는 적합하지 않을 수 있습니다. 비교적 커뮤니티 지원이 덜 활성화되어 있습니다. Elasticsearch: 장점: Elasticsearch는 풍부한 검색 기능을 제공하며, 전문 검색 및 텍스트 분석에 탁월합니다. 분산 시스템으로 설계되어 ..
2024.02.14 -
상태 관리 순위 와 Zustand 예시
이거 좀만 만지면 리덕스로도 구현 가능할지도?
2024.02.08 -
useRef vs window.addEventListener when onKeyDown in div
1번 ref 로 닫기 기능 // 메뉴가 열리면 메뉴에 포커스 const menuRef = useRef(null); useEffect(() => { if (menuRef.current) { menuRef.current.focus(); } }, []); return ( e.key === 'Escape' && setMenuOpen(false)} /> 2번 useEffect로 닫기 기능 useEffect(() => { const handleKeyDown = (event) => { if (event.key === 'Escape') { setMenuOpen(false); } }; window.addEventListener('keydown', handleKeyDown); return () => { window.rem..
2024.01.30