본문 바로가기

Category/Note

 (80)
구글 폰트 아래 링크에서 원하는 폰트를 클릭해 확인해보고 프로젝트에 적용할 수 있다. Variable Fonts - Google FontsMaking the web more beautiful, fast, and open through great typographyfonts.google.com
IntelliJ에서 MCP Server 사용하기 IntelliJ IDE에서 File >> Settings >> Plugins 탭으로 이동하여 MCP Server를 검색하고 설치합니다. MCP Server - IntelliJ IDEs Plugin | MarketplaceMCP (Model Context Protocol) Server for IntelliJ IDEs This plugin integrates the MCP server into IntelliJ-based IDEs, enabling seamless communication between Large...plugins.jetbrains.com아래 링크에 접속하여 Claude Desktop을 설치합니다. Download ClaudeDownload Claude for your desktop or mo..
더미 이미지 더미 이미지가 필요할 땐, 로렘 픽숨 (Lorem Picsum)웹 개발을 하면서 가끔 더미 텍스트가 필요할 때, 로렘 입숨(Lorem Ipsum)을 사용해 보셨을 겁니다. 로렘 입숨(Lorem Ipsum)은 문서나 웹 퍼블리싱, 프론트개발을 할 때 더미 글이 필요할 경우 자주 사용wooncloud.tistory.com
비동기 메시지 기반 시스템 구축 RabbitMQ & Kafka 비교 요약 항목 RabbitMQ Kafka구조메시지 브로커 (큐 기반)분산 로그 기반 메시지 스트리밍용도작업 큐, 비동기 요청 처리실시간 로그/이벤트 스트리밍메시지 처리 방식Push (consumer에게 전달)Pull (consumer가 직접 가져감)메시지 순서 보장보장파티션 기준 순서 보장지향하는 목적워크 큐, 백오피스 이벤트 처리실시간 데이터 파이프라인, 로그 수집RabbitMQ 구현 (NestJS 기반)사용 예: 이메일 발송, 슬랙 알림 등 "백그라운드 처리"1. RabbitMQ 설치 필요 (Docker)docker run -d --hostname rabbit --name rabbitmq -p 5672:56..
터미널에서 mermaid 파일 변환하기 vs-code 터미널에 아래 명령어를 입력하여 mermaid-cli를 설치합니다.npm install -g @mermaid-js/mermaid-cli 아래의 diagram.mmd 처럼 원하는 내용으로 파일을 생성합니다. 간단하게 gpt에 '로그인 흐름을 정리한 mermaid 작성해줘.' 라고 입력하여 생성해 봅니다.sequenceDiagram participant Client participant Frontend participant Backend participant Redis Note over Client,Frontend: 1. 로그인 요청 Client->>Frontend: 로그인 정보 입력 Frontend->>Backend: POST /auth/login (id..
express-generator npm i express-generator -gexpress 프로젝트 생성express -h 명령어 확인npm installwww 파일 port 3000->9999npm start app
성능 측정 지표 Core Web Vitals (LCP, INP, CLS) 알아보기 1. LCP (Largest Contentful Paint)👉 페이지에서 가장 큰 콘텐츠(예: 이미지, 텍스트 블록)가 화면에 렌더링되는 데 걸리는 시간항목설명의미유저가 페이지 로딩이 끝났다고 느끼는 시점대상 요소큰 이미지, , 등의 텍스트 블록기준 (좋음)2.5초 이하면 우수개선 방법이미지 최적화, 서버 응답 속도 개선, 폰트 로딩 최적화💡 예시:사용자가 사이트에 들어왔을 때, 화면 대부분을 차지하는 배너 이미지가 2.3초만에 나타나면 → LCP = 2.3s2. INP (Interaction to Next Paint)**👉 사용자가 버튼을 누르거나 입력을 했을 때, 화면에 반응이 렌더링되기까지 걸린 시간항목설명의미반응성(Responsiveness) 측정대상클릭, 키보드 입력 등 모든 사용자 인터..
RESTful API의 핵심 설계 원칙 REST는 자원 중심(Resource-Oriented) 이기 때문에,URL은 "무엇을" 다루는지 (명사)를 표현하고,HTTP 메서드(GET, POST 등)는 "어떻게" 처리할지를 표현해야 함.잘못된 방식 (행위 중심)GET /getItemPOST /createItemDELETE /deleteItem?id=1메서드 이름을 URL에 표현하는 건 RESTful하지 않음HTTP 메서드 자체가 이미 의미를 내포하고 있기 때문에 중복바람직한 방식 (자원 중심)GET /items // 아이템 목록 조회GET /items/123 // 특정 아이템 조회POST /items // 아이템 생성PUT /items/123 // 아이템 수정DELETE /items/123 ..

티스토리툴바