탁월함은 어떻게 나오는가?

리액트 정의 : Virtyal DOM은 무엇인가? Virtual DOM(VDOM)은 UI의 이상적인 또는 "가상"적인 표현을 메모리에 저장하고 ReactDOM과 같은 라이브러리에 의해 "실제" DOM과 동기화하는 프로그래밍 개념이다. 이 과정을 재조정(Reconciliation)이라고 한다. 이 접근방식이 React의 선언적 API를 가능하게 한다. React에게 원하는 UI의 상태를 알려주면 DOM이 그 상태와 일치하도록 한다. 이러한 방식은 앱 구축에 사용해야 하는 어트리뷰트 조작, 이벤트 처리, 수동 DOM 업데이트를 추상화한다. "virtual DOM"은 특정 기술이라기보다는 패턴에 가깝기 때문에 사람들마다 의미하는 바가 다르다. React의 세계에서 "virtual DOM"이라는 용어는 보통 사..

공부용으로 직역해놓은 정보입니다. 직역이 틀린 부분이 있다면 지적 감사히 받겠습니다. Mysql에서 빠른 페이지네이션 - Limit와 Offset을 사용하면 Order By가 느린 이유는? Limit와 Offset이 포함된 쿼리는 페이지네이션이 필요한 애플리케이션에서 일반적으로 쓰이며 경우에 따라서는 한동안 잘 작동한다. 하지만 많은 경우에 Offset이 높은 값을 가지면 느리며 고통을 가져온다. OFFSET은 왜 느릴까? 많은 케이스에서 낮은 오프셋 쿼리는 느리지 않다. 문제는 높은 오프셋 값으로 시작된다. 쿼리의 리미트 절: "LIMIT 50000, 20" 을 사용한다면, 그것은 실제로 50,020행을 요청하고 처음 50,000 행을 삭제 요청을 한다. 이 작업은 높은 비용과 충격적으로 느린 응답의 ..

프로젝트를 진행하면서 리액트(REACT)에서 배열에 빈배열이 아닐경우에 동적으로 테이블을 그려주는 작업을 진행하고 싶었다. 하지만, 오랜만에 진행하려고 하니 헷갈려서 잃지않기 위해 적어놓기로 했다. 사람은 정말.. 망각의 동물인듯.. 동적으로 그리기 위한 코드 : 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 {/* 보유 종목 */} {assetArr.length === 0 ? ( "" ) : ( 종목명 보유 수량 매수 가격 총 매수금액 비중 {assetRate.map((el) => { return ( {el.stock} {el.stock_ho..

프로젝트를 진행하면서 axios를 사용해서 백(Nodejs)와 프론트(React)를 통신하는 와중에 필요한 통신부분에서 .then이 안되는 현상이 발생했다. 다른 통신부분은 정상적으로 .then이 되는데 이부분이 안되는 부분을 이해할 수 없어서 여러가지 테스트와 검색을 해보는데, 그러던 중 실수를 발견해서 나중에는 이런 실수를 조기에 잡기 위해 적어놓기로 했다.... 문제의 코드 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 // promise 되는 코드 export const UserSignupDataAPI = (states) => client.post(backUrl + "/users/signup", states); // promise 되는 코드 export const UserS..

웹용 스토리지를 찾게 된 개요 : 개발을 하고 있는 도중에 쿠키(Cookie)를 사용할 일이 있는데, 로컬스토리지(LocalStroage)를 사용할까 세션스토리지(Session Storage)를 사용할까 아니면 다른걸 사용해볼까 하고 검색하다가 보니, 중 구글 크롬(Google Chrome) 팀 개발자의 글을 봤고, 좋은 글인것 같아서 나중을 위해서 필요한 내용만 정리해놓기로 했다. 본문 : 웹용 스토리지 https://web.dev/storage-for-the-web/ 웹 스토리지(브라우저에 데이터를 저장하는 방법)은 다양하다. 하지만 인터넷 연결은 이동 중에 불안정하거나 끊길 수가 있다. 완벽한 무선 환경에서도 캐싱 및 기타 스토리지 기술을 적절하게 이용하면 사용자 경험을 크게 향상 시킬 수 있다. ..

리액트를 사용하면 두가지 스타일로 컴포넌트를 작성할 수 있다. 클래스와 함수 스타일로 작성이 가능한 것이다. 실제로 초기에는 상태를 조작할 수 있는 클래스(Class) 컴포넌트가 대세였으며, 함수(Function) 컴포넌트는 훅(hook)기능이 추가가 되면서 컴포넌트의 작성의 대세는 변하게 되었다. 여기서 우리가 알아야 하는 점은 함수형 컴포넌트는 틀린말이고, 함수 컴포넌트가 맞는말이라는 것이다. 그렇다면 중요한건, 우리는 흔하게 함수형(Functional) 컴포넌트라고 부르지만, 과연 함수형 컴포넌트라고도 부르는것은 적절한것일까?? 밑에 이미지는 구글의 검색 결과이다. 이런 의문점까지 도달했다면 우리는 함수형 컴포넌트가 무엇인지 생각해 봐야할 것이다. 나는 개인적으로 내가 잘모르는것은 나보다 뛰어난 사..

유니코드란? 유니코드는 국제적으로 전 세계 언어를 모두 표시할 수 있는 표준코드이다. 유니코드의 목적은 현존하는 문자 인코딩 방법들을 모두 유니코드로 교체하려는 것이다. 기존의 인코딩들은 다국어 환경에서는 서로 호환되지 않아 한정된다는 문제점이 있었다. 그래서 유니코드를 사용하게 되었다. 유니코드는 전 세계의 든 문자를 컴퓨터에서 일관되게 표현하고 다룰 수 있도록 설계된 표준 코드이다, 유니코드는 2바이트, 즉 16비트를 사용해 2^16가지(65536)를 표현할 수 있다. UTF(Unicode Transformation Format)의 약자이며, UTF-8, UTF-16은 UTF에 포함된다. UTF-8은 유니코드를 인코딩하는 방식이다. UTF-8인코딩은 유니코드 한 문자를 나타내기 위해 1바이트에서 4바..

위의 에러가 발생할때에 대한 해결방법은 구글에서 검색해보면 '한글이라서' 에러를 던져주는 것이다. 해결방법은 my.cnf 에 가서 1 2 default-character-set=utf8 default-collation-utf8_general_ci cs 추가하는 방법에 대해서 적혀있다. 해결방법 : 하지만, 나는 되지 않았다.... 그래서 찾아보던 중 heidisql에서 테이블 컬럼 중 [ 조합 ] 에서 [ armscii8_bin ] 을 발견했다. armscii8_bin 을 utf8로 변경하고 싶었지만 찾지못해서 utf16_general_ci로 변경했더니 정상작동하게 됬다.