[{"data":1,"prerenderedAt":338},["ShallowReactive",2],{"navigation_docs_ko":3,"-ko-project-brolog-outline":195,"-ko-project-brolog-outline-surround":333},[4,124,181],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":27},"Note (개발 지식)","emojione-v1:note-pad","\u002Fko\u002Fnote","ko\u002F1.note",[10,28,42,68,78,88,104,114],{"title":11,"icon":12,"path":13,"stem":14,"children":15,"page":27},"Spring","logos:spring-icon","\u002Fko\u002Fnote\u002Fspring","ko\u002F1.note\u002F0.spring",[16],{"title":17,"icon":18,"path":19,"stem":20,"children":21,"page":27},"Spring Ai","custom:ai","\u002Fko\u002Fnote\u002Fspring\u002Fspring-ai","ko\u002F1.note\u002F0.spring\u002F1.spring-ai",[22],{"title":23,"path":24,"stem":25,"icon":26},"Spring AI 핵심 개념과 LLM 애플리케이션 구조 이해","\u002Fko\u002Fnote\u002Fspring\u002Fspring-ai\u002Fspring-ai","ko\u002F1.note\u002F0.spring\u002F1.spring-ai\u002F1.spring-ai","lucide:file-text",false,{"title":29,"icon":30,"path":31,"stem":32,"children":33,"page":27},"Javascript","skill-icons:javascript","\u002Fko\u002Fnote\u002Fjavascript","ko\u002F1.note\u002F1.javascript",[34,38],{"title":35,"path":36,"stem":37,"icon":26},"Promise.all과 구조 분해 할당을 활용한 데이터 처리 패턴","\u002Fko\u002Fnote\u002Fjavascript\u002Fdestructuring","ko\u002F1.note\u002F1.javascript\u002F1.destructuring",{"title":39,"path":40,"stem":41,"icon":26},"JavaScript 배열 고차 함수와 데이터 처리 패턴 이해","\u002Fko\u002Fnote\u002Fjavascript\u002Ffilter","ko\u002F1.note\u002F1.javascript\u002F2.filter",{"title":43,"icon":44,"path":45,"stem":46,"children":47,"page":27},"Nuxt4","logos:nuxt-icon","\u002Fko\u002Fnote\u002Fnuxt4","ko\u002F1.note\u002F2.nuxt4",[48,52,56,60,64],{"title":49,"path":50,"stem":51,"icon":26},"Nuxt 4를 선택한 이유와 아키텍처 및 실무 가이드","\u002Fko\u002Fnote\u002Fnuxt4\u002Fnuxt-info","ko\u002F1.note\u002F2.nuxt4\u002F1.nuxt-info",{"title":53,"path":54,"stem":55,"icon":26},"Nuxt useAsyncData 동작 원리와 SSR 데이터 페칭 최적화","\u002Fko\u002Fnote\u002Fnuxt4\u002Fnuxt-use_async_data","ko\u002F1.note\u002F2.nuxt4\u002F2.nuxt-use_async_data",{"title":57,"path":58,"stem":59,"icon":26},"Nuxt Content v3 데이터 모델과 Query 시스템 이해","\u002Fko\u002Fnote\u002Fnuxt4\u002Fnuxt-content-v3","ko\u002F1.note\u002F2.nuxt4\u002F3.nuxt-content-v3",{"title":61,"path":62,"stem":63,"icon":26},"Nuxt Auto-imports 내부 동작과 컴파일 과정 분석","\u002Fko\u002Fnote\u002Fnuxt4\u002Fnuxt-auto-import","ko\u002F1.note\u002F2.nuxt4\u002F4.nuxt-auto-import",{"title":65,"path":66,"stem":67,"icon":26},"Nuxt 렌더링 방식 이해: SSR, SSG, ISR, CSR 구현 방법","\u002Fko\u002Fnote\u002Fnuxt4\u002Fnuxt-rendering-strategy","ko\u002F1.note\u002F2.nuxt4\u002F5.nuxt-rendering-strategy",{"title":69,"icon":70,"path":71,"stem":72,"children":73,"page":27},"Nitro","unjs:nitro","\u002Fko\u002Fnote\u002Fnitro","ko\u002F1.note\u002F3.nitro",[74],{"title":75,"path":76,"stem":77,"icon":26},"Nitro 아키텍처와 서버 엔진 구조","\u002Fko\u002Fnote\u002Fnitro\u002Fnitro","ko\u002F1.note\u002F3.nitro\u002Fnitro",{"title":79,"icon":80,"path":81,"stem":82,"children":83,"page":27},"Devops","vscode-icons:file-type-pipeline","\u002Fko\u002Fnote\u002Fdevops","ko\u002F1.note\u002F4.devops",[84],{"title":85,"path":86,"stem":87,"icon":26},"서버사이드 WebAssembly(Wasm)와 차세대 실행 환경","\u002Fko\u002Fnote\u002Fdevops\u002Fwebassembly","ko\u002F1.note\u002F4.devops\u002F1.webAssembly",{"title":89,"icon":90,"path":91,"stem":92,"children":93,"page":27},"Tooling","lucide:wrench","\u002Fko\u002Fnote\u002Ftooling","ko\u002F1.note\u002F4.tooling",[94],{"title":95,"icon":96,"path":97,"stem":98,"children":99,"page":27},"Package Manager","devicon:npm","\u002Fko\u002Fnote\u002Ftooling\u002Fpackage-manager","ko\u002F1.note\u002F4.tooling\u002F1.package-manager",[100],{"title":101,"path":102,"stem":103,"icon":26},"Package Lock 파일의 역할과 의존성 관리 원리","\u002Fko\u002Fnote\u002Ftooling\u002Fpackage-manager\u002Fpackage-lock","ko\u002F1.note\u002F4.tooling\u002F1.package-manager\u002F1.package-lock",{"title":105,"icon":106,"path":107,"stem":108,"children":109,"page":27},"Web","streamline-plump:web","\u002Fko\u002Fnote\u002Fweb","ko\u002F1.note\u002F4.web",[110],{"title":111,"path":112,"stem":113,"icon":26},"웹 애플리케이션 렌더링 아키텍처 이해","\u002Fko\u002Fnote\u002Fweb\u002Frendering-modes","ko\u002F1.note\u002F4.web\u002F2.rendering-modes",{"title":115,"icon":116,"path":117,"stem":118,"children":119,"page":27},"SEO","icon-park-solid:seo","\u002Fko\u002Fnote\u002Fseo","ko\u002F1.note\u002F6.seo",[120],{"title":121,"path":122,"stem":123,"icon":26},"[SEO] 개발 블로그 검색 노출을 위한 robots.txt와 SEO 설정 가이드","\u002Fko\u002Fnote\u002Fseo\u002Fseo","ko\u002F1.note\u002F6.seo\u002F1.seo",{"title":125,"icon":126,"path":127,"stem":128,"children":129,"page":27},"Project (개발일지)","icon-park-solid:branch-two","\u002Fko\u002Fproject","ko\u002F2.project",[130],{"title":131,"icon":132,"path":133,"stem":134,"children":135,"page":27},"Brolog","custom:symbol","\u002Fko\u002Fproject\u002Fbrolog","ko\u002F2.project\u002F1.brolog",[136,140,144,148,152,156,160,164,168,173,177],{"title":137,"path":138,"stem":139,"icon":26},"Brolog 프로젝트 개요","\u002Fko\u002Fproject\u002Fbrolog\u002Foutline","ko\u002F2.project\u002F1.brolog\u002F1.outline",{"title":141,"path":142,"stem":143,"icon":26},"[Brolog] Nuxt Multi Layer 프로젝트 Vercel 배포 (3) - Runtime 기능 문제 분석과 AI Assistant 전환","\u002Fko\u002Fproject\u002Fbrolog\u002Fvercel-deploy3-ai-integration","ko\u002F2.project\u002F1.brolog\u002F10.vercel-deploy3-ai-integration",{"title":145,"path":146,"stem":147,"icon":26},"[Brolog] AI Assistant 적용 과정 - Agent 구조와 API 사용량 관리 시 고려사항","\u002Fko\u002Fproject\u002Fbrolog\u002Fai-assistant-application-process","ko\u002F2.project\u002F1.brolog\u002F11.ai-assistant-application-process",{"title":149,"path":150,"stem":151,"icon":26},"[Brolog] 검색 엔진 노출을 위한 SEO 적용 과정","\u002Fko\u002Fproject\u002Fbrolog\u002Fbrolog-seo","ko\u002F2.project\u002F1.brolog\u002F12.brolog-seo",{"title":153,"path":154,"stem":155,"icon":26},"Brolog 프로젝트 구조","\u002Fko\u002Fproject\u002Fbrolog\u002Fstructure","ko\u002F2.project\u002F1.brolog\u002F2.structure",{"title":157,"path":158,"stem":159,"icon":26},"[Nuxt Content] 네비게이션 아이콘 커스텀 빌드","\u002Fko\u002Fproject\u002Fbrolog\u002Fcustom-icon","ko\u002F2.project\u002F1.brolog\u002F3.custom-icon",{"title":161,"path":162,"stem":163,"icon":26},"[Nuxt 4] Auto-imports 동작 원리와 자동 import 시스템 이해","\u002Fko\u002Fproject\u002Fbrolog\u002Fnuxt-auto-import","ko\u002F2.project\u002F1.brolog\u002F4.nuxt-auto-import",{"title":165,"path":166,"stem":167,"icon":26},"[Brolog] 개발 블로그 메인 페이지 구현","\u002Fko\u002Fproject\u002Fbrolog\u002Fdevelop-main","ko\u002F2.project\u002F1.brolog\u002F5.develop-main",{"title":169,"path":170,"stem":171,"icon":172},"[Brolog] 브랜드 아이덴티티 적용 - Custom 404 페이지와 Default No Image 구현","\u002Fko\u002Fproject\u002Fbrolog\u002Fcustom-error-and-default-thumbnail","ko\u002F2.project\u002F1.brolog\u002F6.custom-error-and-default-thumbnail","lucide:image",{"title":174,"path":175,"stem":176,"icon":26},"[Brolog] Nuxt Multi Layer 프로젝트 Vercel 배포 (1)","\u002Fko\u002Fproject\u002Fbrolog\u002Fvercel-deploy1","ko\u002F2.project\u002F1.brolog\u002F8.vercel-deploy1",{"title":178,"path":179,"stem":180,"icon":26},"[Brolog] Nuxt Multi Layer 프로젝트 Vercel 배포 (2) - Build Pipeline 오류 분석과 Nuxt 실행 구조 이해","\u002Fko\u002Fproject\u002Fbrolog\u002Fvercel-deploy2-error-analyze","ko\u002F2.project\u002F1.brolog\u002F9.vercel-deploy2-error-analyze",{"title":182,"icon":183,"path":184,"stem":185,"children":186,"page":27},"Error (트러블슈팅)","emojione:stop-sign","\u002Fko\u002Ftrouble-shooting","ko\u002F3.trouble-shooting",[187],{"title":131,"icon":132,"path":188,"stem":189,"children":190,"page":27},"\u002Fko\u002Ftrouble-shooting\u002Fbrolog","ko\u002F3.trouble-shooting\u002F1.brolog",[191],{"title":192,"path":193,"stem":194,"icon":26},"[Nuxt Content] Nuxt Icon 오류 해결과 Custom Collection 기반 오프라인 아이콘 구성","\u002Fko\u002Ftrouble-shooting\u002Fbrolog\u002Fnuxt-icon-restricted-network-troubleshooting","ko\u002F3.trouble-shooting\u002F1.brolog\u002F1.nuxt-icon-restricted-network-troubleshooting",{"id":196,"title":137,"body":197,"date":319,"description":320,"extension":321,"links":322,"meta":323,"navigation":329,"path":138,"seo":330,"stem":139,"__hash__":332},"docs_ko\u002Fko\u002F2.project\u002F1.brolog\u002F1.outline.md",{"type":198,"value":199,"toc":311},"minimark",[200],[201,202,204,217,227,230,235,238,241,244,246,250,253,256,259,261,265,268,275,278,281,288,290,294,297,300,303,306,309],"u-page-card",{":spotlight":203},"true",[205,206,211],"div",{"className":207},[208,209,210],"flex","justify-center","my-8",[212,213],"img",{"alt":214,"src":215,"width":216},"Brolog Logo","\u002Flogo\u002Flogo.png",250,[218,219,220],"blockquote",{},[221,222,223,226],"p",{},[224,225,131],"strong",{},"는 개발 과정에서 배우는 내용과 문제 해결 과정을 기록하기 위해 시작한 개인 개발 블로그 프로젝트입니다.",[228,229],"hr",{},[231,232,234],"h2",{"id":233},"프로젝트-소개","📖 프로젝트 소개",[221,236,237],{},"Brolog는 개발하면서 남기고 싶은 기록들을 한곳에 정리하기 위해 만든 프로젝트다.",[221,239,240],{},"공부한 내용을 정리하거나, 기능을 구현하며 겪은 문제를 기록하고, 프로젝트를 진행하면서 했던 고민들을 꾸준히 남기는 것을 목표로 한다.",[221,242,243],{},"시간이 지난 뒤에도 다시 참고할 수 있는 개인 개발 아카이브가 되었으면 한다.",[228,245],{},[231,247,249],{"id":248},"개발-배경","🚀 개발 배경",[221,251,252],{},"원래는 LLM과 AI를 활용한 새로운 토이 프로젝트를 먼저 진행할 계획이었다.",[221,254,255],{},"하지만 프로젝트를 구상하는 과정에서 학습한 내용과 시행착오를 체계적으로 기록할 공간이 필요하다고 느꼈고, 이후 진행할 프로젝트들의 기반이 될 개인 블로그를 먼저 개발하게 되었다.",[221,257,258],{},"앞으로 진행할 다양한 프로젝트의 개발 과정과 기술적인 고민, 문제 해결 경험 역시 이곳에 함께 기록할 예정이다.",[228,260],{},[231,262,264],{"id":263},"개발-방향","🎯 개발 방향",[221,266,267],{},"Brolog는 처음부터 모든 기능을 직접 구현하는 것을 목표로 하지 않았다.",[221,269,270,271,274],{},"앞으로 진행할 프로젝트에 더 많은 시간을 투자하기 위해, 기본적인 블로그 구조는 ",[224,272,273],{},"Docus Theme","를 활용하여 빠르게 구축했다.",[221,276,277],{},"반복적으로 필요한 초기 세팅에 시간을 소비하기보다, 검증된 구조를 기반으로 시작하고 필요한 기능만 직접 구현하는 방향을 선택했다.",[221,279,280],{},"프로젝트를 진행하면서 필요한 기능은 점진적으로 추가하고 개선해 나갈 예정이다.",[218,282,283],{},[221,284,285],{},[224,286,287],{},"반복되는 초기 세팅보다, 프로젝트 자체에 더 많은 시간을 투자한다.",[228,289],{},[231,291,293],{"id":292},"마무리","💭 마무리",[221,295,296],{},"Brolog는 완성된 서비스를 만드는 것을 목표로 시작한 프로젝트가 아니다.",[221,298,299],{},"앞으로 진행할 다양한 프로젝트를 기록하고, 개발하면서 마주하는 문제와 해결 과정을 정리하기 위한 개인 아카이브에 가깝다.",[221,301,302],{},"프로젝트가 하나씩 늘어날수록 자연스럽게 기록도 함께 쌓이고, 시간이 지난 뒤에도 다시 참고할 수 있는 공간이 되었으면 한다.",[221,304,305],{},"또한 새로운 프로젝트를 시작할 때마다 반복되는 환경 구성에 시간을 소비하기보다, 이미 구축된 기반 위에서 개발에 더 집중할 수 있는 출발점의 역할도 함께 담당하게 될 것이다.",[221,307,308],{},"이곳에 작성되는 모든 글은 실제 프로젝트를 진행하며 경험한 내용을 바탕으로 작성하며, 잘된 결과뿐 아니라 시행착오와 고민했던 과정까지 함께 기록해 나갈 예정이다.",[228,310],{},{"title":312,"searchDepth":313,"depth":313,"links":314},"",2,[315,316,317,318],{"id":233,"depth":313,"text":234},{"id":248,"depth":313,"text":249},{"id":263,"depth":313,"text":264},{"id":292,"depth":313,"text":293},"2026-07-07","개발 기록을 위한 개인 블로그 프로젝트의 목적과 방향","md",null,{"tags":324,"image":328},[325,326,327],"Blog","Nuxt","Project","\u002Fimages\u002Fbrolog-ogimage.png",{"icon":26},{"title":137,"description":331},"Nuxt 4와 Nuxt Content 기반으로 개발하는 개인 개발 블로그 프로젝트 소개","ta4o49nEGMkNTLJdVr538tMdm2kZP5NDMoFk6VkIMm8",[334,336],{"title":121,"path":122,"stem":123,"description":335,"icon":26,"children":-1},"개인 개발 블로그를 검색 엔진에 정상적으로 노출하기 위해 필요한 robots.txt, sitemap.xml, canonical URL, Google Search Console, RSS 설정과 검색 최적화 방법을 정리합니다.",{"title":141,"path":142,"stem":143,"description":337,"icon":26,"children":-1},"Nuxt Multi Layer 프로젝트를 Vercel에 배포한 이후 발생한 Nuxt OG Image와 AI Assistant 문제를 분석하고 Build 방식 전환, Google AI Studio 적용 과정과 SDK 버전 충돌 해결 과정을 기록합니다.",1785305905096]