⭐️sihanni

글 목적https://sihanni.tistory.com/258 [Catarie] 회고Catarie 는.. Catarie는 개인 포트폴리오 목적으로 시작하게된 프로젝트로, 유튜브 쇼츠형 SNS 플랫폼입니다.저는 프로젝트 주제를 선정할 때 저에게 부족한 기술이나 다뤄보지 않았던 기술에 대해서sihanni.tistory.com지난번에 Catarie 서비스 종료를 하고 아직 정리를 하지 못한 aws 서비스를 정리하며 VPC 구성을 복기하는 글입니다.VPCCatarie의 VPC(Virtual Private Cloud) 구조VPC는 AWS 클라우드 서비스 내에서 사용자가 정의하는 논리적으로 분리된 가상 네트워크입니다. IP 주소 범위, 서브넷, 라우팅 테이블 등을 직접 제어할 수 있습니다. 이 VPC는 AWS 리..

Catarie 는.. Catarie는 개인 포트폴리오 목적으로 시작하게된 프로젝트로, 유튜브 쇼츠형 SNS 플랫폼입니다.저는 프로젝트 주제를 선정할 때 저에게 부족한 기술이나 다뤄보지 않았던 기술에 대해서 가장 먼저 고민하게 됩니다. 그리고 관련 실제 서비스들 중에서 아쉬운 점을 생각하며 어떤 것을 개발할지 정하는 편입니다. 때마침 영상 스트리밍 관련 서비스를 하는 회사의 면접을 준비하면서 스트리밍 기술에 관심이 생기게 되었고, 순수하게 음악과 관련된 콘텐츠만 모인 쇼츠형 플랫폼을 만들고자하게 되었습니다. Catarie라는 이름은 여러 음원이나 영상 콘텐츠들이 자유롭게 이 서비스에 모이길 바라는 마음에 Cataract (영어로 폭포, 급류의 의미)에서 차용해왔습니다. TMI로 현대에는 왠만한 .com 도..

Catarie를 드디어 세상에 내놓고 터진 도파민은 얼마 못가 식어버렸는데, 버튼 이미지가 이상하게 보이는 것이었다.Next.js next/image 는 /_next/image?url=...&w=...&q=... 형태로 쿼리스트링에 의존하게 되는데 CloudFront가 쿼리스트링을 캐시 키에 포함하지 않으면, 서로 다른 이미지가 같은 캐시 오브젝트로 덮여서 뒤바뀌어 보인다고 한다.즉, 코드에 /public/images/*.png를 넣었더라도 를 쓰는 순간 Next의 이미지 최적화 프록시 (/_next/image)를 타게 되고, 여기서 캐시 키 설정을 잘못하면 아이콘이 뒤바뀐다는 것이다!/_next ..?/_next/* 는 Next.js가 내부적으로 사용하는 내부 전용 경로이다. 빌드 산출물(JS/CSS ..

문제 정리video의 경우 hls 변환이 잘 되지만, audio의 경우 hls 변환 실패핵심 원인 2가지이중 워커 경합: TranscodeProcessor(Nest provider)가 onModuleInit에서 BullMQ Worker('transcode')를 띄워 잡을 가로채고 true로 바로 완료시킴. 동시에 worker.ts도 같은 큐를 소비 → 일부 잡이 처리 없이 completed(true).오디오 파이프라인 부재: transcode.ts가 비디오만 고려. mp3는 HLS 변환 경로가 없어 READY/hlsKey가 세팅되지 않음.부수 증상GET /uploads/media/:id/status가 READY 전엔 400을 반환 → 폴링 도구에서 “실패처럼” 보임.S3 .m4s Content-Type ..

HLS ?HLS (HTTP Live Streaming) 는 Apple이 개발한 HTTP 기반의 적응형 스트리밍 프로토콜이다. 비디오를 작은 조각으로 나누어 전송하며 네트워크 환경에 따라 실시간으로 화질을 조절하여 끊김 없이 스트리밍을 가능하게 한다.긴 영상을 작은 청크(조각)로 잘라서 스트리밍하는 방식이다. 영상 전체를 한 번에 받는 게 아니라, 재생 플레이어가 필요한 순간에 작은 조각만 다운로드 하면서 이어 붙여 보여주는 방식이다.그래서 네트워크가 끊기거나 느려도 중간부터 이어서 볼 수 있고, 적응형 화질(Adaptive Bitrate)도 쉽게 구현 가능하다.즉, HLS는 mp4/mp3 원본을 FFmpeg 같은 도구로 트랜스코딩해서 m3u8 + ts 세그먼트로 변환환 뒤, 클라이언트는 이르 조립하듯 이..

어제 한 것Gavarnie 프로젝트 기획Docker Compose를 통한 로컬 인프라 구성 (MySQL, Redis, MongoDB, MinIO, Nginx)환경 변수 세팅, MinIO, Nginx 동작 검증 (media 버킷 생성 및 download 정책 적용)샘플 업로드 후 직접이 부분에 대해서는 좀 더 스터디가 필요함.백엔드 애플리케이션 (API, WORKER) 생성인프라 헬스 체크 구성 아직 잘 이해하지 못한 부분 정리MinIO 오픈소스 기반의 오브젝트 스토리지 시스템인데, 쉽게 말해서 AWS S3와 똑같은 방식으로 파일(객체)을 저장/관리할 수 있는 자체 서버라고 보면 된다.영상, 음원 같은 대용량 미디어 파일을 효율적으로 저장 가능케해주고, S3 API와 호환이되어서 나중에 AWS S3으로 이..

시작영상이나 음원 데이터 처리에 대한 서비스를 개발해보면 재밌을 것 같았고, 관련 기술의 숙련도를 올리고 싶어서 시작하게 된 프로젝트이다.서비스 이름의 아이디어는 폭포에서 시작되었다. 영상이나 음원 데이터는 기본적으로 버퍼 -> 패킷화 -> 스트리밍의 기술적인 과정을 거치는 것이 물방울 들이 모여서 떨어져 폭포를 이루는 것이 연상되기도하고, 폭포에서 떨어진 물이 한 곳에 모이는 것 처럼 모든 음원과 영상이 한 곳으로 모이길 바라는 마음이었다. 그리고 개인적으로 프랑스를 좋아해서 찾아보니 프랑스에서 가장 큰 폭포가 gavarnie라고 해서 서비스의 이름은 Gavarnie가 되었다. Buffer, Packet, Stream영상, 음원을 다루려면 이 세가지를 잘 알아야하는데, 여태까지 음원이나 영상 데이터를 ..

https://sihanni.tistory.com/180 [nestJS] 티켓 예약 시스템 구축 - 6 (통합 테스트)티켓 예매 시스템 설계 구조주요 서버 목록과 역할user-service : 회원가입, 로그인 websocket-service (핵심)실시간 대기열을 관리하고, 이벤트별로 TPS를 달리하여 제어사용자 접속시 대기열에 등록 (redisihanni.tistory.com로컬 환경에서 테스트 중에 대기열 시스템에 과부하가 와버렸다. 더 확실히 원인을 찾고 나아가 서버 스펙별로 적절한 TPS를 찾는 방법을 공부 해보고 대기열 시스템을 개선해보고자 한다. 1. 현재 대기열 시스템의 구조Redis를 사용하여 event 별로 예약 요청인원을 저장하고 일정 시간마다 대기열에서 FIFO(First In Fi..

티켓 예매 시스템 설계 구조주요 서버 목록과 역할user-service : 회원가입, 로그인 websocket-service (핵심)실시간 대기열을 관리하고, 이벤트별로 TPS를 달리하여 제어사용자 접속시 대기열에 등록 (redis 사용)3초(조정 가능)마다 현재 대기 순번을 클라이언트에게 실시간 전송TPS worker를 통해 한 번에 입장할 사용자 수를 제한함 (redis 사용)웹소켓 연결이 끊긴다면 대기열에서 제거TTL 만료된 좌석을 회수하면 다음 대기열 사용자에게 자동 입장 권한 부여event-service : 공연 등록, 공연 정보 확인, 현재 활성화된 공연이벤트 정보를 redis에 주기적으로 업데이트seat-service : 공연장 등록, 공연장 좌석 등록reservation-service (핵..

개요높은 트래픽 처리와 그에 따라 발생하는 DB 락을 경험해보고자 NestJS 기반 MSA 구조의 티켓 예매 시스템 개발을 진행 중 구성 서비스 user-service : 회원가입, 로그인, 인증 처리를 담당하는 서버event-service : 공연 정보 등록, 조회를 담당하는 서버seat-service : 공연장의 좌석 등록, 공연장 등록 및 조회를 담당하는 서버reservation-service : 좌석 예약 요청, 락 처리, 예약 완료 처리를 하는 서버payment-service : 결제(현재 더미)를 담당하는 서버api-gateway : (작업 예정) 통합 엔드포인트websocket-service : (작업 예정) 대기열 시스템 및 실시간 순번 안내테스트현재 메세지 브로커로 카프카를 사용중이며 r..