📔
프론트엔드 경험들
  • 첫 장...
  • 💻Tech
    • oAuth
    • rxjs
    • Deep React
    • Deep Javascript
  • 🎨html/css
    • Image
    • Web component
    • Styled vs Scss
    • css snippet
    • HTML5/input
      • HTML5 Video Events and API
      • label
      • meter
      • datalist
    • a11y
      • aria-* vs data-*
      • html, meta tage
    • 다크모드
  • 💾상태관리(state)
    • state 종류
    • Recoil
  • 🏄‍♂️ UI/UX
    • 서술
    • InfiniteQuery
  • 🎨디자인 시스템
    • Component 정의
  • 🥎react
    • react-use
    • 커스텀 체크박스 구현
    • target vs currentTarget
    • Yarn link 관련 에러 ( react invalid hook call)
    • JSX.Element vs ReactNode vs ReactElement
    • Interfacee vs Type
  • 🔨TDD
    • React
    • Javascript
  • 🕹️Javascript
    • pipe, compose
  • 🚀Typescript
    • Enum vs union
    • Array 체크
    • XOR 타입
    • unknown, any, never 차이
    • declare global(env)
  • 🛠️config 관련
    • yarn2(berry) vs yarn vs npm
    • package.json
    • next.config.js
    • webpack.config.js
    • tsconfig
    • eslint.json
  • 🔨디버깅
    • Chrome - performance
    • vs-code
  • Template 모음
    • Svgr 스크립트
    • [TS] Type, Interface
    • HttpClient
  • 🕹️사이트 분석
    • 네이버
  • 기타
    • 레거시 유지보수) moment에서 date-fns로
  • 추천 사이트
    • 유용한 변환기
    • 기술 블로그 모음
  • 최적화
    • image 리사이징
Powered by GitBook
On this page

Was this helpful?

  1. 최적화

image 리사이징

I. AWS Lambda@edge https://medium.com/daangn/lambda-edge%EB%A1%9C-%EA%B5%AC%ED%98%84%ED%95%98%EB%8A%94-on-the-fly-%EC%9D%B4%EB%AF%B8%EC%A7%80-%EB%A6%AC%EC%82%AC%EC%9D%B4%EC%A7%95-f4e5052d49f3

2. API G/W를 이용한 방법 https://media.example.com/images/123.jpg (CF) -> https://api-id.execute-api.amazonaws.com/stage/images/123.jpg (API G/W) -> Lambda Invocation

  • https://aws.amazon.com/ko/blogs/compute/resize-images-on-the-fly-with-amazon-s3-aws-lambda-and-amazon-api-gateway/

Previous기술 블로그 모음

Last updated 4 years ago

Was this helpful?