React

페이지의 새로고침 없이도 주소의 변경이 가능하고, 현재 주소의 정보들을 props를 통해 활용이 가능하다.pushState, replaceState, popstate event 등, HTML5의 History API를 사용하여 URL과 UI를 동기해줌위 코드에서는 컴

jsx의 기본형식:형태와 같이, java + HTML의 형태를 구사하고 있다. 마지막 줄의 ‘export default App;’이라는 구문을 통해 App함수를 추출하고, 메인 렌더링을 담당하는 index.js를 비롯한 다른 여러 component 소스들에서 이 Ap

한 페이지를 구성하게 되는 작은 구성요소.장점:코드의 양이 줄어듦개발 시간이 줄어듦유지보수가 간편해짐예시: hello와 world라는 component로 App.js를 구성하기props: 부모 component에서 자식 component로 전달되는 ‘읽기 전용’의 입력

Hook: 여러 컴포넌트 중 function이 class를 사용할 수 있도록 도와주는 기능.useEffect: useEffect(() ⇒ {함수}, state or data값)의 형태로, 렌더링 때마다 특정한 작업을 하게 도와준다.=⇒ 페이지를 렌더링(mount)할 때

React는 JavaScript처럼 Camel Case 형태로 함수를 전달해줌.HTML의 경우에는 Camel Case가 아닌, 소문자 onclick에 실행함수를 넣는다.onClick: 마우스 버튼을 ‘클릭’했을 때 발생 (Down + Up)onMouseDown: 마우스

브라우저 밖에서도 서버 구축 등의 javascript를 실행할 수 있게 해주는 런타임 환경.오픈소스 Javascript 엔진인 Chrome V8을 기반으로 동작.Single-Thread의 non-blocking I/O 이벤트 기반의 ‘Async’ 방식. 즉 시간이 오래

왼쪽 사이드바에서는 현재 등록된 메모의 목록이, 오른쪽 메모 편집에서는 제목과 내용을 수정할 수 있는 입력 폼.사이드바 구조: SideBarHeader, MemoList(MemoItem), SideBarFooter메모 편집 구조: MemoContainer(MemoTit

프로젝트를 진행하면서, DB에 저장된 텍스트와 이미지를 불러와야 하는데, 텍스트는 정상적으로 출력되지만 이미지가 출력되지 않는 이슈가 발생했다.문제는 텍스트의 경우 Unicode 형식 그대로 MongoDB에 저장되어 있었지만, 이미지의 경우 Flask 서버에서 Base

Debounce란, 굉장히 짧은 시간에 발생되는 작업들이 아닌, 일정한 시간 간격을 두고 그동안 일어난 모든 결과들을 한 번의 호출로 처리하는 것을 의미한다.일반적으로 많은 양의 데이터가 있고 이를 브라우저 상의 사용자가 탐색하는 과정이 있다면, 순간 순간의 탐색마다