(ToDoList 실습) ! 연산자에 대해

삼항연산자를 보면 clickedId 가 참일 때, 기존 aTodo 객체를 그냥 리턴하고거짓일 때 기존 aTodo 객체에서 todoDone 의 값을 ! 을 이용해서 boolean 값을 반대로 설정하여 새로운 aTodo 객체를 반환하도록 하고 있습니다. !true -> false , !false -> true

tailwindcss를 vite에서 이용하는 방식이 바뀐것 같습니다.

tailwindcss v4.0 이 되면서 vite에서 사용 방식이 바뀐것으로 보입니다.이전 tailwindcss v3.x 를 설치하여 사용하려면 다음과 같이 하시면 됩니다.# 1. vite로 리액트 프로젝트를 생성합니다. npx create-vite@latest my-project --template react cd my-project npm install # 2. Tailwind CSS v3.x를 설치합니다. npm i -D tailwindcss@3 postcss autoprefixer npm tailwindcss init -ptailwind.config.js 파일 설정/** @type {import('tailwindcss').Config} */ export default { content: [ "./index.html", "./src/**/*.{js,ts,jsx,tsx}", ], theme: { extend: {}, }, plugins: [], }./src/index.css 파일 수정@tailwind base; @tailwind components; @tailwind utilities;

빨간 밑줄 질문이요..

props 에 빨간줄은 해당 파라미터를 컴포넌트 안에서 사용하지 않고 있기 때문에 나오는 eslint 에러표시입니다. 컴포넌트 내에서 사용하지 않으면 props 를 제거하시거나.다음 강의에서 해당 props를 호출하는 내용이 있으면 빨간줄은 자연히 지워질 겁니다. 혹시 props를 사용해도 props 에 빨간줄이 나오면 eslin.config.js 파일 또는 eslintrc 파일 rules 부분에 "react/prop-types": "off" 옵션을 추가해 주세요. PS: JSX 문법에서는 class 속성은 className 이라고 표기하는 게 맞습니다.이유는 자바스크립트에 class 키워드는 예약어라서 class 속성으로 사용할 수 없어요.

vite를 통해 프로젝트 생성 시 React Router 는 무엇일까요?

나중에 react-router, react-router-dom 패키지 설치할 때 따로 설치하지 않아도 되는 경우입니다.리액트 라우팅 , 페이지 라우팅 배우실 때 아실 겁니다.

jsx 실습 관련 오류 npm start를 해도 강사 화면처럼 안떠요.

npm start 실행하려는 폴더 내에 package.json 을 읽을 수 없다는 오류입니다.npm install 로 노드 모듈 패키지를 설치하지 않았거나, package.json 파일이 없는 경로에서 프로그램을 실행하려고 해서 그런 것으로 보입니다.

npx create-react-app my-app 명령어 반응없음

vite 빌드 도구를 이용해 보세요.# 리액트 프로젝트 생성 npm create vite@latest my-react-app -- --template react # 해당 프로젝트 폴더로 이동 cd my-react-app # 관련 패키지 설치하기 npm install # 리액트 프로젝트 실행 npm run dev

create-react-app my app 실행 시 에러

react@19.0.0 가 @testing-library/react@13.4.0 와 호환성 충돌하는 이슈가 있습니다. 이 오류가 수정되기 전까지는 안될것 같습니다. (create-react-app 지원 중단이라..)다른 대안으로 yarn 으로 설치 방법과, vite 빌드 도구로 설치하는 방법을 사용하세요.npm i -g yarn yarn create react-app cd yarn startnpx create-vite@latest --template react cd npm install npm run dev

Failed to load module script 에러가 뜹니다

혹시 jsx 문법이 들어간 컴포넌트 파일의 확장자가 .js 인가요?그렇다면 .jsx로 변경해 보세요. vite 개발 환경에서는 jsx 를 반환하는 코드 파일은 반드시 확장자가 jsx 이거나 타입스크립트 에서는 tsx 로 되어 있어야 합니다.

npx create-react-app mall 에러가 납니다

React 가 19버전이 되면서 npx create-react-app 으로 프로젝트 생성 시 오류가 발생하고 있네요.CRA 깃허브 사이트에서도 해당 이슈에 따른 질문이 많습니다.이것에 대한 해결방법은 yarn 으로 create-react-app 을 설치하거나 vite 를 사용하여 설치하는 것을 권장하고 있습니다.npm install --global yarn yarn create react-app my-project-app cd my-project-app yarn startnpx create-vite@latest my-project-app --template react cd my-project-app npm install npm run start

제가 뭐 건들었는지 안되네요 이유를 알 수 있을까요?

임포트 할 때 익스포트 디폴트 한 컴포넌트나 함수를 제대로 임포트했는지 확인해 보세요.임포트 시 익스포트한 컴포넌트가 default 가 붙고 안붙고에 따라 불러오는 형식이 다릅니다.