문제점 리덕스를 적용한 간단한 리액트 프로젝트를 만들기 위해서 리덕스를 위한 코드를 준비하고 yarn start를 했지만 화면에 아무것도 나타나지 않았습니다. 이후 콘솔창을 열어보니 이런 에러가 떠있었습니다. 원인 import React from "react"; import ReactDOM from "react-dom/client"; import "./index.css"; import App from "./App"; import { createStore } from "redux"; import rootReducers from "./modules"; import { Provider } from "react-redux"; const store = createStore(rootReducers); ReactDO..
암만 생각해도 Mac OS는 저와 어울리지 않는 것 같습니다😮💨 리액트 실행하는 게 한 시간이나 걸렸습니다...(바본가...🌚) 거두절미하고 Mac OS에서 리액트 실행하는 방법을 상세하게 알아보겠습니다. 리액트를 실행하기 앞서 Mac OS에 node, npm, npx 등이 다 실행되는 환경이어야 합니다. 환경 설정을 하지 못하셨다면 아래 링크를 보시고 따라하시면 됩니다. Mac OS/Homebrew] 맥/맥북에서 brew 설치하는 방법 [Mac OS]env: node: No such file or directory 해결하기 폴더 만들기 터미널에 다음 명령어를 입력하여 폴더를 생성합니다. (아 물론 그냥 우클릭 후에 직접 폴더 생성하고 해당 폴더 경로 찾아서 실행해도 됩니다.) mkdir 생성할 폴더명..
리액트 Component에서 Font Awesome 사용하기 Font Awesome 패키지를 먼저 설치합니다. npm i @fortawesome/fontawesome-svg-core Font Awesome은 무료 버전 3가지를 사용할 수 있고, 3개 중 사용할 목적에 따라 설치합니다. solid npm i @fortawesome/free-solid-svg-icons regular npm i @fortawesome/free-regular-svg-icons brands 브랜드 로고를 사용하려면 따로 설치해줘야 합니다. npm i @fortawesome/free-brands-svg-icons React에서 사용 가능하도록 npm i @fortawesome/react-fontawesome 설치한 Font Awe..
리액트 리액트(React)는 오늘날 가장 인기 있는 프론트엔드 프레임워크 중 하나로, 타입 안정성과 관련해선 탁월한 선택이라 할 수 있습니다. 리액트 응용 프로그램의 기본 빌딩 블록인 리액트 컴포넌트는 TypeScript로 정의되고 소비되므로 안전합니다. 이는 다른 프론트엔드 프레임워크에선 찾아보기 힘든 특징으로, 컴포넌트 정의와 소비자 모두 타입을 검사함을 의미합니다. 덕분에 타입을 이용하여 "이 컴포넌트는 사용자 ID와 색을 인수로 받는다" 또는 "이 컴포넌트는 리스트 항목만을 자식으로 가질 수 있다"라고 표현할 수 있습니다. 타입으로 표현한 이러한 제한을 TypeScript가 강제하며 사용자의 컴포넌트가 이에 부합하는지 확인하는 것입니다. 그중에서도 컴포넌트 정의와 소비자에 제공하는 안전성은 독보적..
