React 프로젝트 시작 및 기록 배경

나는 2021년 여름방학 때, 교내에 있는 프로젝트 대회에 참가하기 위해 교내 친구들과 협업한 경험이 있다.

나는 사람을 만나는 것을 좋아하고 함께 협업하는 것을 좋아한다. 따라서 학교 안에서만 협업의 기회를 갖기엔 아쉬움이 컸다.

더 넓은 세상의 사람들을 만나 작업해보고 싶었다.

그렇게 나는 대외 동아리에 가입하게 되었다.

이번에 처음으로 react에 도전한다. 학교에서 배운 프로그래밍 언어가 아니라 온전히 내 힘으로 독학해야하는 이 상황은 정말 오랜만이다.

어디에서 좋은 정보를 얻을 수 있는건지, 어디서부터 시작해야하는건지 너무 막막했다.

행복하게도 다시 한 번 좋은 프론트엔드 파트너를 만났다.

우리는 모두 처음 react를 다룬다. 처음은 어렵겠지. 하지만 이번에도 해낸다. 어려움의 기록을 남기고자 글을 쓴다.

모조리 기록하고 말테야!

서버와 클라이언트 연동의 오류 문제

리액트를 시작하면서 클라이언트(create-react-app)를 생성했고

서버(express)를 구축했습니다.

이제 이 두 가지의 연동이 필요했다.

개념

연동은 Webpack을 사용해주어야한다고 한다. Webpack은 여러개의 파일을 하나의 js파일로 묶어준다. Webpack은 빠른 로딩 속도와 높은 성능을 도와주기에 필요하다고 한다.

webpack 실행하려면, 프로그램이 (자세한 동작을 명시한) script 폴더를 숨긴 것을 풀기 위해 eject한다.

*eject는 한 번 실행하면 되돌릴 수 없다고 한다.

eject 실행코드

npm run eject

출력

√ Are you sure you want to eject? This action is permanent. ...

아까 이야기한 것처럼 eject는 한 번 실행하면 영구적이기에 확인 절차가 있는 듯 하다.

두근거리는 마음으로 Y를 입력했다…

Y를 입력한 후(오류발생)

Remove untracked files, stash or commit any changes, and try again.

오류가 발생했다.

방법을 찾아보니 커밋이 필요하다고 했다.

git add .
git commit -m "commit message"\

커밋이라고 해서 집에 있는 D it 깃 책도 다시 살펴보고 탐구하고 연구했는데…

간단하게 두줄로 문제가 해결되었다.

역시 역경은 즐거워