React 프로젝트에서 이미지를 사용할 때 이미지가 public 폴더에 있는지, src 폴더에 있는지, 또는 jsx 파일에서 사용하는지, css에서 사용하는지에 따라 경로 설정하는 방법을 구분하고자 한다. 📂 public 폴더는 에 의해 관리되지 않고, 대신 원본이 폴더에 복사된다. (minify되지 않고, content hash가 포함되지 않는다.) 폴더에 접근하기 위해서는 환경변수를 사용해야 한다. 경로가 잘못 되었거나 파일이 없는 경우 컴파일 단계에서 에러가 발생하지 않고, 404에러가 발생한다. 🚫 CRA 문서에서 다음과 같은 경우에만 폴더에서 관리하는 것이 유용하고, 이외에는 폴더 관리를 추천한다. 처럼 build된 결과물에서 특정한 파일 이름이 필요한 경우 수천개의 이미지 파일을 동적으로 참조해야 하는 경우 📂 src 파일을 찾지 못하는 경우, 컴파일 단계에서 에러를 잡을 수 있다. ✅ import 할 경우 참조할 수 있는 경로(path) 문자열을 출력한다…

프로젝트 생성 Router 을 이용한다. 👉 공식문서 각 컴포넌트별 route는 다음과 같이 컴포넌트를 불러오고, 해당 컴포넌트의 path를 설정해줄 수 있다. 애플리케이션 구조 실시간으로 반영되는 Real time 애플리케이션의 경우 주로 모듈을 이용한다. Firebase도 websocket을 이용하여 실시간 데이터를 반영하여 보여줄 수 있다. ❓ REST vs. Websockets Rest 방식의 경우 A가 B에게 메시지를 보낼 경우 refresh가 되어야 데이터를 받을 수 있다. 하지만 Websocket을 이용하는 경우 refresh가 되지 않아도 B는 즉각적으로 메시지를 확인할 수 있다. Firebase Google에서 개발된 것으로 데이터베이스, 스토리지, 인증, 푸시 알림, 배포 등 대부분의 앱을 만들 때 필요한 기능들을 자동으로 만들어주는 플랫폼이다. Firebase에서 사용하는 데이터베이스는 Mysql이나 오라클 같은 관계형 데이터베이스가 아닌, MongoDB 같…