VaIice의 이야기

정적 페이지Static Web Page웹 서버에 이미 저장된 파일 (HTML, 이미지, JS 등)을 클라이언트에게 전송한다. 모든 사용자는 서버로부터 고정된, 동일한 콘텐츠를 받게 된다.ex) 개인 포트폴리오 사이트, 회사 소개 사이트동적 페이지 Dynamic Web Page웹 서버에서 실시간으로 콘텐츠를 생성하고 제공하는 웹 페이지  사용자는 상황, 시간, 요청 등에 따라 달라지는 웹 페이지를 보게 된다.ex) 블로그, 뉴스 사이트, 커뮤니티SSR Server Side Rendering서버에서 렌더링 준비를 마친 상태로 클라이언트에게 전송한다. 서버에서 렌더링이 된 채로 클라이언트에게 전송되기 때문에, 유저는 즉시 화면을 볼 수 있다.하지만 JS가 렌더링 되기 전이기 때문에, 사이트 조작은 불가능하다...

1. 파일 압축    2. IAM Role 만들기 - EC2    3. IAM Role 만들기 - Elastic Beanstalk   4. Elastic Beanstalk    node -v로 버전 확인           ---     Following services are not running: web.   start: nodemon server.js  -> node server.js로 변경 후 해결   출처: https://stackoverflow.com/questions/63350295/elastic-beanstalk-deploy-nodejs-status-degraded-following-services-are-not-runn

1. Github 환경 변수 등록   2. Github Actions workflow  폴더의 root에서 .github/workflow/deploy.yml  name: deployon:  push:    branches: [master]  pull_request:    branches: [master]jobs:  deploy:    runs-on: ubuntu-20.04    strategy:      matrix:        node-version: [18.x]    steps:      - name: Checkout source code        uses: actions/checkout@v3      - name: Use Node.js ${{ matrix.node-version }}      ..

1. 예시 코드 - require 사용 (import도 가능)  // shop.js const router = require('express').Router()router.get('/shop/shirts', (request, response) => {  response.send('셔츠')})router.get('/shop/pants', (request, response) => {  response.send('바지')})module.exports = router   const router = require('express').Router()  app -> router 변경  //server.jsapp.use('/', require('./routes/shop.js'))      2. URL 축약  // sh..

1. 이미지 업로드 과정  글 작성 페이지에 이미지 input 넣기   서버로 이미지 전송   이미지 URL 발급   DB에 게시글과 이미지 URL을 저장   DB에 있던 URL 꺼내서 삽입    2. 이미지 게시          form class="form-box" action="/write" method="POST" enctype="multipart/form-data">            h4>글쓰기h4>            input type="text" name="title">            input name="content">            input type="file" name="image" accept="image/*">            button type="submi..

액세스 관리 - 사용자  한 AWS 계정에 많은 사람들이 접속해서 사용 가능  새로운 사용자 계정(하위계정)을 만드는 것                                           {    "Version": "2012-10-17",    "Statement": [        {            "Sid": "1",            "Effect": "Allow",            "Principal": "*",            "Action": "s3:GetObject",            "Resource": "arn:aws:s3:::자신의 버킷명/*"        },        {            "Sid": "2",            "Effect": "..

1. 환경변수 저장 라이브러리  npm install dotenv // server.js require('dotenv').config()   2. 환경변수 보관   // .env PORT=8080 // server.js // 변경 전   app.listen(8080, () => {    console.log('http://localhost:8080에서 서버 실행 중')   }) // 변경 후  app.listen(process.env.PORT, () => {    console.log('http://localhost:8080에서 서버 실행 중')   }) // mongoDB 주소 const url = process.env.DB_URL   process.env.변수명   3. middleware API에 ..

1. 종류  SHA3-256   SHA3-512   bcrypt   scrypt   argon2  ...   2. bcrypt 사용법  npm install bctypt  // server.js const bctypt = require('bcrypt')   3. hashing  app.post('/signUp/add', async (request, response) => {  try {    let hashing = await bcrypt.hash(request.body.password, 10)    console.log(hashing)   bcrypt.hash('해싱할 문자', 숫자)   숫자가 높을수록 보안 ↑ 시간 ↑   비밀번호만 해싱하는 것이 아닌, salt라고 불리는 랜덤한 문자열 추가  ..

1. 순서  (1) 가입: ID, PW을 DB에 저장  (2) 로그인: DB와 비교   (3) 세션 만들기: 로그인 시간, 유효기간 등 Document 발행   (4) 쿠키 전송 후 저장   (5) 로그인 여부 확인: 요청 시 쿠키에 있는 session을 DB와 비교     2. passport 라이브러리  npm install express-session passport passport-local    express-session: 세션 생성, 저장, 관리 등 세션 관리 라이브러리  passport: 회원 인증 메인 라이브러리  passport-local: ID, PW 방식 인증 라이브러리   3. 세팅 // server.js const session = require('express-session..

1. 알고리즘  (1) 회원가입  유저가 가입 시 ID, PW를 DB에 저장   (2) 로그인  유저가 로그인 시 ID, PW를 서버로 전송  서버는 DB에 있는  ID, PW가 일치하는 경우 세션 또는 토큰 발급   (3) 로그인 시 서버기능  유저가 데이터 요청 시 세션 또는 토큰 제시  서버는 확인 후 데이터 전송    2. session   (1) 로그인   DB 또는 서버 메모리에 아이디, 로그인 날짜, 유효기간, session ID 기록   유저에게 session ID 발급     (2) 로그인 시 서버기능   유저가 GET/POST 요청 시 session ID 제출  서버는 session ID를 가지고 DB 조회  이상이 없다면 진행   장점: 요청마다 엄격한 체크 가능   단점: DB에서 ..