리액트 서버 만들기
프론트는 어떤 식으로 배포해야할까???
스프링->패키징 빌드!
웹팩,, 모듈 번들러
파일을 모두 묶어서 번들링 -> 빌드하면 됨
https://github.com/guguttemy/react-test
GitHub - guguttemy/react-test
Contribute to guguttemy/react-test development by creating an account on GitHub.
github.com
git clone
로컬호스트 : 현재 서버 킨 그 곳에서만 됨
SQL 연결할때 hostname을 리눅스 서버로 바꿔도됨
npm run dev -> 개발할때만 씀 이 안에서만 페이지가 나오도록함
개발 다 하면 빌드해야하는데
npm run build!!
-> mvn package처럼 빌드 결과물을 만드는 과정
preview -> 결과물을 미리 보겠다!!
npm run preview
이제 EC2에서 해보기!!!!!!!!!!!!!!!
키 있는곳에서 깃 배시 실행
react server 인스턴스 연결하고!!
git repository에서 clone
node.js 설치
- npm
https://publish.obsidian.md/guguttemy/3.+Cloud/2.+Nginx/6.+Node.js+%EC%84%A4%EC%B9%98
6. Node.js 설치 - Service dev - Obsidian Publish
6. Node.js 설치 - Service dev - Powered by Obsidian Publish.
publish.obsidian.md
nvm : npm 버전 관리해주는,,,
완료!!
깃 클론도 함
clone한 프로젝트 폴더가서 npm install
npm run dev로 실행 후
curl localhost:5173(열린 포트 번호)로 동작하는지 테스트
&
-> 백그라운드로 실행한다
원래는 실행하고 입력할 수 없지만 &를 붙여서 백그라운드 실행을 해놓으면 엔터친 후 명령어를 입력할 수 있게된다!!
npm run dev를 백그라운드로 실행하고 curl localhost:5173를 연다????
curl 요청을 보낸다?
제대로 실행됐는지 확인해볼 수 있다
실행중인 프로세스 볼 수 있다
다른사람들이 실행중인거까지 볼 수 있다
쳐기
실행중인 포트 볼 수 있다
127.0.0.1 -> 아무데서나 접근되는거 아니고 내 로컬에서만,,?
curl
프로세스 번호가 나온다 (node로 돌아가고 있기때문에 저렇게 하는거)
만약 작동 제대로 안하면 kill -9 3534 이런식으로 종료하면 됨
kill -15 : 정상적으로 종료
kill -9 : 강제 종료
내 로컬에서는 돌아가는데(ec2안에서) 밖에서는 돌아가냐? 아니다
-> 보안그룹에 인바운드 그룹 규칙 추가
5173에 대해선 허용됨
프라이빗 : 서버끼리만 내부 통신
퍼블릿 : 외부에서 들어올 숭 ㅣㅆ음
fg -> 포그라운드로 변환
포그라운드로 변환하고 종료
localhost -> 나만 갈 수 있음
sudo vi package.json - 슈퍼유저 권한으로 package.json 파일 수정하겠다
i 눌러서 insert mode로 변환
/ preview -> preview위치 찾기 (insert모드 esc하고 하기)
:wq - 저장하고 종료
퍼블릿 주소:5173
접근됨
--host~~~ 추가해줘야 network로 볼 수 있게 나타남
그냥 vite preview였을떄는 local 주소만 나옴
수정 전에는
--------
npm run
dev -> 개발한거 띄우기
build -> 패키징
preview -> 빌드한걸 보여줌
-------
Vercel: Build and deploy the best Web experiences with The Frontend Cloud – Vercel
Vercel's Frontend Cloud gives developers the frameworks, workflows, and infrastructure to build a faster, more personalized Web.
vercel.com
빌드배포 쉽게 할 수 있게 도와줌
---------
서버끄면
세션 모든게 날아감
서버 켜지면 쉘이 열리는건데(쉘도 하나의 프로세스로 돌아감)
서버꺼지면서 쉘도 꺼지니까,,
---------
엔진x로 배포해보기
https://publish.obsidian.md/guguttemy/3.+Cloud/2.+Nginx/1.+Nginx
1. Nginx - Service dev - Obsidian Publish
1. Nginx - Service dev - Powered by Obsidian Publish.
publish.obsidian.md
sudo apt-get update
sudo apt-get install -y curl gnupg2 ca-certificates lsb-release debian-archive-keyring
su -
아직 비밀번호가 설정이 안되어있는거
sudo passwd root
-> 비밀번호 설정
su -
~# : 관리자계정
whoami : 계정 뭔지 확인
ps -ef | grep nginx
현재실행중인 프로세스(다른사람들이 하는거포함) 중 nginx인거를 보여줘라
80포트로 웹서버가 하나 켜있어서 html파일을 응답한것
curl localhost:80 인데 80은 생략 가능
파란색은 폴더 나머지는 파일
/ : 루트 경로
location / : localhost/ 로 들어갔을때 index 열어줘 없으면 index.html 없으면 그 다음,,
nginx -s reload -> 바뀐거 적용해서 다시 리로드
conf.d/default.conft 파일에 가서 listen 부분의 포트 변경
81번 포트로 변경 후에 localhost:81로 동작하는지 테스트
80으로는 동작안하게 되는지
cd /etc/nginx/conf.d
vi default.conf
nginx -s reload
됨!!
이제 여기에 프로젝트경로를 넣어서 띄우기?
-------
https://www.notion.so/mysql-bb87e07894c54a539f2bca27ca300f4c
리눅스 mysql 외부 접속 방법 | Notion
mysql 접속
lumbar-healer-b73.notion.site
리눅스 mysql 외부 접속 방법
sudo mysql -u root -p
user 생성해야함
### 유저 생성
create user '`[생성할USERID]`'@'`%`' identified by '`[비밀번호]`';
> ex) create user ‘test’@’118.131.63.237’ identified by ‘1234’;
>
→ 118.131.63.237 ip 확인 어떻게 해..??
-> 118.131.63.237 포트로 들어오는걸 허용하겠다
다했으면 myeql
..
원섭이 방법으로는 안됨 ㅜㅜ
->
그게 원래 connect 안된다고 했는데
4:05
sudo service mysql restart
4:05
이거 치고
4:05
다시 mysql 접속하면
netstat -tnlp
mysql 포트가
127.0.0.1:3306로 되어있을 경우
설정 파일 적용해야하기 때문에
sudo service mysql restart (응답 없으면 재시작된 것)
다시 netstat 확인하면 0.0.0.0:3306
or 혜진이 방법
------
https://obvious-ring-b5d.notion.site/swap-5a8c7c4003a346a2a5575ef3158f5230
우분투 swap 만들어 메모리 용량 늘리기 | Notion
💣 문제
obvious-ring-b5d.notion.site
# **우분투 swap 만들어 메모리 용량 늘리기**
## 💣 **문제**
**우분투에서 백엔드 서버를 백그라운드로 실행시켜놓고 프론트서버를 실행시키니 쉘이 멈춤**
## **🔨 삽질**
**인스턴스만 계속 중지했다 재실행만 반복**
## **🎯 원인**
**메모리가 부족해서??**
- **메모리 사용량 확인**
`sar -r 1` (리눅스 시스템의 메모리 사용 통계)
sar : System Activity Reporter, 리눅스의 여러 가지 성능 지표
-r : 메모리 사용량에 대한 정보
1 : 보고 주기가 1초임을 의미
서버를 켜기 전에는 약 54 정도

백엔드와 프론트엔드 서버를 켜니 약 85가 되고 프론트 서버가 열리지 않음

## **✅ 해결**
**우분투 swap메모리를 만들어 메모리 용량 늘리기**
**swap메모리 : 시스템의 주 메모리(RAM)가 부족할 때 사용되는 디스크 공간**
`**free -h` (메모리 사용량을 확인)**

- **swap 메모리(파일) 생성**
1. `sudo fallocate -l 2G /swapfile` (2기가로 스왑 파일 생성)
2. `sudo chmod 600 /swapfile` (파일 권한 600으로 설정)
3. `sudo mkswap /swapfile` (파일에 스왑 영역 생성)

1. `sudo swapon /swapfile` (스왑 파일 활성화)
2. `sudo nano /etc/fstab` (/etc/fstab 파일을 열어 스왑 추가)
3. nano 에디터에 추가 `/swapfile swap swap defaults 0 0` (/swapfile을 스왑 파일로서 자동으로 사용하도록 설정)
생성된 것 확인

**서버 실행 시 스왑메모리 사용**

## **❓ 의문**
1. **남혁이는 왜 메모리 늘리는 과정 없이 한 번에 됐는가???**
`**service --status-all` (설치된 서비스 목록 조회) 해봤으나 똑같음**
`**top` (현재 메모리, cpu사용량 조회) 도 거의 차이 없음**
virtual box에서 linuxcli 서버 켜놓아서…?
구현할때 배포환경 먼저 만들어놓고 기능만들고 다시 넣고 배포하고 이런식으로 하는게 좋음
https://drive.google.com/drive/folders/1l8aIGd6kJ0-0vlHpvhxnntjMJg501jzf
[우리FISA_2기] 공유 폴더 - Google Drive
12-27, 프로그래밍 패러다임
drive.google.com
리눅스 명령어
'우리FISA > 강의 🔒' 카테고리의 다른 글
2024.02.27 (0) | 2024.02.27 |
---|---|
2024.02.22 (1) | 2024.02.22 |
2024.01.11 (0) | 2024.01.11 |