CORS (Cross-Origin Resource Sharing) 한 출처 (Origin) 에서 실행중인 웹 애플리케이션이 다른 출처의 리소스에 접근할 수 있도록 브라우저에 알려주는 체제입니다. 웹 브라우저는 보안상의 이유로 동일 출처 정책 (Same-Origin Policy, SOP) 을 따르는데, 이 정책은 스크립트가 자신이 속하지 않은 다른 ...

HMAC HMAC (Hash-based Message Authentication Code) 은 데이터의 무결성과 진위성을 검증하기 위해 사용되는 암호화 기술입니다. 비밀 키와 암호화 해시 함수를 결합하여, 메시지가 중간에 변경되지 않았으며 신뢰할 수 있는 출처로부터 왔음을 확인하는 데 사용됩니다. 작동 원리 송신자 - 수신자 간에 미리 공유된 비...

1. 클라이언트 사이드 렌더링 (CSR, Client-Side Rendering) 사용자의 브라우저 (클라이언트) 에서 자바스크립트를 이용해 동적으로 페이지를 렌더링하는 방식 작동 방식 사용자가 웹사이트에 접속하면 서버는 최소한의 HTML 파일과 자바스크립트 파일을 보냅니다. 브라우저는 이 자바스크립트 파일을 다운...

1. SSR (Server-Side Rendering) / SSG (Static Site Generation) 특징 서버가 데이터가 완전히 채워진 완성된 HTML 문서를 클라이언트에 응답으로 보냅니다. 페이지 소스에 최종적으로 보이는 모든 텍스트 콘텐츠가 포함되어 있습니다. 크롤링 전략: 정적 분석 (Sta...

Google Cloud를 활용한 서버리스 웹 서비스 아키텍처 구축기 GCP의 관리형 서비스를 조합하여 안정적인 웹 애플리케이션 아키텍처를 구축한 사례를 기록하고자 합니다. 프론트엔드와 백엔드 서버를 모두 Cloud Run Service에 배포하고, 로드밸런서를 통해 트래픽을 관리하며, Cloud CDN을 이용해 이미지와 같은 정적 콘텐츠를 사용자에게...

N+1 문제 하나의 쿼리로 N개의 데이터를 가져온 후, 각 데이터에 연결된 데이터를 얻기 위해 N번의 추가 쿼리가 발생하는 현상 example 100개의 게시글 목록을 가져오고, 각 게시글의 작성자 이름을 표시해야 하는 경우 posts = Post.objects.all() for po...

매번 VS Code로 글을 작성하기 번거로워서 노션 데이터베이스와 Github Blog (Jekyll) 을 연동하는 워크플로우를 생성했습니다. Github Actions를 통해 스크립트를 실행하고, 스케줄링합니다. Notion과 GitHub Blog 연동의 장점 효율적인 콘텐츠 작성: Notion은 마크다운을 비롯한 다양한 블록을 ...

Celery Executor 아키텍처 출처: https://medium.com/sicara/using-airflow-with-celery-workers-54cb5212d405 웹서버 Airflow의 UI를 제공하는 Flask 기반 웹 애플리케이션 UI를 통해 DAG 모니터링, Task 상태 확인, 커넥션 추가...

GCP Cloud Build로 배포 자동화 Github 레포지토리의 main 브랜치에 push가 발생할 경우 GCP Cloud Build에서 빌드 및 배포까지 실행하는 파이프라인을 만들어보았습니다. Cloud Build GCP Cloud Build > 트리거 > 트리거 만들기 이벤트: 브랜치로 푸시 ...

배경 12개 섹션에 대한 크롤링 + api 수집 작업을 마케터 분이 필요할 때 실행할 수 있도록 자동화 필요 12개의 작업은 모두 한 번에 실행되어야 함 (동시성이 중요) - 검색 결과 순위 등을 크롤링하기 때문 구글 스프레드 시트에서 키워드 목록을 읽어와 크롤링에 사용하고, 크롤링 결과를 다시 스프레드 시트에 작성해야 함 ECR 이...