일상지식 더하기

좀 힙(?)하게 GUI로 데이터 확인을 해보도록 Redis Insight 까지 설치해보자. 우선 Redis Insight를 간단하게 훑어보고 갈까?Redis Insight는?Redis 데이터베이스를 시각화하고 관리하기 위한 강력한 도구다.데이터 시각화Redis에 저장된 데이터를 시각적으로 탐색하고 관리할 수 있다.키와 값의 구조를 시각적으로 표현하여 데이터의 상태를 쉽게 이해할 수 있다. 쿼리 및 데이터 관리RedisInsight를 통해 복잡한 쿼리를 작성하고 실행할 수 있다.이를 통해 데이터를 빠르고 쉽게 검색하고 수정할 수 있다. 성능 모니터링Redis 서버의 성능을 실시간으로 모니터링할 수 있다.주요 성능 지표를 그래프로 시각화하여 서버의 상태를 파악하고, 잠재적인 성능 문제를 조기에 발견할 수 있..

Redis는 높은 성능, 다양한 데이터 구조 지원, 고가용성, 데이터 지속성, 다양한 사용 사례, 활발한 커뮤니티 및 생태계를 제공하기 때문에 많은 개발자와 기업에서 선호된다. 이러한 특성들은 다양한 애플리케이션 요구사항을 충족시키고, 시스템의 성능과 효율성을 높이는 데 큰 도움이 된다. Redis를 가지고 무얼하나?캐싱: Redis는 매우 빠른 데이터 액세스를 제공하므로, 웹 애플리케이션의 데이터 캐시로 널리 사용된다.세션 저장소: 사용자 세션 데이터를 저장하고 관리하는 데 적합하다.실시간 분석: 실시간 데이터 분석 및 처리 요구사항을 충족할 수 있다.메시지 큐: Pub/Sub 모델을 통해 메시지 큐 및 스트리밍 데이터 처리에 사용될 수 있다. 시작이 반이니, 우선 설치부터 해보자. Downloads공..

#Lodash Document Lodash Documentation_(value) source Creates a lodash object which wraps value to enable implicit method chain sequences. Methods that operate on and return arrays, collections, and functions can be chained together. Methods that retrieve a single value or may return a primitilodash.com 지난 번에 lodash를 사용하여 배열의 중복을 제거하는 방법을 알아봤는데, 이번에는 lodash를 이용하여 초간단 배열 정렬하는 방법에 대해서 알아볼까 한다. 지난 번..

api에서 처음부터 데이터를 묶어서 전달해주면 좋겠지만,api에서 하는 일이 많거나 해당 데이터를 난잡하지 않고, 간결하게 등등 여러가지 이유로 화면에서 데이터를 묶어서 처리를 해야 할 때,reduce를 사용하여 묶는 방법에 대해서 알아보겠다. 예제const list = [{word: '가', no: 1}, {word: '나', no: 3}, {word: '나', no: 2}]const rtnList = list.reduce((acc, val) => { const { word, no } = val; if (!acc[word]) acc[word] = []; acc[word].push(no); return acc;}, {});// { 가: [1], 나: [3, 2] } 배열 내, 중복제..

간혹 영문자를 입력해야 하는 상황에서 한글로 되어 있어서 한글로 써진 매우 안타까운 상황이 발생하곤 한다.누가 옆에 있다면, "한글한글"을 외쳐본 적이 있다거나 외침을 받아본 적이 있을 것이다.그래서 준비해봤다.바로 치환할 수도 있겠지만, 한글을 입력해야 하는 상황도 있을 수 있으니 유틸로 한번 만들어봤다.모든 케이스를 적용하진 못했지만, 이렇게도 할 수 있다는 걸 보여주기 위해 작성해봤다.해당 예제는 react로 작성했지만, ref로 dom을 받아서 처리한 부분을 제외하곤 거부감이 없으리라 생각된다.    1 import { useRef } from 'react';    2     3 const ConvertUtils = () => {    4   const inputRef = useRef();..

JavaScript에서 배열을 정렬하는 방법은 Array.prototype.sort() 함수를 사용한다. 해당 함수는 배열의 요소를 정렬할 때, 기본적으로 요소를 문자열로 변환하고 유니코드 코드 포인트 순서로 정렬한다. 보편적인 예제// test list const list = [ { data: '가', seq: 2 }, { data: '나', seq: 1 } ]; // 오름차순 정렬 list.sort((a, b) => a.seq - b.seq); // 결과: [{data: '나', seq: 1}, {data: '가',seq: 2}] // 내림차순 정렬 list.sort((a, b) => b.seq - a.seq); // 결과: [{data: '가', seq: 2}, {data: '나',seq: 1}]위..

list 내 object 형태로 된 데이터의 중복을 제거하기 위해 lodash를 사용해보자. 테스트 환경npm,  react <span style="font-f..

defer는? 웹 페이지의 스크립트 실행을 지연시키는 데 사용한다. 이를 통해 HTML 문서의 파싱이 진행되는 동안 스크립트가 실행되지 않고, 문서의 구성이 완료된 후에 스크립트가 실행되어 페이지 로딩 성능을 향상시키고, 스크립트의 실행이 다른 자원들에 미치는 영향을 최소화하는 데 도움이 된다. 사용 방법 defer 사용 유무 차이점 사용하지 않을 때, 스크립트가 문서 파싱 중에 다운로드되고 실행되기 때문에, 스크립트의 실행이 완료될 때까지 페이지의 로딩이 중단된다. 스크립트가 실행되는 동안에는 페이지에서 다른 동작이 차단될 수 있다. 사용하게 되면, 스크립트가 문서 파싱 중에 비동기적으로 다운로드되지만, 파싱이 완료된 후에 순서대로 실행된다. 페이지의 로딩이 중단되지 않으며, 스크립트가 실행되는 동안에..

부모 컴포넌트 내 자식 컴포넌트 호출부 자식 컴포넌트 선언부 // ... const Component = () => { const { a, b, ...rest } = props; // ... } 컴포넌트 내 props에서 부모에서 보내지 않은 값을 받는 부분이 보인다. 뭐하는 앨까? ...rest 부모 컴포넌트로부터 전달된 모든 속성을 담은 객체를 받을 수 있다. 자식 컴포넌트에서는 다음과 같이 ...rest를 이용하여 모든 속성을 받을 수 있다. const Component = ({ a, b, ...rest }) => { // a와 b는 직접 사용 가능 // ...rest에는 c와 같은 추가 속성이 들어있다 return ( A: {a} B: {b} {/* ...rest를 통해 동적으로 처리할 수 있는 ..

기본date 편현재 기준으로 날짜를 계산하고 싶을 때-- 일자 계산 select now() + '1 day'::interval select now() - '2 day'::interval select now() + '-3 day'::interval -- 주 계산 select now() + '4 week'::interval select now() - '5 week'::interval select now() + '-6 week'::interval -- 월 계산 select now() + '7 month'::interval select now() - '8 month'::interval select now() + '-9 month'::interval string 편-- 문자 합치기 select concat('a'..