profile image

L o a d i n g . . .

해결 방법

  1. 가장 빠른 건 우분투 새로 설치하고 아래의 절차 따라가기
  2. 모든 기존 패키지가 최신 상태여야 해서 운영체제를 업데이트 한다.
    터미널에 sudo apt update && sudo apt upgrade -y 입력
  3. ReactJS 앱을 만들고 실행시키기 위해서 Node.js 를 설치한다.
    만약 curl 이 설치가 안 되어 있다면 sudo apt-get install curl 입력하여 설치
    그 다음 curl -sL https://deb.nodesource.com/setup_18.x | sudo bash - 입력
  4. 설치 후 sudo apt install nodejs 입력
  5. node -v, npm -v 를 입력하여 각각 버전 확인
    // node:  v18.15.0, npm: 9.5.0
  6. ReactJS 패키지 설치하기 위해서
    sudo npm install -g create-react-app 입력
    create-react-app 이 잘 설치 되었는지 확인하기 위해 create-react-app --version 입력
    // 5.0.1 이 출력되어야 함
  7. React 앱을 만들기 위해서
    sudo create-react-app (원하는 앱 이름) 입력
    아래와 같은 글이 출력된다면 성공한 것
    만약 Permisson Denied 가 뜬다면 sudo su 로 root 로그인 한 후, cd (원하는 앱 이름) 입력하여 원하는 폴더에 진입하고, npx create-react-app (원하는 앱 이름) 입력하면 됨
Success! Created myreactapp at /home/react/myreactapp
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd myreactapp
  npm start

Happy hacking!

    8. 7번에서 원하는 앱 이름을 입력한 폴더로 이동

        cd (원하는 앱 이름)

        이후 npm start 입력하여 실행하고 아래와 같은 글이 뜬다면 성공한 것

Compiled successfully!

You can now view myreactapp in the browser.

Local: http://localhost:3000
On Your Network: http://192.168.1.100:3000

Note that the development build is not optimized.
To create a production build, use npm run build.

        만약 실행되지 않는다면 권한 문제일 수 있으므로 sudo npm start 입력할 것


문제 해결 흐름

 

우분투 설치후에 React-nginx 구동을 위해서 먼저 React를 설치하려 했는데 cb.apply is not a function 에러가 떴다.

https://velog.io/@dongzooo/Node-js-error-cb.apply-is-not-a-function-%EC%97%90%EB%9F%AC-%ED%95%B4%EA%B2%B0%EB%B0%A9%EB%B2%95

 

Node js error : cb.apply is not a function 에러 해결방법

✨ my sql 과 Nodejs를 연결과정에서 다양한 패키지 설치다 필요하다! 하지만 npm install을 할 때 위와 같은 설치 에러를 맞이하게 될 수 있다.cb.apply is not a function 위와 같은 에러는 node의 npm 폴더와 npm

velog.io

위에 글에 나와있는대로 시도 해봤다.

 

  1. 에러 설명에 나와있는 디렉토리로 이동하여 폴더 삭제
    (나 같은 경우는 가상머신에 설치한거라서 C 드라이브가 아닌 /home/(사용자 계정)에 있었는데 
    (사용자 계정) 폴더 아이콘이 보이지 않아서 폴더에 우클릭 해서 [Show Hidden Files] 를 클릭 했더니 (사용자 계정) 폴더가 보였다.
  2. 터미널에서 에러 로그에 뜬 디렉토리로 이동
  3. cache clear 해주기

그런데 2번에서 막혔다. 사용자 폴더는 있었지만 에러 로그에 뜬 디렉토리가 존재하지 않았다.

2시간동안 끙끙대다가 처음으로 돌아가는게 빠를 듯해서 다시 우분투 설치했다...

 

https://www.linuxtuto.com/how-to-install-reactjs-on-ubuntu-22-04/

 

How to Install ReactJS on Ubuntu 22.04 - LinuxTuto

React (also known as React.js or ReactJS) is an open-source JavaScript front-end library for creating web frontend and UI components.

www.linuxtuto.com

이후에 정보를 찾다가 이 글에 써진대로 차근차근 따라해봤더니 드디어 리액트 구동 성공!

중간에 Permisson Denied가 떴지만

https://2vup.com/ubuntu-react-error/

 

[Ubuntu] React 프로젝트 생성하기

🤦‍♀️ Ubuntu React 설치 오류 Ubuntu에 React 프로젝트를 생성하던 중 오류를 발견하였습니다. 오류의 내용은 다음과 같습니다. 뜯어 보면 눈에 띄는 오류들이 있습니다. (node:719650) UnhandledPromiseReje

2vup.com

해당 글을 참고해서 root 사용자로 로그인하여 구동을 원하는 폴더에 진입해서 npx create-react-app (원하는 앱 이름)을 입력했더니 잘 생성되었다.

 

누군가에게는 쉬운 일이었겠지만 나한테는 리액트 구동이 너무 어려웠다..


참고

1. https://velog.io/@dongzooo/Node-js-error-cb.apply-is-not-a-function-%EC%97%90%EB%9F%AC-%ED%95%B4%EA%B2%B0%EB%B0%A9%EB%B2%95

2.https://www.linuxtuto.com/how-to-install-reactjs-on-ubuntu-22-04/

3. https://2vup.com/ubuntu-react-error/

복사했습니다!