Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[나만의 배포 가이드북 만들기] 지그(송지은) 미션 제출합니다. #6

Merged
merged 1 commit into from
Oct 7, 2021
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
40 changes: 35 additions & 5 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,16 +8,46 @@
<img src="https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat-square"/>
</p>

# OO의 deploy book
# 지그의 deploy book

## 1. 나의 배포 경험
- netlify, github pages를 이용한 정적 웹 사이트 배포
- 성능 미션을 S3 + Cloudfront로 배포
- EC2 배포는 이번이 처음!

## 2. AWS에서 SSR, CSR에 따른 배포 전략

- CSR이 CDN배포가 권장되는 이유
- EC2 배포가 가지는 특징
**🌱 CSR이 CDN배포가 권장되는 이유**

✔️ CSR은 HTML, CSS, JavaScript 등의 코드나 이미지 등의 에셋들을 포함하고 있는 정적 파일로 구성된다. 정적 파일은 변경이 자주 발생하지 않기 때문에, CDN의 캐싱 전략을 사용해서 가져오는 것이 유리하다.

✔️ 리소스를 요청할 때마다 매번 오리진 서버에 접속하는 것보다 CDN에 캐싱되어 있는 리소스를 가져오는 것이 더 빠르다.

✔️ CSR에서는 브라우저 렌더링 및 모든 인터랙션을 클라이언트 즉 사용자의 브라우저가 처리한다. 따라서 필요한 리소스를 빠르게 가져올 수 있는 CDN을 이용한다.

✔️ CDN을 이용하면 오리진 서버의 부하를 줄여줄 수 있다.

✔️ CSR의 큰 번들 파일을 CDN을 이용하여 압축해줄 수 있다.

[관련 링크 - CDN](https://web.dev/content-delivery-networks/)

**🌱 EC2 배포가 가지는 특징**

✔️ 가상 컴퓨팅 환경을 제공한다.

✔️ 원하는 만큼 가상 서버를 구축하고, 보안 및 네트워크 구성과 스토리지 관리가 가능하다.

✔️ DB 접근과 서버에서 필요한 복잡한 연산이 가능하다.

✔️ nginx등의 웹서버를 이용해서 라우팅을 제공한다.

✔️ 강력한 안전성과 보안을 제공한다.

## 3. 마크업한 결과물을 배포하고 그 과정 기록하기
**🍎 애플웹사이트 S3+Cloudfront로 배포하기**
- [블로그에서 읽기](https://zigsong.github.io/2021/08/28/fe-s3-cloudfront/)
- [배포 페이지](https://d3j6lremm8px4r.cloudfront.net/)

- 애플웹사이트 S3+Cloudfront로 배포하기
- nextjs로 항공사 웹사이트 컴포넌트가 있는 유닛 페이지 3개를 만든 후 EC2로 배포하기
**✈️ nextjs로 항공사 웹사이트 컴포넌트가 있는 유닛 페이지 3개를 만든 후 EC2로 배포하기**
- [블로그에서 읽기](https://zigsong.github.io/2021/10/02/fe-aws-ec2-next/)
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

image

이야 배포 자체에만 집중한게 아니라 꽤 많은 부분을 공부하셨네요.

image

이런 게 가능한 줄은 저도 처음 알았네요...단순히 yarn start 를 썼을 때보다 강점이 될 수 있는 부분이 있다면 무엇일까요?

image

그냥 프록시와 리버스 프록시가 어떻게 다른 지에 대한 설명이 더 자세하면 훌륭할 것 같습니다!

image

이 문제는 도커를 통해서도 해결할 수 있습니다! 도커를 쓰면 node.js 를 비롯한 각종 프로그램들을 본인이 EC2 에서 직접 설치하지 않아도 되는 장점도 있답니다! (대신 도커를 설치해야하...)

- [배포 페이지](http://13.125.205.164/)