개발 기록기록📝

원본에 비해 훨씬 더 작은 용량으로 이미지를 사용할 수 있음 webp형식 서버에서 자동으로 이미지 최적화 quality 속성으로 얼마나 최적화할지 정의 기본 75 loading="lazy" 자동으로 적용됨 placeholder="blur" 사진이 다운로드 되는 동안 블러 이미지 적용됨, 블러 이미지는 next가 자동으로 만들어 제공함 -> layout shift 방지 소스파일을 스태틱하게 임포트 했기 때문에 위와 같은 최적화가 가능함 빌드타임에 이미 이미지의 너비, 높이 알 수 있음 import example from '/public/example.jpg'; v13 image 외부 이미지를 가지고올 때는 외부 이미지의 크기를 빌드 타임에 알 수 없으므로 반드시 크기를 명시해야함(width, height)..

SSR 완성된 html이 서버에서 만들어진 뒤 브라우저에 전송됨 페이지 이동시마다 새로 html을 내려줘야 해서 화면 깜박임, 초기 용량 작음 사용자가 많을 때 서버 부하 위험, 보안 유리 SEO에 좋음 CSR 빈 html 나머지는 자바스크립트로 동적으로 그림 화면 깜박임이 없음, 초기 용량 큼 js 캐시 가능, 서버 데이터가 필요할 경우 계속해서 서버와 통신해야 하므로 보안 취약 SEO에 저약 SSG(Static Site Generation) pre rendering : Static한 HTML을 빌드 타임에 미리 만들어 둠(SSR은 request time에) 서버 부하 없음, HTML 캐시 가능, SEO에 좋음 정적인 사이트에 사용 Next.js SSR, CSR, SSG의 장점을 제공 SSR/SSG의 ..

데이터가 다중 AZ 간에 복제되므로 가용성이 높음. 관리형 서버리스 NoSQL 데이터베이스 밀리초 수준의 지연 시간 SQL 쿼리 언어 사용 불가 예) 400KB 미만의 문서를 다루는 작은 서버리스 앱 개발, 서버리스 캐시 분산 NoSQL, 트랜잭션 지원 기능 데이터베이스가 내부에서 분산되므로 방대한 워크로드로 확장 가능 초당 수백만 개 요청 처리, 수조 개의 행, 수백 TB의 스토리지를 갖음(Millions of requests per seconds, trillions of row, 100s of TB of storage) 읽기와 쓰기가 완전히 분리돼 있음 빠르고 일관성이 높음(성능 한자리수 밀리초) 보안, 권한 부여, 관리 기능은 IAM 과 통합되어 있음 적은 비용, 오토 스케일링 유지관리 패치 필요 ..

JSESSIONID 톰캣 컨테이너에서 세션을 유지하기 위해 발급하는 키 즉, 세션에서 사용되는 쿠키 이름이다. HTTP는 stateless하기 떄문에, 새로운 연결이 생성되면 이전 연결은 끊기기 때문에 상태를 유지할 수 없다. 상태를 저장하기 위해 톰캣은 JSESSIONID 쿠키를 클라이언트에게 발급해주고 이 값으로 세션을 유지할 수 있도록 한다. JSESSIONID 동작방식 브라우저 최초 접근 -> Tomcat은 Response 헤더에 JSESSIONID 값 발급 Set-Cookie: JSESSIONID=3CB361E0BE1A9A7DE7DB926DF0772BAE 브라우저 재 요청 시 Response를 통해 받은 JSESSIONID를 Request 헤더의 쿠키에 값을 넣어 서버에 요청. 쿠키를 통해 JS..

S3 use cases • Backup and storage • Disaster Recovery • Archive • Hybrid Cloud storage • Application hosting • Media hosting • Data lakes & big data analytics • Software delivery • Static website S3 bucket 모든 리전과 모든 계정 통틀어서 글로벌리 유닉한 네임을 가져아 함 버킷은 리전 레벨에서 정의되고, 생성됨 Naming convention No uppercase, No underscore 3-63 characters long Not an IP Must start with lowercase letter or number S3 Objects ob..

Identity and Access Management 루트 계정은 가입시 자동으로 만들어지며 평소 사용을 지양하고, 공유하면 안됨 유저는 하나의 IAM에 할당 될 수 있음 그룹은 유저들만 포함할 수 있고 다른 그룹은 포함하지 않음 유저는 그룹에 꼭 속해야 되는 것은 아니지만, 다수의 그룹에 속할 수 있음 정책 유저 또는 그룹에 정책을 지정할 수 있음 유저의 권한을 제한함 최소의 권한만을 할당해야 함 정책 상속 정책 구조 MFA (Multi Factor Authentication) 패스워드 + 보안 장치 AWS에 액세스하는 3가지 방법 • AWS Management Console (protected by password + MFA) • AWS Command Line Interface (CLI): prot..

ec2 아마존 머신 이미지(AMI) 런칭할 인스턴스의 루트 데이터 볼륨에 어떤 OS와 어떤 애플리케이션 소프트웨어가 포함돼야 하는지 정보가 담긴 템플릿 Amazon quick start AMI 다양한 용도, 인기 좋음, 최신 기능, 공식 지원 제공 AWS 마켓플레이스 AMI 기업용 소프트웨어 벤더가 지원 제공하는 공식 상용 이미지 커뮤니티 AMI 독립적 벤더에 의해 특수 목적에 적합하도록 개발, 배포 프라이빗 AMI 직접 만드는 AMI EC2 인스턴스 타입 범용 타입 컴퓨트 최적화 메모리 최적화 가속 컴퓨팅 스토리지 최적화 AWS 리전 보통은 고객과 가까운 지역을 선택 법규에 의해 특정 지역을 선택할수도 리전별로 비용 기능 특징이 다를 수 있음

Math.max(), Math.min() 입력값으로 받은 0개 이상의 숫자 중 가장 큰(작은) 숫자를 반환합니다. console.log(Math.max(-1, -3, -2)); // -1 const array1 = [1, 3, 2]; console.log(Math.max(...array1)); //3 문자열이 들어가도 됨 리턴하는 값의 타입은 Number const str = "-1 -2 -3 -4"; const arr = str.split(" "); console.log(Math.max(...arr)); //-1 console.log(typeof Math.max(...arr));number Math.ceil() - 올림 - always rounds up and returns the smallest in..

GitLens 누가 어떤 코드를 푸쉬했는지 추적할 수 있게 해줍니다.

Javascript에서의 배열은 하나의 타입이 아니어도 되며, 연속적으로 이어져 있지 않은 sparse array입니다. 엄밀히 말하면 객체라고 볼 수 있습니다. Javascript에서의 배열 다음과 같이 index를 key로 가지며 length 를 갖는 특수한 객체입니다. 그렇기 때문에 다양한 형태의 타입들이 하나의 배열에 들어 가 있을 수 있죠. 이러한 JS의 배열은 어떠한 장단점을 갖을까요? ●장점 -요소의 삽입 삭제가 효율적이다. -다양한 자료구조를 담을 수 있다. - ... ◆단점 -요소의 접근이 해시테이블의 형태이기에 직접접근 보다 느리다. -> 모던 자바스크립트 엔진은 이를 어느정도 해결했다고 합니다. -배열 요소를 사용할 때 타입을 잘못인지하여 오류를 발생시킬 수 있다. - ... 그렇다면..