[Linux] SSH 접속 클라이언트

02 Oct 2024 in Study / Linux

6. SSH 접속 클라이언트
- SSH (Secure Shell)
- SSH 클라이언트 프로그램
SSH 접속 클라이언트 실습
- SSH 접속 클라이언트 실습 상황 가정
- ❓ 윈도우(일반 사용자PC) 브라우저에서 운영서버주소(localhost[:80])로 요청했을 때, 리액트 메인 페이지가 응답될 수 있도록 하기 위해서는?
실습 : todomate를 빌드해보자

6. SSH 접속 클라이언트

SSH (Secure Shell)

SSH는 원격 접속을 안전하게 하기 위한 프로토콜이다.
IP 주소와 계정 정보만으로 원격 서버에 접속할 수 있지만, 보안이 취약할 수 있다.
SSH는 공개 네트워크에서 안전하게 데이터를 주고 받기 위해, 통신 전에 암호화를 수행한다.
- 이를 통해 보안이 유지되며, 원격 서버에 안전하게 접속할 수 있다.

SSH 클라이언트 프로그램

SSH 통신을 지원하는 여러 클라이언트 프로그램이 있다.
- PuTTY, Teraterm, Xshell (상용), Mobaxterm
- 모두 원격 서버와의 SSH 연결을 위한 프로그램이다.

SSH 접속 클라이언트 실습

SSH 접속 클라이언트 실습 상황 가정

- 일반 사용자가 운영서버의 주소로 접근하면 응답을 받는다.
- 일반 사용자가 아니라 개발자가 운영서버를 조작해야하는 상황이다.
- 실제 회사에서 운영서버(컴퓨터)는 클라우드 환경 (원격지)에 있거나, 다른 데이터 센터(원격지)에 있을 것!
- 개발자 입장에서는 자기 자리에서 원격지 PC로 접근해야한다.
    - 내 위치에서 원격지로 접근을 하는 과정

Putty를 사용하여 원격 서버 접속하기
PuTTY를 사용하여 가상 머신에 설치된 Ubuntu Linux 서버에 접속하는 과정

PuTTY 설치하기
- https://www.chiark.greenend.org.uk/~sgtatham/putty/latest.html
포트 포워딩 설정하기
- 가상 머신(VirtualBox)에서 Ubuntu 서버에 접속하려면 포트 포워딩을 설정해야 한다.
- 포트 포워딩 : 호스트(사용중인 컴퓨터)에서 가상 머신 내부의 네트워크로 접근할 수 있게 해주는 설정
- VirtualBox의 IPv4 Address 주소 확인하기
  - cmd 접속 → ipconfig → IPv4 Address 주소인 192.168.56.1를 복사하기
- linux cli 설정 → 네트워크 → 고급 → 포트 포워딩 → 포트 추가하기
  - 호스트 포트, 게스트 포트를 22번 포트로 들어올 수 있게 열어준다.
  - 이렇게 하면, 호스트 컴퓨터에서 SSH로 가상머신의 Ubuntu 서버에 접근할 수 있다!
PuTTY에서 git 프로젝트 클론하기
```
  git clone https://github.com/~
```
서버 접속 설정을 저장하기
- Putty 종료 후, Saved Sessions에 server1이라고 지정후 Save 버튼 클릭
- 매번 IP 주소, 포트 번호를 입력할 필요 없이, 저장된 세션을 클릭하면 바로 해당 서버로 접속할 수 있다.
글꼴 사이즈 키우는 방법
- Appearance → 글꼴 크기 수정 → Session에 Save
- 글씨가 커졌다!!

Node.js 및 Vite 개발 서버 설치

프로젝트 디렉토리로 이동하기
- react-spa-test 프로젝트 디렉토리로 이동한다.
```
  cd react-spa-test 
```
패키지 목록 업데이트하기
- 패키지 관리자인 apt를 사용해서 시스템 패키지 목록을 최신 상태로 업데이트한다.
```
  sudo apt-get update 
```
nvm 설치하기
- curl : 서버와 통신할 수 있는 명령어 툴
- nvm : node version manager 줄임 표현
  - node.js를 버전 별로 관리할 수 있도록 도와주는 모듈
```
  curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | bash
```
nvm 정상 설치 여부 확인을 위해 nvm 버전을 확인한다.
```
  nvm —version
```
- 설치 후 실행결과 : nvm not found가 뜬다.
- nvm을 활성화한다.
```
  source ~/.bashrc
```
- nvm --version 실행하면 설치된 버전을 확인할 수 있다.
nvm으로 node.js를 설치한다.
```
  nvm install node
```
- node -v : 설치된 node 버전을 확인한다.
node를 실습에서 사용하는 20 버전으로 변경한다.
```
  nvm install 20 
```
- nvm use [사용할 버전] : node를 원하는 버전으로 사용하는 명령어
vite를 설치한다.
- Vite를 개발 의존성으로 설치한다.
```
  npm install vite —save-dev
```
개발 서버를 백그라운드에서 실행하자
```
  npm run dev & 
```
- 개발 서버를 백그라운드에서 실행하면 터미널을 자유롭게 사용할 수 있게 된다.
개발 서버를 확인한다.
- 서버 내에서 로컬호스트로 접근해 Vite 개발 서버가 제대로 실행되고 있는 지 확인한다.
- localhost:5173은 Vite 개발 서버의 기본 포트이다.
```
  curl localhost:5173
```

❓ 윈도우(일반 사용자PC) 브라우저에서 운영서버주소(localhost[:80])로 요청했을 때, 리액트 메인 페이지가 응답될 수 있도록 하기 위해서는?

- 어딘가에 위차한 원격지 서버로 요청을 날렸을 때, 원격지 서버가 html, css, js파일을 응답해줘야 한다.
- 이러한 정적 리소스(html, css, js, png 등)를 응답해주는 서버를 **웹 서버**라고 한다.
- 보편적인 웹 서버의 종류 **Apache, Nginx**
1. nginx 설치
2. nginx에게 localhost:80으로 요청이 왔을 때, 우리가 빌드한 React 프로젝트 결과물인 html 파일을 응답하도록 설정

dist/assets 내부의 파일들이 웹 서버(Nginx)를 통해 클라이언트에게 제공되어야 한다.
- npm run build 시, dist 디렉토리가 생성된다.
- dist/assets **디렉토리에는 프로젝트에서 사용되는 정적 파일 (이미지, css, js 등)이 위치한다.

Nginx 설치

유틸 패키지를 설치한다.

  sudo apt-get install -y curl gnupg2 ca-certificates lsb-release debian-archive-keyring

패키지 저장소의 서명키를 다운로드 및 저장한다.

su - → 에러 발생
아래 명령어만 우선 실행하기

    
  $ curl https://nginx.org/keys/nginx_signing.key | gpg --dearmor | tee /usr/share/keyrings/nginx-archive-keyring.gpg >/dev/null

패키지 정보를 다시 업데이트한 후 Nginx를 설치한다.

  sudo apt-get update
  sudo apt-get install -y nginx
  nginx

nginx 버전을 확인한다.
```
  nginx -v
```
Nginx가 정상적으로 동작하는 지 확인한다.
```
  ps -ef | grep nginx
```
- Nginx가 정상 실행될 경우, master와 worker 프로세스가 각각 한 개 이상 실행되고 있어야 한다.
Nginx 요청 시 정상적으로 응답하는지 확인한다.
- 80은 생략 가능하다.
```
  curl localhost:80 
```
- 명령어 실행 시 index.html이 텍스트 형태로 응답된다.
Nginx 설정 파일을 확인한다.
- 최상위 경로로 이동 (cd /) → etc 디렉토리로 이동 (cd etc) → nginx 디렉토리 이동 (cd nginx) → 파일 목록 확인
- /etc/nginx : Nginx 서버가 사용하는 기본 설정이 저장된 루트 디렉토리로, Nginx는 이곳에 저장된 설정파일의 내용에 따라 동작한다.
```
  $ cd /
  $ cd etc/nginx
  $ ls
```
nginx.conf 파일 내용을 확인한다.
```
  cat nginx.conf 
```
- nginx.conf 파일은 디렉토리에 위치한 모든 설정 파일을 포함하는 최상위 http 블록을 가지고 있다.
- /etc/nginx/conf.d/ 경로에 default.conf 파일을 생성해서 사용하자!
홈 디렉토리 이동 (cd) → 프로젝트 디렉토리의 dist로 이동 (cd react-spa-test/dist/) → pwd로 현재 경로 확인
```
  $ cd dist/
  $ pwd 
    
  // /home/yeahjinee/react-spa-test/dist
```
default.conf 파일을 생성해서 작성한다.
```
  $ cd 
  $ cd /etc/nginx/conf.d
  $ sudo vi default.conf
```
- root에 pwd로 확인했던 dist 경로를 지정하고, index.html 파일을 기본으로 응답하도록 설정한다.
  - /home/yeahjinee/react-spa-test/dist 에 위치한 index.html을 주도록 하는 것!
- 설정파일만 바꾸면 nginx 서버의 동작을 변경할 수 있다!
설정이 완료되면 Nginx 설정을 리로드하여 반영한다.
```
  $ nginx - s reload
```
/home/yeahjinee/react-spa-test/dist 에 위치한 index.html을 확인한다.
```
  $ curl localhost 
```
포트 포워딩 설정하기
- localhost:80으로 접속 시 Nginx 서버가 리액트 앱의 정적파일을 제공할 수 있도록 한다.
- web server, 호스트 포트 80, 게스트 포트 80으로 설정하기
localhost로 접속 시 React 프로젝트의 메인 페이지가 응답된다.

실습 : todomate를 빌드해보자

next.js 빌드하기

git clone하기

  $ git clone https://github.com/woorifisa-service-dev-3rd/backend-2nd-2todomate.git

프로젝트에 필요한 의존성을 설치한다.
```
  $ npm install
```
프로젝트를 빌드한다.
```
  $ npm run build
```
VM에 포트포워딩하기
- linux cli 설정 → 네트워크 → 고급 → 포트 포워딩 → 포트 추가하기
- 3000번 포트를 들어올 수 있게 열어준다.
개발 모드로 백그라운드에서 서버를 실행한다.
- 터미널은 계속 사용할 수 있는 상태로 유지해서 백엔드 서버를 띄워야 하기 때문이다!
```
  $ npm run dev &
```
localhost:3000 로 요청 시 메인 페이지가 실행된다.

Spring 서버 띄우기

Java 11를 설치한다.

  $ sudo apt udpate
  $ sudo apt install openjdk-11-jdk

설치된 java 버전을 확인하자.
```
  $ java -version
```

Gradle을 설치한다.
```
  $ sudo apt install gradle
```
- 설치된 gradle 버전을 확인하자.
```
  $ gradle -v
```
- build.gradle이 있는 경로에서 빌드를 시작한다.
```
  $ chmod 755 gradlew
  $ ./gradlew build
```

application.properties 파일을 생성해야 한다.

  // 프로젝트 루트에서 시작
  $ cd src/main/
  $ mkdir resources
  $ cd resources
  $ vi application.properties

아래 내용을 application.properties에 붙여넣기 후 :wq! 로 저장하기

  spring.application.name=todomate
        
  spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
  spring.datasource.url=jdbc:mysql://localhost:3306/todomate?serverTimezone=UTC&characterEncoding=UTF-8
  spring.datasource.username=root
  spring.datasource.password=1234
        
  spring.jpa.show-sql=true
  spring.jpa.database-platform=org.hibernate.dialect.MySQL8Dialect
  spring.jpa.hibernate.ddl-auto=none

Gradle로 Java 프로젝트를 빌드하자.

  // 프로젝트 루트에서 시작
  $ cd build/libs
  $ ls
  todomate-0.0.1-SNAPSHOT.jar  todomate-0.0.1-SNAPSHOT-plain.jar
  $ java -jar todomate-0.0.1-SNAPSHOT.jar

서버가 실행된다.
- Communications link failure 에러가 발생한다. → mysql을 연결해주어야 한다!

MySQL 설치하기

apt를 먼저 업데이트해준다.
```
  $ sudo apt-get update
```
mysql을 설치한다.
```
  $ sudo apt-get install mysql-server
```
mysql 버전을 확인한다.
```
  $ mysql --version
```

MySQL에 사용할 데이터베이스 만들기

root 유저로 MySQL에 접속한다.
- Enter password : 가 나오면 password 입력한다.
```
  $ sudo mysql -u root -p
```
root 유저의 인증방식을 mysql_native_password로 변경해주기
- 이 명령어를 실행하지 않고 서버를 실행하면 Access denied for user ‘root’@’localhost’ 에러가 발생한다.
- 이유 : MySQL 8.0 이상에서는 기본 인증 플러그인이 caching_sha2_password로 설정되어 있는데, Spring Boot에서 사용하는 JDBC 드라이버는 mysql_native_password를 사용하여 인증을 시도한다. Spring Boot에서 해당 유저로 접근할 때 인증 방식이 맞지 않아 에러가 발생한 것!
  - root 유저의 인증방식을 mysql_native_password로 변경해야한다.
```
  ALTER USER 'root'@'localhost' IDENTIFIED WITH mysql_native_password BY '1234';
```
데이터베이스를 만들고, schema, data 추가 쿼리 실행하기
```
  create todomate;
  use todomate;
```
MySQL을 빠져나온다.
```
  exit;
```

백엔드 서버 재실행하기

다시 서버를 실행해보자
- 오류가 발생하지 않고 실행되면 성공한 것!
localhost:3000 으로 접속하기
- 로그인, 기능들이 잘 실행이 된다~

우리 FISA 수업을 참고하였습니다.

[Linux] SSH 접속 클라이언트

6. SSH 접속 클라이언트

SSH (Secure Shell)

SSH 클라이언트 프로그램

SSH 접속 클라이언트 실습

SSH 접속 클라이언트 실습 상황 가정

❓ 윈도우(일반 사용자PC) 브라우저에서 운영서버주소(localhost[:80])로 요청했을 때, 리액트 메인 페이지가 응답될 수 있도록 하기 위해서는?

실습 : todomate를 빌드해보자

팝콩

Error

6. SSH 접속 클라이언트

SSH (Secure Shell)

SSH 클라이언트 프로그램

SSH 접속 클라이언트 실습

SSH 접속 클라이언트 실습 상황 가정

❓ 윈도우(일반 사용자PC) 브라우저에서 운영서버주소(localhost[:80])로 요청했을 때, 리액트 메인 페이지가 응답될 수 있도록 하기 위해서는?

실습 : todomate를 빌드해보자

Templates (for web app):

Error