강의

멘토링

커뮤니티

인프런 커뮤니티 질문&답변

bluescreen님의 프로필 이미지
bluescreen

작성한 질문수

실무 중심! FE 입문자를 위한 React

9-4. 프로젝트 세팅 및 환경설정

교육자료 소스 바로 실행시..

작성

·

36

·

수정됨

0

안녕하세요

문의드립니다.

 

일단 제공해 주신 소스를 풀어서

실행을 해 보았습니다.

(당연히 npm i...관련 module 설치 하고요)

터미널: npm run start를 실행하면

 

image.png

 

위와 같은 화면만 나오네요.

그리고 개발자 도구 내용을 보면

 

image.png

index.tsx ? .. 소스상에 파일이 없는데 궁금합니다.

일단 실행이 해서 개발 완료된 화면을 보고자 합니다.

실행하기 전에 선행 작업있나요?

(각 확장프로그램..등... )

가이드를 봐도 내용이..(제가 못찾은 건지.)

설명 부탁드립니다.

 

 


답변 1

0

안녕하세요, 인프런 AI 인턴입니다.

bluescreen님,

React 프로젝트를 실행하는 과정에서 여러 문제를 겪고 계신 것 같아 몇 가지 도움말을 드리겠습니다.

  1. 라우팅 문제: 화면에서 “No routes matched location ‘/‘”이라는 오류가 발생한다면, 이는 React Router 설정이 올바르지 않아서 발생하는 문제일 수 있습니다. routes 설정을 확인하고 index 페이지에 대한 경로를 올바르게 지정해 주셔야 합니다.

  2. index.tsx 파일: 보통 React 앱에서는 index.tsx 또는 index.js 파일이 메인 엔트리 포인트로 설정되어 있습니다. 이 파일이 없다고 명시되어 있다면 프로젝트의 폴더 구조를 다시 확인해 보시기 바랍니다. .tsx 파일이 없다면 .js 파일을 사용하고 있는지, 또는 프로젝트 설정에 문제가 없는지 확인해야 합니다.

  3. Pre-requisite: 보통 npm install 명령어로 필요한 모듈들은 이미 설치하셨겠지만, 사용 중인 컴포넌트 라이브러리나 설정 툴들이 적절하게 설치되어 있는지 확인하시기 바랍니다. ESLint, Prettier 같은 코드 형식화 도구가 종종 사용되니 재확인하셔도 좋습니다.

  4. 이미지 관련 오류: 첨부된 두 번째 이미지는 비동기식 처리 관련 오류를 보이고 있습니다. 이 경우 해당 코드 블록에서 Promise 처리 로직을 자세히 살펴보셔야 합니다. async/await 또는 .then/.catch를 통해 에러 핸들링이 제대로 되어 있는지 점검해 보세요.

위의 내용이 해결에 도움이 되기를 바라며, 문제 해결이 되지 않는다면 개발자 공동체 포럼이나, React 관련 공식 문서에서도 추가 도움을 받으시는 것을 추천드립니다. 추가적으로 React 공식 문서를 참고하시면 좀 더 자세한 설명을 얻으실 수 있습니다.

행운을 빕니다!

bluescreen님의 프로필 이미지
bluescreen

작성한 질문수

질문하기