웹사이트 검색

Ubuntu 20.04에서 JS 기반 애플리케이션용 MERN 스택을 설치하는 방법

이 페이지에서

  1. 전제 조건
  2. 시작하기\n
  3. MongoDB 서버 설치
  4. MongoDB 관리자 생성
  5. Node.js 설치
  6. React.js 설치
  7. Express.js 설치
  8. 결론

MERN 스택은 MongoDB, Express, React 및 Node의 네 가지 구성 요소로 구성됩니다. 동적 JS 웹 사이트 구축에 사용되는 JavaScript 기술 번들을 제공합니다.

MongoDB는 오픈 소스이며 강력한 웹 애플리케이션 개발에 사용되는 가장 널리 사용되는 NoSQL 데이터베이스 시스템입니다. Express.js는 하이브리드 웹 기반 애플리케이션 개발에 사용되는 Node.js 웹 애플리케이션 프레임워크입니다. React.js는 모바일 애플리케이션용 프런트 엔드 인터페이스를 만드는 데 사용되는 오픈 소스 JavaScript 프레임워크입니다. Node.js는 개발자가 서버에서 코드를 실행할 수 있는 JavaScript 환경입니다.

이 가이드에서는 Ubuntu 20.04에 MERN 스택을 설치하는 방법을 보여줍니다.

전제 조건

  • Ubuntu 20.04를 실행하는 서버.\n
  • 루트 암호는 서버에서 구성됩니다.\n

시작하기

먼저 다음 명령을 실행하여 시스템 패키지를 업데이트된 버전으로 업데이트합니다.

apt-get update -y

모든 패키지가 업데이트되면 다음 단계로 진행할 수 있습니다.

몽고DB 서버 설치

기본적으로 최신 버전의 MongoDB는 Ubuntu 20.04 기본 리포지토리에 포함되어 있지 않습니다. 따라서 시스템에 MongoDB 리포지토리를 추가해야 합니다.

먼저 다음 명령을 사용하여 필요한 모든 종속 항목을 설치합니다.

apt-get install gnupg2 wget curl unzip git -y

모든 종속 항목을 설치한 후 다음 명령을 사용하여 MongoDB GPG 키를 추가합니다.

wget -qO- https://www.mongodb.org/static/pgp/server-4.4.asc | apt-key add -

그런 다음 다음 명령을 사용하여 MongoDB 리포지토리를 추가합니다.

echo "deb [ arch=amd64,arm64 ] https://repo.mongodb.org/apt/ubuntu focal/mongodb-org/4.4 multiverse" | tee /etc/apt/sources.list.d/mongodb-org-4.4.list

다음으로 다음 명령을 사용하여 리포지토리를 업데이트하고 MongoDB 서버를 설치합니다.

apt-get update -y
apt-get install mongodb-org -y

MongoDB가 설치되면 MongoDB 서비스를 시작하고 시스템 재부팅 시 시작되도록 활성화합니다.

systemctl start mongod
systemctl enable mongod

그런 다음 다음 명령을 사용하여 MongoDB 서비스의 상태를 확인합니다.

systemctl status mongod

다음 출력이 표시되어야 합니다.

? mongod.service - MongoDB Database Server
     Loaded: loaded (/lib/systemd/system/mongod.service; disabled; vendor preset: enabled)
     Active: active (running) since Fri 2021-07-23 12:21:17 UTC; 5s ago
       Docs: https://docs.mongodb.org/manual
   Main PID: 8774 (mongod)
     Memory: 58.8M
     CGroup: /system.slice/mongod.service
             ??8774 /usr/bin/mongod --config /etc/mongod.conf

Jul 23 12:21:17 ubuntu systemd[1]: Started MongoDB Database Server.

다음으로 다음 명령을 사용하여 MongoDB 설치를 확인합니다.

mongo --eval 'db.runCommand({ connectionStatus: 1 })'

다음 출력이 표시되어야 합니다.

MongoDB shell version v4.4.7
connecting to: mongodb://127.0.0.1:27017/?compressors=disabled&gssapiServiceName=mongodb
Implicit session: session { "id" : UUID("59c89093-9e9d-413b-aafa-ae0a4ddda087") }
MongoDB server version: 4.4.7
{
	"authInfo" : {
		"authenticatedUsers" : [ ],
		"authenticatedUserRoles" : [ ]
	},
	"ok" : 1
}

MongoDB 관리자 생성

먼저 다음 명령을 사용하여 MongoDB 인스턴스에 연결합니다.

mongo

연결되면 다음 명령을 사용하여 데이터베이스를 admin으로 변경합니다.

> use admin

그런 다음 관리자 사용자를 만들고 다음 명령을 사용하여 암호를 설정합니다.

> db.createUser({user: "admin" , pwd: passwordPrompt() , roles: [{ role: "userAdminAnyDatabase" , db: "admin"}]})
Enter password:

다음 출력이 표시되어야 합니다.

Successfully added user: {
	"user" : "admin",
	"roles" : [
		{
			"role" : "userAdminAnyDatabase",
			"db" : "admin"
		}
	]
}

그런 다음 다음 명령을 사용하여 MongoDB 셸을 종료합니다.

> quit()

Node.js 설치

기본적으로 Node.js의 최신 버전은 Ubuntu 기본 리포지토리에 포함되어 있지 않습니다. 따라서 노드 소스 리포지토리를 시스템에 추가해야 합니다.

노드 소스 리포지토리를 추가하려면 다음 명령을 실행합니다.

curl -sL https://deb.nodesource.com/setup_14.x | bash -

리포지토리가 추가되면 다음 명령을 사용하여 Node.js를 설치합니다.

apt-get install nodejs -y

설치 후 다음 명령을 사용하여 Node.js 버전을 확인합니다.

node --version

다음 출력이 표시되어야 합니다.

v14.17.2

다음 명령을 사용하여 NPM 버전을 확인할 수도 있습니다.

npm --version

다음 출력이 표시되어야 합니다.

6.14.13

React.js 설치

먼저, React.js 애플리케이션을 생성하려면 create-react-app 도구를 설치해야 합니다.

다음 명령으로 설치할 수 있습니다.

npm install -g create-react-app

설치 후 다음 명령을 사용하여 React.js 애플리케이션을 생성합니다.

create-react-app myapp

다음 출력이 표시되어야 합니다.

Success! Created myapp at /root/myapp
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 myapp
  npm start

Happy hacking!

그런 다음 디렉터리를 myapp로 변경하고 다음 명령을 사용하여 애플리케이션을 시작합니다.

cd myapp
npm start 0.0.0.0

다음 출력이 표시되어야 합니다.

Compiled successfully!

You can now view myapp in the browser.

  http://localhost:3000

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

이제 URL http://your-server-ip:3000을 사용하여 React.js 앱에 액세스할 수 있습니다. 다음 페이지에 React.js 대시보드가 표시되어야 합니다.

이제 터미널에서 CTRL+C를 눌러 애플리케이션을 닫습니다.

Express.js 설치

먼저 다음 명령을 사용하여 express-generator를 설치합니다.

npm install -g express-generator

설치 후 다음 명령을 사용하여 새 프로젝트를 만듭니다.

express myproject

다음 출력이 표시되어야 합니다.

  warning: the default view engine will not be jade in future releases
  warning: use `--view=jade' or `--help' for additional options


   create : myproject/
   create : myproject/public/
   create : myproject/public/javascripts/
   create : myproject/public/images/
   create : myproject/public/stylesheets/
   create : myproject/public/stylesheets/style.css
   create : myproject/routes/
   create : myproject/routes/index.js
   create : myproject/routes/users.js
   create : myproject/views/
   create : myproject/views/error.jade
   create : myproject/views/index.jade
   create : myproject/views/layout.jade
   create : myproject/app.js
   create : myproject/package.json
   create : myproject/bin/
   create : myproject/bin/www

   change directory:
     $ cd myproject

   install dependencies:
     $ npm install

   run the app:
     $ DEBUG=myproject:* npm start

이제 디렉터리를 프로젝트로 변경하고 다음 명령을 사용하여 모든 NPM 종속성을 설치합니다.

cd myproject
npm install

이제 다음 명령을 사용하여 Express 웹 서버를 시작합니다.

npm start 0.0.0.0

이제 웹 브라우저를 열고 URL http://your-server-ip:3000을 사용하여 Express 애플리케이션에 액세스하십시오. 다음 페이지가 표시됩니다.

결론

축하합니다! Ubuntu 20.04 서버에 MERN 스택을 성공적으로 설치했습니다. 이제 MERN 애플리케이션 개발을 시작할 수 있습니다. 궁금한 점이 있으면 언제든지 문의해 주세요.