와이어 샤크
자유 및 오픈 소스 패킷 분석 프로그램이다. 네트워크의 문제, 분석, 소프트웨어 및 통신 프로토콜 개발,교육에 쓰인다.
http/https
https: 데이터가 암호화 되어있다
http: 패킷이 전송될때 무슨 내용인지 볼 수 있다
3-way-handshake(컴퓨터 간 연결)
내컴퓨터==syn==>서버 컴퓨터 ==syn+ack==>내컴퓨터==ack==>컴퓨터 통신(gql,nest Api)
4-way-handshake(연결 종료 시)+
nodejs 설치 => yarn 설치 -> yarn install => next build => next start => gcp 외부 ip로 접속 => 300번 포트 방화벽 뚫기 => 방화벽 스티커(규칙) 만들기
소스 IPV4 범위 :0.0.0.0/0 모두 접속
storage: 무한으로 트레픽 감당가능
Frontend computer: 트레픽 늘면 여러대 추가 해야됨
opengraph(미리보기)에서 백엔드에서 데이터를 받아오는 상세페이지 미리보기를 할 경우에는 서버 사이드 렌더링을 해야 한다. 데이터 받아오는데 시간이 걸림
=> getServerSideProps(){}
배포
- 부하분산기 https로 설정하기
- https로 설정
- 인증서 만들기
- 인스턴스 만들기
- 인스턴스 실행
- git clone 주소
- node 설치
$ sudo apt update
$ curl -sL https://deb.nodesource.com/setup_16.x | sudo bash -E -
$ sudo apt install nodejs
$ sudo npm install -g yarn - yarn install
- yarn build:ssr
- yarn start(yarn next start)
- 방화벽 스티커 만들어서 3000번 포트에 붙이기
- 대상태그: 지정된 대상
- 지정된 프로토콜 -> tcp: my3000
- 소스 범위: 0.0.0.0/0
- vm 인스턴스 수정 => 네트워크 태그에 스티커 추가
5.getServerSideProps
- 서버 사이드 렌더링: 렌더링 되기 전에 실행되는 함수
- return 값이 페이지의 props로 넘어감
- yarn add graphql-request
- next.config
- trailingSlash: 모든 파일에 .html 붙임
- generateBuildId: 빌드 될때 하나의 아이디를 부여함
- exportPathMap: 정적파일 표시
