{"componentChunkName":"component---src-pages-index-js","path":"/","result":{"data":{"site":{"siteMetadata":{"title":"Bottlehs Tech Blog","description":"웹·앱·AI 개발자 전병훈(bottlehs)의 기술 블로그. AI·LLM, JavaScript·Vue, Spring Boot, 알고리즘, 블록체인 실무 가이드를 다룹니다","siteUrl":"https://www.bottlehs.dev","author":{"name":"Jeon Byung Hun","summary":"개발을 즐기는 bottlehs - Engineer, MS, AI, FE, BE, OS, IOT, Blockchain, 설계, 테스트"},"social":{"github":"bottlehs","codepen":"bottlehs"}}},"allMarkdownRemark":{"nodes":[{"excerpt":"Drizzle ORM 가이드 관계형 데이터베이스 위에 TypeScript 서비스를 올릴 때, 개발자는 오랫동안 두 갈래 사이에서 고민해 왔다. 한쪽은 객체–관계 매핑(ORM) 의 편의성이고, 다른 한쪽은 SQL의 예측 가능성과 성능이다. Prisma…","fields":{"slug":"/etc/Drizzle-ORM과-PostgreSQL-스키마-마이그레이션-운영-완전-가이드/"},"frontmatter":{"date":"2026년 4월 15일","dateISO":"2026-04-15T06:00:00.000Z","title":"Drizzle ORM과 PostgreSQL — 스키마·마이그레이션·운영 완전 가이드","category":"etc","description":"TypeScript 친화적 ORM인 Drizzle의 철학과 pg 스키마 정의, drizzle-kit으로 마이그레이션을 다루는 방법, 관계·쿼리 빌더·트랜잭션 패턴, 프로덕션 운영 시 인덱스·연결 풀·관측 포인트까지 한 번에 정리한다.","tags":["Drizzle ORM","PostgreSQL","TypeScript","마이그레이션","drizzle-kit","백엔드","데이터베이스"]}},{"excerpt":"MCP 실전 가이드 생성형 AI가 코드를 작성하고 리팩터링하는 시대에, “우리 팀의 내부 API 문서”, “사내 지식 DB”, “운영 중인 대시보드”, “특정 CLI 도구”까지 한 번에 묶어 주는 것이 새로운 병목이 되었다. REST…","fields":{"slug":"/etc/MCP-Model-Context-Protocol-실전-가이드-AI-에디터에-도구를-붙이는-방법/"},"frontmatter":{"date":"2026년 4월 15일","dateISO":"2026-04-15T06:00:00.000Z","title":"MCP(Model Context Protocol) 실전 가이드 — AI 에디터에 도구를 붙이는 방법","category":"etc","description":"Model Context Protocol의 구조와 호스트·클라이언트·서버 관계를 정리하고, TypeScript로 MCP 서버를 구현하는 예제, Cursor 등 IDE 연동, 보안·권한·운영 시 고려할 점까지 실무 관점에서 상세히 다룬다.","tags":["MCP","Model Context Protocol","Cursor","AI","TypeScript","개발 생산성","도구 통합"]}},{"excerpt":"k…","fields":{"slug":"/etc/k6-부하-테스트-시나리오-설계와-GitHub-Actions-CI-게이트/"},"frontmatter":{"date":"2026년 4월 15일","dateISO":"2026-04-15T06:00:00.000Z","title":"k6 부하 테스트 — 시나리오 설계와 GitHub Actions CI 게이트까지","category":"etc","description":"Grafana k6로 부하 테스트 스크립트를 작성하는 법, RPS·스테이지·임계값 설계, 메트릭 해석, 그리고 GitHub Actions에서 성능 회귀를 막는 CI 게이트 패턴까지 실무 중심으로 정리한다.","tags":["k6","부하 테스트","성능","GitHub Actions","CI","SRE","관측 가능성"]}},{"excerpt":"기술 부채와의 전쟁…","fields":{"slug":"/etc/기술-부채와-의-전쟁-2년간-쌓인-기술-부채를-해결한-여정/"},"frontmatter":{"date":"2026년 1월 5일","dateISO":"2026-01-05T08:00:00.000Z","title":"기술 부채와의 전쟁 - 2년간 쌓인 기술 부채를 해결한 여정","category":"etc","description":"2년간 쌓인 기술 부채를 해결하기 위해 시작한 여정을 기록한다. 기술 부채가 쌓인 이유, 해결 시도와 실패, 단계적 해결 전략, 팀과의 협력, 그리고 완전히 해결하지 못한 것들까지 솔직하게 공유한다.","tags":["기술 부채","리팩토링","프로젝트 경험","개발자 경험","회고","코드 품질"]}},{"excerpt":"…","fields":{"slug":"/etc/오픈소스-기여-첫-경험-작은-PR-하나가-주는-의미/"},"frontmatter":{"date":"2026년 1월 5일","dateISO":"2026-01-05T07:45:00.000Z","title":"오픈소스 기여 첫 경험 - 작은 PR 하나가 주는 의미","category":"etc","description":"오픈소스에 첫 기여를 하며 겪은 경험을 솔직하게 공유한다. PR 작성과 리뷰 받기, 거절당한 경험, 수정 후 승인까지의 과정과 오픈소스 커뮤니티의 따뜻함을 담았다.","tags":["오픈소스","GitHub","기여","개발자 경험","회고","커뮤니티"]}},{"excerpt":"성능 최적화의 함정 Lighthouse 점수가 60점에서 95점으로 올라갔다. Core Web Vitals도 모두 “Good…","fields":{"slug":"/javascript/성능-최적화의-함정-Core-Web-Vitals-개선하다가-사용자-경험이-나빠진-케이스/"},"frontmatter":{"date":"2026년 1월 5일","dateISO":"2026-01-05T07:30:00.000Z","title":"성능 최적화의 함정 - Core Web Vitals 개선하다가 사용자 경험이 나빠진 케이스","category":"javascript","description":"Core Web Vitals 점수를 올리기 위해 성능 최적화를 진행했지만, 오히려 사용자 경험이 나빠진 경험을 공유한다. 점수는 올랐지만 사용자 불만이 증가한 이유와 균형점을 찾는 과정을 솔직하게 기록한다.","tags":["성능 최적화","Core Web Vitals","웹 성능","실패 경험","프로젝트 경험","개발자 경험","회고"]}},{"excerpt":"사이드 프로젝트가 실패한 이유 “이번엔 꼭 성공하자”라고 다짐하며 시작한 사이드 프로젝트였다. 하지만…","fields":{"slug":"/etc/사이드-프로젝트가-실패한-이유-3개월-만에-포기한-프로젝트-회고/"},"frontmatter":{"date":"2026년 1월 5일","dateISO":"2026-01-05T07:15:00.000Z","title":"사이드 프로젝트가 실패한 이유 - 3개월 만에 포기한 프로젝트 회고","category":"etc","description":"3개월 동안 진행했던 사이드 프로젝트를 포기한 이유를 솔직하게 공유한다. 기술 스택 선택의 실수, 시간 관리 실패, 동기 부족 등 구체적인 실패 원인과 다음 프로젝트를 위한 교훈을 담았다.","tags":["사이드 프로젝트","실패 경험","프로젝트 경험","개발자 경험","회고","교훈"]}},{"excerpt":"AI 코딩 어시스턴트 도입 3개월 후기 Cursor를 도입한 지 3개월이 지났다. 처음에는 생산성이 2배,…","fields":{"slug":"/etc/AI-코딩-어시스턴트-도입-3개월-후기-생산성은-올랐지만-불안감도-생겼다/"},"frontmatter":{"date":"2026년 1월 5일","dateISO":"2026-01-05T07:00:00.000Z","title":"AI 코딩 어시스턴트 도입 3개월 후기 - 생산성은 올랐지만 불안감도 생겼다","category":"etc","description":"Cursor를 도입한 지 3개월이 지난 후기를 솔직하게 공유한다. 초기 생산성 향상의 기쁨, 점점 생기는 불안감, 기본기 저하에 대한 우려, 그리고 균형을 찾는 과정을 담았다.","tags":["AI 코딩","Cursor","개발자 경험","생산성","회고","개발 도구"]}},{"excerpt":"팀 코드 리뷰 문화 만들기 코드 리뷰를 도입하겠다고 했을 때, 팀원들의 반응은 냉랭했다. “시간만 낭비하는 거 아니야?”, “내 코드를 지적받는 게 싫어”라는 반응이었다. 하지만…","fields":{"slug":"/etc/팀-코드-리뷰-문화-만들기-처음엔-싫어했지만-지금은-없어서는-안-될-것/"},"frontmatter":{"date":"2026년 1월 5일","dateISO":"2026-01-05T06:45:00.000Z","title":"팀 코드 리뷰 문화 만들기 - 처음엔 싫어했지만 지금은 없어서는 안 될 것","category":"etc","description":"코드 리뷰 문화를 도입하며 겪은 저항과 갈등, 그리고 결국 정착시킨 과정을 기록한다. 처음엔 싫어했던 팀원들이 어떻게 코드 리뷰의 가치를 깨달았는지, 문화를 만드는 데 필요한 것들을 솔직하게 공유한다.","tags":["코드 리뷰","팀 문화","협업","개발자 경험","회고","팀워크"]}},{"excerpt":"서버리스로 옮겼다가 다시 돌아온 이야기 서버리스는 마법처럼 보였다. 서버 관리 없이 코드만 배포하면 되고, 사용한 만큼만 비용을 지불한다. “이게 미래다!”라고 생각하며 우리 API를 AWS Lambda로 옮겼다. 하지만 4개월 후, 우리는 다시 EC…","fields":{"slug":"/etc/서버리스로-옮겼다가-다시-돌아온-이야기-Lambda-Cold-Start의-현실/"},"frontmatter":{"date":"2026년 1월 5일","dateISO":"2026-01-05T06:30:00.000Z","title":"서버리스로 옮겼다가 다시 돌아온 이야기 - Lambda Cold Start의 현실","category":"etc","description":"AWS Lambda로 서버리스 아키텍처를 도입했다가 다시 전통적인 서버로 돌아온 경험을 공유한다. Cold Start 문제, 비용 폭증, 사용자 불만 등 구체적인 문제들과 결국 되돌린 이유를 솔직하게 기록한다.","tags":["Serverless","AWS Lambda","실패 경험","프로젝트 경험","개발자 경험","회고","Cold Start"]}},{"excerpt":"레거시 코드 마이그레이션 6개월 10만 줄의 JavaScript 코드를 TypeScript로 옮기는 작업을 시작했을 때, 나는 이게 이렇게 어려울 줄 몰랐다. “타입만 추가하면 되지 않을까?”라는 순진한 생각으로 시작했지만, 현실은 달랐다.…","fields":{"slug":"/javascript/레거시-코드-마이그레이션-6개월-JavaScript에서-TypeScript로-옮기며-배운-것들/"},"frontmatter":{"date":"2026년 1월 5일","dateISO":"2026-01-05T06:15:00.000Z","title":"레거시 코드 마이그레이션 6개월 - JavaScript에서 TypeScript로 옮기며 배운 것들","category":"javascript","description":"10만 줄의 JavaScript 코드베이스를 TypeScript로 마이그레이션한 6개월의 여정을 기록한다. 팀 내부 반대, 점진적 마이그레이션 전략, 예상치 못한 문제들, 그리고 결국 성공한 과정을 솔직하게 공유한다.","tags":["TypeScript","마이그레이션","레거시 코드","프로젝트 경험","개발자 경험","회고","JavaScript"]}},{"excerpt":"모노레포 도입 실패기 모노레포는 대규모 프로젝트 관리의 해결책처럼 보였다. 코드 공유가 쉬워지고, 일관성 있는 개발 환경을 만들 수 있다는 매력에 빠져 우리 팀은 멀티레포에서 모노레포로 전환하기로 결정했다. 하지만…","fields":{"slug":"/etc/모노레포-도입-실패기-Turborepo로-옮기다가-겪은-문제들/"},"frontmatter":{"date":"2026년 1월 5일","dateISO":"2026-01-05T06:00:00.000Z","title":"모노레포 도입 실패기 - Turborepo로 옮기다가 겪은 문제들","category":"etc","description":"멀티레포에서 모노레포로 전환하려다가 겪은 실패 경험을 솔직하게 공유한다. Turborepo 도입 과정에서 만난 빌드 시간 증가, 의존성 충돌, 팀 내부 갈등 등 구체적인 문제들과 해결 과정, 그리고 결국 되돌린 이유를 담았다.","tags":["모노레포","Turborepo","실패 경험","프로젝트 경험","개발자 경험","회고","교훈"]}},{"excerpt":"2026년 개발 트렌드 예측 2026년을 앞두고 개발 분야는 더욱 빠르게 변화하고 있다. AI의 일상화, 엣지 컴퓨팅의 성숙, 웹3.0의 확산, 양자 컴퓨팅의 실용화 등 다양한 기술이 개발자의 작업 방식을 근본적으로 바꾸고 있다. 이 글은 202…","fields":{"slug":"/etc/2026년-개발-트렌드-예측-개발자가-주목해야-할-기술/"},"frontmatter":{"date":"2025년 12월 31일","dateISO":"2025-12-31T06:00:00.000Z","title":"2026년 개발 트렌드 예측 - 개발자가 주목해야 할 기술","category":"etc","description":"2026년 개발 분야의 주요 트렌드를 심층 분석한다. AI 통합 개발, 엣지 컴퓨팅, 웹3.0, 양자 컴퓨팅, 저코드/노코드 플랫폼, 사이버 보안, 그린 코딩 등 개발자가 알아야 할 핵심 기술과 변화를 예측하고, 실무 적용 방안을 제시한다.","tags":["2026년 트렌드","개발 트렌드","기술 예측","개발자 트렌드","미래 기술","개발자 커리어","기술 스택","개발 예측"]}},{"excerpt":"개발자 포트폴리오 구축 가이드 개발자 포트폴리오는 단순한 이력서가 아니다. 자신의 기술 역량, 프로젝트 경험, 문제 해결 능력을 보여주는 창구다. 이 글은 GitHub…","fields":{"slug":"/etc/개발자-포트폴리오-구축-가이드-GitHub부터-배포까지/"},"frontmatter":{"date":"2025년 12월 30일","dateISO":"2025-12-30T06:15:00.000Z","title":"개발자 포트폴리오 구축 가이드 - GitHub부터 배포까지","category":"etc","description":"개발자 포트폴리오를 구축하는 완벽한 가이드다. GitHub 프로필 최적화, 포트폴리오 웹사이트 제작, 프로젝트 소개 방법, 배포 전략까지 실무에서 바로 사용할 수 있는 포트폴리오 구축 방법을 정리한다.","tags":["포트폴리오","GitHub","개발자 브랜딩","이력서","개발자 마케팅","웹사이트 제작","배포","개발자 커리어"]}},{"excerpt":"2025년 개발자 회고 2025년이 마무리되는 시점에서, 한 해 동안 개발자로서 경험한 변화와 성장을 돌아본다. AI 코딩 어시스턴트의 보편화, 새로운 기술 스택의 등장, 프로젝트를 통해 배운 것들까지. 이 글은 202…","fields":{"slug":"/etc/2025년-개발자-회고-한-해를-돌아보며-배운-것들/"},"frontmatter":{"date":"2025년 12월 30일","dateISO":"2025-12-30T06:00:00.000Z","title":"2025년 개발자 회고 - 한 해를 돌아보며 배운 것들","category":"etc","description":"2025년 한 해 동안 개발자로서 경험한 기술 변화, 학습 내용, 프로젝트 경험을 돌아본다. AI 코딩 어시스턴트 도입, 새로운 기술 스택 학습, 실패와 성공 경험을 통해 얻은 인사이트를 공유한다.","tags":["개발자 회고","연말 정리","개발자 성장","학습","경험 공유","개발자 커리어","2025년 회고"]}},{"excerpt":"웹 성능 최적화 완전정복 웹 성능은 사용자 경험과 비즈니스 성과에 직접적인 영향을 미친다. 페이지 로딩 시간이 1초 늦어지면 전환율이 7% 감소한다는 연구 결과도 있다. 이 글은 Core Web Vitals…","fields":{"slug":"/javascript/웹-성능-최적화-완전정복-Core-Web-Vitals부터-번들-최적화까지/"},"frontmatter":{"date":"2025년 12월 29일","dateISO":"2025-12-29T07:00:00.000Z","title":"웹 성능 최적화 완전정복 - Core Web Vitals부터 번들 최적화까지","category":"javascript","description":"웹 성능 최적화의 모든 것을 다룬다. Core Web Vitals 이해와 측정, 번들 크기 최적화, 이미지 최적화, 캐싱 전략, 코드 스플리팅까지 실무에서 바로 적용할 수 있는 최적화 기법을 정리한다.","tags":["웹 성능","성능 최적화","Core Web Vitals","번들 최적화","이미지 최적화","캐싱","코드 스플리팅","Lighthouse","웹 최적화"]}},{"excerpt":"모노레포 완전정복 모노레포(Monorepo)는 여러 프로젝트를 하나의 저장소에서 관리하는 방식이다. 코드 공유, 일관성 유지, 대규모 프로젝트 관리에 효과적이다. 이 글은 모노레포의 개념부터 Turborepo, Nx…","fields":{"slug":"/etc/모노레포-Monorepo-완전정복-Turborepo와-Nx로-대규모-프로젝트-관리하기/"},"frontmatter":{"date":"2025년 12월 29일","dateISO":"2025-12-29T06:45:00.000Z","title":"모노레포(Monorepo) 완전정복 - Turborepo와 Nx로 대규모 프로젝트 관리하기","category":"etc","description":"모노레포의 모든 것을 다룬다. 개념부터 Turborepo, Nx, Lerna까지 주요 도구 비교, 실전 구축 가이드, CI/CD 통합, 대규모 프로젝트 관리 전략까지 실무 중심으로 정리한다.","tags":["Monorepo","모노레포","Turborepo","Nx","Lerna","프로젝트 관리","빌드 시스템","코드 공유","대규모 프로젝트"]}},{"excerpt":"Serverless 아키텍처 실전 가이드 Serverless 아키텍처는 서버 관리 없이 코드만 배포하면 자동으로 실행되는 클라우드 컴퓨팅 모델이다. 인프라 관리 부담을 줄이고, 비용을 최적화하며, 자동 스케일링을 제공한다. 이 글은 Serverless…","fields":{"slug":"/etc/Serverless-아키텍처-실전-가이드-AWS-Lambda부터-Vercel까지/"},"frontmatter":{"date":"2025년 12월 29일","dateISO":"2025-12-29T06:30:00.000Z","title":"Serverless 아키텍처 실전 가이드 - AWS Lambda부터 Vercel까지","category":"etc","description":"Serverless 아키텍처의 모든 것을 다룬다. 개념부터 AWS Lambda, Vercel, Netlify Functions까지 주요 플랫폼 비교, 실전 배포 전략, 비용 최적화, Cold Start 문제 해결까지 실무 중심으로 정리한다.","tags":["Serverless","AWS Lambda","Vercel","Netlify","Cloud Functions","서버리스","인프라","배포","Edge Computing"]}},{"excerpt":"Deno 완전정복 Deno는 Node.js의 창시자인 Ryan Dahl이 만든 차세대 JavaScript/TypeScript 런타임이다. Node.js의 문제점을 해결하고, 현대적인 개발 경험을 제공하기 위해 설계되었다. 이 글은 Deno…","fields":{"slug":"/javascript/Deno-완전정복-Node.js를-넘어서는-차세대-런타임/"},"frontmatter":{"date":"2025년 12월 29일","dateISO":"2025-12-29T06:15:00.000Z","title":"Deno 완전정복 - Node.js를 넘어서는 차세대 런타임","category":"javascript","description":"Deno의 모든 것을 다룬다. Node.js와의 차이점, 내장 기능, 보안 모델, TypeScript 지원, 실전 프로젝트 구축까지 Deno를 완벽하게 마스터하는 가이드를 제공한다.","tags":["Deno","Node.js","JavaScript","TypeScript","런타임","서버 사이드","백엔드","차세대 런타임"]}},{"excerpt":"2026년 개발자 로드맵 새해가 되면 많은 개발자가 “올해는 무엇을 배워야 할까?”라는 질문을 한다. 기술 트렌드는 빠르게 변화하고, 선택할 수 있는 기술 스택은 무수히 많다. 이 글은 202…","fields":{"slug":"/etc/2026년-개발자-로드맵-새해를-위한-기술-스택-선택-가이드/"},"frontmatter":{"date":"2025년 12월 29일","dateISO":"2025-12-29T06:00:00.000Z","title":"2026년 개발자 로드맵 - 새해를 위한 기술 스택 선택 가이드","category":"etc","description":"2026년 개발자가 알아야 할 기술 트렌드와 학습 로드맵을 제시한다. 프론트엔드, 백엔드, 풀스택별 기술 스택과 신입부터 시니어까지 단계별 학습 경로를 실무 중심으로 정리했다.","tags":["개발자 로드맵","기술 스택","학습 경로","개발자 커리어","프론트엔드","백엔드","풀스택","2026년 트렌드"]}},{"excerpt":"2025년 AI 개발 트렌드 요약 2025년은 AI가 개발자의 일상이 된 해였다. AI 코딩 어시스턴트는 필수 도구가 되었고, LLM은 애플리케이션의 핵심 구성 요소가 되었다. 이 글은 2025년 한 해 동안 AI…","fields":{"slug":"/ai/2025년-AI-개발-트렌드-요약-개발자가-알아야-할-핵심-변화/"},"frontmatter":{"date":"2025년 12월 24일","dateISO":"2025-12-24T06:00:00.000Z","title":"2025년 AI 개발 트렌드 요약 - 개발자가 알아야 할 핵심 변화","category":"ai","description":"2025년 AI 개발 분야의 주요 트렌드를 요약한다. AI 코딩 어시스턴트, 멀티모달 AI, 소규모 LLM, RAG, AI Agent 등 개발자 생산성에 영향을 미친 핵심 기술과 변화를 분석하고, 2026년 전망을 제시한다.","tags":["AI 트렌드","AI 개발","개발자 생산성","LLM","AI 코딩","멀티모달 AI","RAG","AI Agent","소규모 LLM","2025년 트렌드"]}},{"excerpt":"VS Code 확장 프로그램 추천 VS Code는 확장 프로그램으로 기능을 무한히 확장할 수 있다. 적절한 확장 프로그램을 선택하면 개발 생산성을 크게 향상시킬 수 있다. 이 글은 실무에서 가장 유용한 VS Code…","fields":{"slug":"/etc/VS-Code-확장-프로그램-추천/"},"frontmatter":{"date":"2025년 12월 23일","dateISO":"2025-12-23T06:45:00.000Z","title":"VS Code 확장 프로그램 추천 - 개발 생산성을 높이는 필수 확장 20선","category":"etc","description":"VS Code 개발 생산성을 극대화하는 필수 확장 프로그램을 추천한다. 코드 편집, Git, 디버깅, 테마, 프로덕션 등 카테고리별로 실무에서 바로 사용할 수 있는 확장 프로그램을 정리했다.","tags":["VS Code","확장 프로그램","개발 도구","생산성","에디터","개발 환경"]}},{"excerpt":"…","fields":{"slug":"/javascript/프론트엔드-프레임워크-선택-가이드/"},"frontmatter":{"date":"2025년 12월 23일","dateISO":"2025-12-23T06:40:00.000Z","title":"프론트엔드 프레임워크 선택 가이드 - React vs Vue vs Svelte 실전 비교","category":"javascript","description":"React, Vue, Svelte를 포함한 주요 프론트엔드 프레임워크를 상세히 비교 분석한다. 프로젝트 특성, 팀 규모, 학습 곡선 등을 고려한 실무 선택 가이드를 제공한다.","tags":["React","Vue","Svelte","프론트엔드","프레임워크","JavaScript","프레임워크 비교"]}},{"excerpt":"…","fields":{"slug":"/etc/웹사이트-보안-스캔-도구와-취약점-점검-가이드/"},"frontmatter":{"date":"2025년 12월 23일","dateISO":"2025-12-23T06:35:00.000Z","title":"웹사이트 보안 스캔 도구와 취약점 점검 가이드 - 실무에서 바로 쓰는 보안 도구들","category":"etc","description":"웹사이트 보안을 점검하고 취약점을 찾는 필수 도구들을 정리했다. OWASP ZAP, Snyk, npm audit 등 무료 도구부터 상용 도구까지 실무에서 바로 사용할 수 있는 보안 스캔 도구 가이드를 제공한다.","tags":["보안","웹 보안","취약점 스캔","OWASP","보안 도구","취약점 점검","보안 테스트"]}},{"excerpt":"개발 환경 설정 자동화 도구 모음 새로운 개발자 온보딩이나 프로젝트 설정에 시간을 낭비하는 것은 비효율적이다. 개발 환경 설정을 자동화하면 몇 분 만에 일관된 개발 환경을 구축할 수 있다. 이 글은 주요 개발 환경 자동화 도구들을 비교 분석한다.…","fields":{"slug":"/etc/개발-환경-설정-자동화-도구-모음/"},"frontmatter":{"date":"2025년 12월 23일","dateISO":"2025-12-23T06:30:00.000Z","title":"개발 환경 설정 자동화 도구 모음 - Docker, Vagrant, Dev Containers 완전 가이드","category":"etc","description":"개발 환경 설정을 자동화하는 도구들을 상세히 비교 분석한다. Docker, Vagrant, Dev Containers 등 주요 도구의 특징과 실무 활용법을 다룬다.","tags":["Docker","Vagrant","Dev Containers","개발 환경","자동화","DevOps","컨테이너"]}},{"excerpt":"코드 리뷰 체크리스트 코드 리뷰는 소프트웨어 품질을 보장하는 핵심 프로세스다. 체계적인 체크리스트를 사용하면 중요한 이슈를 놓치지 않고 일관된 리뷰를 수행할 수 있다. 이 글은 실무에서 바로 사용할 수 있는 코드 리뷰 체크리스트를 제공한다.…","fields":{"slug":"/etc/코드-리뷰-체크리스트/"},"frontmatter":{"date":"2025년 12월 23일","dateISO":"2025-12-23T06:25:00.000Z","title":"코드 리뷰 체크리스트 - 품질 보장을 위한 필수 항목","category":"etc","description":"효과적인 코드 리뷰를 위한 완전한 체크리스트다. 기능, 성능, 보안, 가독성 등 모든 측면을 검토할 수 있는 실무 중심의 체크리스트를 제공한다.","tags":["코드 리뷰","코드 품질","개발 프로세스","품질 보장","베스트 프랙티스","코드 검토"]}},{"excerpt":"REST API 테스트 도구 완전 가이드 REST API 개발과 테스트는 현대 웹 개발의 핵심이다. 적절한 도구를 사용하면 API 개발 속도와 품질을 크게 향상시킬 수 있다. 이 글은 주요 API…","fields":{"slug":"/etc/REST-API-테스트-도구-완전-가이드/"},"frontmatter":{"date":"2025년 12월 23일","dateISO":"2025-12-23T06:20:00.000Z","title":"REST API 테스트 도구 완전 가이드 - Postman vs Insomnia vs Thunder Client 실전 비교","category":"etc","description":"REST API 개발과 테스트에 필수적인 도구들을 상세히 비교 분석한다. Postman, Insomnia, Thunder Client의 기능, 가격, 사용 시나리오를 실무 관점에서 분석한다.","tags":["REST API","API 테스트","Postman","Insomnia","Thunder Client","API 개발","백엔드 개발"]}},{"excerpt":"JavaScript 성능 측정 도구와 최적화 체크리스트 JavaScript 애플리케이션의 성능은 사용자 경험과 비즈니스 성과에 직접적인 영향을 미친다. 느린 로딩 시간은 이탈률을 높이고, 전환율을 낮춘다. 이 글은 JavaScript…","fields":{"slug":"/javascript/JavaScript-성능-측정-도구와-최적화-체크리스트/"},"frontmatter":{"date":"2025년 12월 23일","dateISO":"2025-12-23T06:15:00.000Z","title":"JavaScript 성능 측정 도구와 최적화 체크리스트 - 실무에서 바로 쓰는 성능 개선 가이드","category":"javascript","description":"JavaScript 애플리케이션의 성능을 측정하고 최적화하는 완전한 가이드다. Lighthouse, WebPageTest, Chrome DevTools 등 주요 도구 사용법과 실무 체크리스트를 제공한다.","tags":["JavaScript","성능 최적화","Lighthouse","WebPageTest","성능 측정","프론트엔드 최적화","웹 성능"]}},{"excerpt":"AI 코딩 어시스턴트 비교 가이드 AI 코딩 어시스턴트는 개발자의 생산성을 혁신적으로 향상시킨다. 코드 자동 완성, 버그 수정, 리팩토링까지 AI가 도와주는 시대가 되었다. 이 글은 주요 AI…","fields":{"slug":"/ai/AI-코딩-어시스턴트-비교-가이드/"},"frontmatter":{"date":"2025년 12월 23일","dateISO":"2025-12-23T06:10:00.000Z","title":"AI 코딩 어시스턴트 비교 가이드 - GitHub Copilot vs Cursor vs Codeium 실전 분석","category":"ai","description":"AI 코딩 어시스턴트의 완전한 비교 가이드다. GitHub Copilot, Cursor, Codeium의 기능, 가격, 사용 시나리오를 상세히 분석하고 실무에서 어떤 도구를 선택해야 하는지 안내한다.","tags":["AI 코딩","GitHub Copilot","Cursor","Codeium","AI 어시스턴트","코딩 생산성","개발 도구"]}},{"excerpt":"…","fields":{"slug":"/algorithm/알고리즘-시각화-도구-완전-가이드/"},"frontmatter":{"date":"2025년 12월 23일","dateISO":"2025-12-23T06:05:00.000Z","title":"알고리즘 시각화 도구 완전 가이드 - 학습과 이해를 돕는 최고의 도구들","category":"algorithm","description":"알고리즘을 시각적으로 이해하고 학습할 수 있는 최고의 온라인 도구들을 정리했다. 정렬, 그래프 탐색, 트리 구조 등 다양한 알고리즘을 애니메이션으로 확인할 수 있는 도구들을 소개한다.","tags":["알고리즘","시각화","학습 도구","정렬 알고리즘","그래프 알고리즘","데이터 구조","알고리즘 학습"]}},{"excerpt":"개발자를 위한 필수 온라인 도구 모음 2025 개발 작업을 효율적으로 하려면 적절한 도구가 필요하다. 설치 없이 브라우저에서 바로 사용할 수 있는 온라인 도구들은 개발자의 생산성을 크게 향상시킨다. 이 글은 202…","fields":{"slug":"/etc/개발자를-위한-필수-온라인-도구-모음-2025/"},"frontmatter":{"date":"2025년 12월 23일","dateISO":"2025-12-23T06:00:00.000Z","title":"개발자를 위한 필수 온라인 도구 모음 2025 - 실무에서 바로 쓰는 무료 도구들","category":"etc","description":"개발 생산성을 높이는 필수 온라인 도구들을 카테고리별로 정리했다. 코드 포매터, 디버거, API 테스트, 성능 측정, 디자인 도구까지 실무에서 바로 사용할 수 있는 무료 도구들을 한눈에 확인할 수 있다.","tags":["개발 도구","온라인 도구","개발자 도구","무료 도구","개발 생산성","코드 포매터","API 테스트","성능 측정"]}},{"excerpt":"CI/CD 파이프라인 완전정복 - GitHub Actions와 GitLab CI 실전 자동화 가이드 CI/CD는 Continuous Integration과 Continuous Deployment…","fields":{"slug":"/etc/CI-CD-파이프라인-완전정복-GitHub-Actions와-GitLab-CI-실전-자동화-가이드/"},"frontmatter":{"date":"2025년 12월 21일","dateISO":"2025-12-21T00:00:00.000Z","title":"CI/CD 파이프라인 완전정복 - GitHub Actions와 GitLab CI 실전 자동화 가이드","category":"etc","description":"CI/CD의 핵심 개념부터 실전 구현까지. GitHub Actions와 GitLab CI를 활용한 자동화 파이프라인 구축, Docker 빌드와 배포, 테스트 자동화, 보안 스캔, 멀티 스테이지 배포까지 현대적인 DevOps 워크플로우를 구축하는 모든 것을 다룹니다.","tags":["CI/CD","GitHub Actions","GitLab CI","DevOps","자동화","Docker","배포","테스트 자동화","파이프라인"]}},{"excerpt":"Elasticsearch 완전정복 - 엔터프라이즈 검색 엔진 구축 실전 가이드 Elasticsearch는 Shay Banon이 2010년에 개발한 분산 검색 및 분석 엔진이다. Apache Lucene을 기반으로 하며, RESTful API…","fields":{"slug":"/etc/Elasticsearch-완전정복-엔터프라이즈-검색-엔진-구축-실전-가이드/"},"frontmatter":{"date":"2025년 12월 21일","dateISO":"2025-12-21T00:00:00.000Z","title":"Elasticsearch 완전정복 - 엔터프라이즈 검색 엔진 구축 실전 가이드","category":"etc","description":"Elasticsearch의 핵심 개념부터 실전 활용까지. 아키텍처, 인덱싱 전략, 쿼리 DSL, 집계, Kibana 대시보드, Logstash 통합, 성능 최적화까지 엔터프라이즈급 검색 시스템을 구축하는 모든 것을 다룹니다.","tags":["Elasticsearch","검색 엔진","ELK Stack","Kibana","Logstash","인덱싱","쿼리 DSL","집계","풀텍스트 검색"]}},{"excerpt":"Redis 완전정복 - 고성능 인메모리 데이터베이스 실전 활용 가이드 Redis는 Salvatore Sanfilippo가 2009년에 개발한 오픈소스 인메모리 데이터 구조 저장소다. Remote Dictionary Server…","fields":{"slug":"/etc/Redis-완전정복-고성능-인메모리-데이터베이스-실전-활용-가이드/"},"frontmatter":{"date":"2025년 12월 21일","dateISO":"2025-12-21T00:00:00.000Z","title":"Redis 완전정복 - 고성능 인메모리 데이터베이스 실전 활용 가이드","category":"etc","description":"Redis의 핵심 개념부터 실전 활용까지. 데이터 구조, 캐싱 전략, 세션 관리, Pub/Sub 메시징, 분산 락, Redis Cluster, 성능 최적화까지 현대 웹 애플리케이션에서 Redis를 효과적으로 활용하는 모든 것을 다룹니다.","tags":["Redis","캐싱","인메모리 데이터베이스","세션 관리","Pub/Sub","분산 락","Redis Cluster","성능 최적화","NoSQL"]}},{"excerpt":"GraphQL 완전정복 - REST API를 넘어서는 쿼리 언어 GraphQL은 Facebook에서 2012년에 개발하고 2015년에 오픈소스로 공개한 쿼리 언어이자 런타임 시스템이다. Facebook…","fields":{"slug":"/javascript/GraphQL-완전정복-REST-API를-넘어서는-쿼리-언어/"},"frontmatter":{"date":"2025년 12월 17일","dateISO":"2025-12-17T00:00:00.000Z","title":"GraphQL 완전정복 - REST API를 넘어서는 쿼리 언어","category":"javascript","description":"GraphQL의 핵심 개념부터 실전 활용까지. REST API의 한계를 해결하는 GraphQL의 강력한 기능, 스키마 설계 원칙, N+1 문제 해결, 실시간 구독, 인증과 보안까지 현대 웹 개발에서 GraphQL을 효과적으로 활용하는 모든 것을 다룹니다.","tags":["GraphQL","REST API","Apollo","쿼리 언어","API 설계","데이터 페칭","스키마","Resolver","JavaScript","웹 개발"]}},{"excerpt":"샵바이 프리미엄 오로라스킨으로 시작하는 전문 쇼핑몰 구축 가이드 온라인 쇼핑몰을 만들고 싶지만 기술적 지식이 없어 막막한가? 복잡한 코딩과 서버 관리 없이 전문적인 쇼핑몰을 구축할 수 있는 방법이 있다. NHN…","fields":{"slug":"/etc/샵바이-프리미엄-오로라스킨-쇼핑몰-구축-가이드/"},"frontmatter":{"date":"2025년 12월 15일","dateISO":"2025-12-15T05:29:30.000Z","title":"샵바이 프리미엄 오로라스킨으로 시작하는 전문 쇼핑몰 구축 가이드","category":"etc","description":"온라인 쇼핑몰을 만들고 싶지만 기술적 지식이 없어 막막한가? 샵바이 프리미엄의 오로라스킨을 활용하면 누구나 전문적인 쇼핑몰을 쉽게 구축할 수 있다. 평생 무료 서비스부터 단계별 구축 가이드까지, 쇼핑몰 도입을 고려하는 모든 분을 위한 완벽한 가이드다.","tags":["샵바이 프리미엄","오로라스킨","쇼핑몰 구축","온라인 스토어","NHN 커머스","쇼핑몰 제작","무료 쇼핑몰"]}},{"excerpt":"…","fields":{"slug":"/etc/이모작-농업의-효율성과-지속가능성/"},"frontmatter":{"date":"2025년 12월 9일","dateISO":"2025-12-09T00:00:00.000Z","title":"이모작 - 농업의 효율성과 지속가능성을 높이는 혁신적 재배 방식","category":"etc","description":"이모작의 역사적 배경, 작동 원리, 장단점을 분석하고 현대 농업에서의 중요성과 지속가능한 농업 실현 방법을 탐구합니다.","tags":["이모작","농업","지속가능성","토지이용","농업혁신","작물재배"]}},{"excerpt":"AI 견적 시스템 프로젝트 비용을 자동으로 산정하는 지능형 도구 “쇼핑몰 웹사이트를 만들고 싶은데, 예상 비용이 얼마나 될까요?”라는 질문에 AI…","fields":{"slug":"/ai/AI-견적-시스템-프로젝트-비용을-자동으로-산정하는-지능형-도구/"},"frontmatter":{"date":"2025년 12월 8일","dateISO":"2025-12-08T12:00:00.000Z","title":"AI 견적 시스템 프로젝트 비용을 자동으로 산정하는 지능형 도구","category":"ai","description":"프로젝트 조건만 입력하면 견적 가이드와 예상 기간이 자동으로 제안된다. 블루버튼의 AI 견적서 추천이 어떻게 작동하는지, 프로젝트 비용 산정을 어떻게 혁신하는지 일반인도 이해할 수 있도록 설명합니다.","tags":["AI 견적","프로젝트 견적","비용 산정","AI 자동화","블루버튼","AI","프로젝트 관리"]}},{"excerpt":"AI 매칭 알고리즘 수백 명의 메이커 데이터로 최적의 파트너 찾기 “웹사이트 개발 프로젝트에 적합한 메이커를 찾고 싶은데, 수백 명 중에서 누가 최적인지 어떻게 알 수 있을까?” 이런 고민을 AI…","fields":{"slug":"/ai/AI-매칭-알고리즘-수백-명의-메이커-데이터로-최적의-파트너-찾기/"},"frontmatter":{"date":"2025년 12월 8일","dateISO":"2025-12-08T12:00:00.000Z","title":"AI 매칭 알고리즘 수백 명의 메이커 데이터로 최적의 파트너 찾기","category":"ai","description":"프로젝트에 맞는 최적의 메이커를 찾는 것은 어렵다. 블루버튼의 메이커 매칭 분석이 수백 명의 메이커 데이터를 기반으로 어떻게 최적의 파트너를 찾는지 일반인도 이해할 수 있도록 설명합니다.","tags":["AI 매칭","메이커 매칭","협업 파트너","추천 시스템","블루버튼","AI","프로젝트 매칭"]}},{"excerpt":"AI 명세서 자동 생성 기술 아이디어를 기능 명세서로 바꾸는 마법 “사용자가 로그인하고 상품을 주문할 수 있는 쇼핑몰 앱을 만들고 싶어요”라고 말하면, AI…","fields":{"slug":"/ai/AI-명세서-자동-생성-기술-아이디어를-기능-명세서로-바꾸는-마법/"},"frontmatter":{"date":"2025년 12월 8일","dateISO":"2025-12-08T12:00:00.000Z","title":"AI 명세서 자동 생성 기술 아이디어를 기능 명세서로 바꾸는 마법","category":"ai","description":"아이디어만 입력하면 기능 명세서가 자동으로 작성된다. 블루버튼의 AI 명세서 생성기가 어떻게 작동하는지, 프로젝트 기획을 어떻게 혁신하는지 일반인도 이해할 수 있도록 설명합니다.","tags":["AI 명세서 생성","기능 명세서","프로젝트 기획","AI 자동화","블루버튼","AI","프로젝트 관리"]}},{"excerpt":"gRPC 완전정복 - 고성능 마이크로서비스 통신의 새로운 패러다임 gRPC는 Google이 개발한 고성능 오픈소스 RPC(Remote Procedure Call) 프레임워크다. HTTP/2 기반의 바이너리 프로토콜을 사용하며, Protocol…","fields":{"slug":"/etc/gRPC-완전정복-고성능-마이크로서비스-통신의-새로운-패러다임/"},"frontmatter":{"date":"2025년 12월 7일","dateISO":"2025-12-07T00:00:00.000Z","title":"gRPC 완전정복 - 고성능 마이크로서비스 통신의 새로운 패러다임","category":"etc","description":"gRPC 기초부터 고급 활용까지. Protocol Buffers, 스트리밍, 인터셉터, 에러 처리, Spring Boot 통합, 성능 최적화까지 실무에서 바로 사용할 수 있는 완벽한 가이드를 제공합니다.","tags":["gRPC","Protocol Buffers","마이크로서비스","고성능 통신","RPC","스트리밍","Spring Boot","분산 시스템"]}},{"excerpt":"WebAssembly (WASM) - 브라우저와 서버를 넘나드는 범용 런타임 WebAssembly(WASM)는 웹에서 네이티브에 가까운 성능으로 코드를 실행할 수 있게 해주는 바이너리 명령어 형식이다. JavaScript와 함께 작동하며, C/C…","fields":{"slug":"/javascript/WebAssembly-WASM-브라우저와-서버를-넘나드는-범용-런타임/"},"frontmatter":{"date":"2025년 12월 7일","dateISO":"2025-12-07T00:00:00.000Z","title":"WebAssembly (WASM) - 브라우저와 서버를 넘나드는 범용 런타임","category":"javascript","description":"WebAssembly 기초부터 고급 활용까지. WASM 모듈 작성, JavaScript와의 상호작용, 성능 최적화, Rust/Go로 WASM 빌드, Node.js 서버 사이드 활용, 실전 프로젝트 예제까지 완벽하게 다룹니다.","tags":["WebAssembly","WASM","JavaScript","Rust","Go","고성능","브라우저","Node.js","컴파일"]}},{"excerpt":"웹 게임 개발 기술 스택 완전정복 - 실전 가이드 웹 게임 개발은 HTML5, Canvas API, WebGL…","fields":{"slug":"/javascript/웹-게임-개발-기술-스택-완전정복-실전-가이드/"},"frontmatter":{"date":"2025년 12월 7일","dateISO":"2025-12-07T00:00:00.000Z","title":"웹 게임 개발 기술 스택 완전정복 - 실전 가이드","category":"javascript","description":"웹 게임 개발의 모든 것을 다룹니다. Phaser, Three.js, Babylon.js, Unity WebGL 등 주요 게임 엔진부터 그래픽스, 오디오, 네트워킹, 성능 최적화, 배포 전략까지 실무에서 바로 사용할 수 있는 완벽한 가이드를 제공합니다.","tags":["웹 게임","게임 개발","Phaser","Three.js","Babylon.js","Unity WebGL","Canvas API","WebGL","게임 엔진","JavaScript","HTML5 게임"]}},{"excerpt":"Event Sourcing과 CQRS 패턴 - 이벤트 기반 아키텍처 설계 실전 가이드 Event Sourcing은 애플리케이션의 상태 변경을 일련의 이벤트로 저장하는 패턴이다. CQRS(Command Query Responsibility…","fields":{"slug":"/springboot/Event-Sourcing과-CQRS-패턴-이벤트-기반-아키텍처-설계-실전-가이드/"},"frontmatter":{"date":"2025년 12월 7일","dateISO":"2025-12-07T00:00:00.000Z","title":"Event Sourcing과 CQRS 패턴 - 이벤트 기반 아키텍처 설계 실전 가이드","category":"springboot","description":"Event Sourcing과 CQRS 패턴의 기초부터 실전 구현까지. 이벤트 스토어 설계, 이벤트 리플레이, 스냅샷, 읽기 모델 동기화, Spring Boot 구현, 실전 예제까지 완벽하게 다룹니다.","tags":["Event Sourcing","CQRS","이벤트 기반 아키텍처","Spring Boot","이벤트 스토어","도메인 이벤트","마이크로서비스","분산 시스템"]}},{"excerpt":"AI 3D 생성 혁명 텍스트에서 3D 모델을 만드는 시대 “우주를 배경으로 한 사이버펑크 스타일의 로봇”이라고 텍스트만 입력하면, AI가 3D 모델을 만들어준다. 이제 이런 일이 현실이 되었다. AI…","fields":{"slug":"/ai/AI-3D-생성-혁명-텍스트에서-3D-모델을-만드는-시대/"},"frontmatter":{"date":"2025년 12월 5일","dateISO":"2025-12-05T12:00:00.000Z","title":"AI 3D 생성 혁명 텍스트에서 3D 모델을 만드는 시대","category":"ai","description":"텍스트만으로 3D 모델을 만드는 AI가 등장했다. 게임, 영화, 제품 디자인 등 다양한 분야에서 활용되는 AI 3D 생성 기술을 일반인도 이해할 수 있도록 설명합니다.","tags":["AI 3D 생성","3D 모델 생성","Text-to-3D","3D AI","생성형 AI","AI","3D 모델링"]}},{"excerpt":"AI 모니터링과 관찰 가능성 프로덕션 AI를 안전하게 관리하는 방법 AI 모델을 만들고 서비스에 배포했다. 이제 끝일까? 아니다. 실제로는 이제부터가 진짜 시작이다. AI…","fields":{"slug":"/ai/AI-모니터링과-관찰-가능성-프로덕션-AI를-안전하게-관리하는-방법/"},"frontmatter":{"date":"2025년 12월 5일","dateISO":"2025-12-05T12:00:00.000Z","title":"AI 모니터링과 관찰 가능성 프로덕션 AI를 안전하게 관리하는 방법","category":"ai","description":"AI 시스템을 실제 서비스에 배포한 후 어떻게 관리해야 할까? AI 모니터링과 관찰 가능성의 중요성, 실전 관리 방법을 일반인도 이해할 수 있도록 설명합니다.","tags":["AI 모니터링","Observability","AI 운영","프로덕션 AI","AI 관리","MLOps","AI"]}},{"excerpt":"AI와 교육 혁명 개인화 학습과 AI 튜터의 미래 한 교실에 3…","fields":{"slug":"/ai/AI와-교육-혁명-개인화-학습과-AI-튜터의-미래/"},"frontmatter":{"date":"2025년 12월 5일","dateISO":"2025-12-05T12:00:00.000Z","title":"AI와 교육 혁명 개인화 학습과 AI 튜터의 미래","category":"ai","description":"AI가 교육을 어떻게 바꾸고 있는지, 개인화 학습과 AI 튜터가 학생들에게 어떤 새로운 가능성을 제공하는지 일반인도 이해할 수 있도록 설명합니다.","tags":["AI 교육","개인화 학습","AI 튜터","교육 AI","적응형 교육","AI","교육 기술"]}},{"excerpt":"AI 감정 인식 기술이 만드는 감성 컴퓨팅의 미래 카메라를 보면 AI가 당신의 표정을 읽고 기분을 파악한다. 음성을 분석하면 AI가 당신의 감정 상태를 이해한다. 텍스트를 읽으면 AI가 글 속에 담긴 감정을 감지한다. 이제 AI…","fields":{"slug":"/ai/AI-감정-인식-기술이-만드는-감성-컴퓨팅의-미래/"},"frontmatter":{"date":"2025년 12월 2일","dateISO":"2025-12-02T12:00:00.000Z","title":"AI 감정 인식 기술이 만드는 감성 컴퓨팅의 미래","category":"ai","description":"AI가 사람의 감정을 읽고 이해하는 시대가 왔다. 감정 인식 AI가 어떻게 작동하는지, 어떤 분야에 활용되는지, 그리고 윤리적 고려사항은 무엇인지 일반인도 이해할 수 있도록 설명합니다.","tags":["AI 감정 인식","감성 컴퓨팅","감정 AI","Affective Computing","AI","감정 분석"]}},{"excerpt":"AI 이미지 생성 완전정복 Midjourney DALL-E Stable Diffusion 실전 비교 가이드 “우주를 배경으로 한 사이버펑크 도시, 네온사인이 반짝이는 밤거리”라고 텍스트만 입력하면, AI…","fields":{"slug":"/ai/AI-이미지-생성-완전정복-Midjourney-DALL-E-Stable-Diffusion-실전-비교-가이드/"},"frontmatter":{"date":"2025년 12월 2일","dateISO":"2025-12-02T12:00:00.000Z","title":"AI 이미지 생성 완전정복 Midjourney DALL-E Stable Diffusion 실전 비교 가이드","category":"ai","description":"텍스트로 이미지를 만드는 AI 도구들이 쏟아지고 있다. Midjourney, DALL-E 3, Stable Diffusion의 특징을 비교하고, 어떤 상황에서 어떤 도구를 선택해야 하는지 실전 가이드를 제공합니다.","tags":["AI 이미지 생성","Midjourney","DALL-E","Stable Diffusion","생성형 AI","이미지 AI","AI"]}},{"excerpt":"AI 음악 생성 혁명 Suno와 Udio가 바꾸는 음악 제작의 미래 “밤하늘을 바라보며 느긋하게 흐르는 재즈 피아노 곡”이라고 텍스트만 입력하면, AI가 그 음악을 만들어준다. 이제 이런 일이 현실이 되었다. Suno와 Udio 같은 AI…","fields":{"slug":"/ai/AI-음악-생성-혁명-Suno와-Udio가-바꾸는-음악-제작의-미래/"},"frontmatter":{"date":"2025년 12월 2일","dateISO":"2025-12-02T12:00:00.000Z","title":"AI 음악 생성 혁명 Suno와 Udio가 바꾸는 음악 제작의 미래","category":"ai","description":"텍스트만으로 음악을 만드는 시대가 왔다. Suno와 Udio 같은 AI 음악 생성 도구가 어떻게 음악 제작을 혁신하는지, 일반인도 쉽게 이해할 수 있도록 설명합니다.","tags":["AI 음악 생성","Suno","Udio","생성형 AI","음악 제작","AI","음악 AI"]}},{"excerpt":"AI 하드웨어 혁명 NPU와 AI 칩이 만드는 온디바이스 인텔리전스 최신 스마트폰을 보면 “NPU”라는 단어를 자주 본다. Neural Processing Unit, 신경망 처리 장치다. 이것은 AI를 위한 전용 칩이다. 과거에는 AI…","fields":{"slug":"/ai/AI-하드웨어-혁명-NPU와-AI-칩이-만드는-온디바이스-인텔리전스/"},"frontmatter":{"date":"2025년 12월 2일","dateISO":"2025-12-02T12:00:00.000Z","title":"AI 하드웨어 혁명 NPU와 AI 칩이 만드는 온디바이스 인텔리전스","category":"ai","description":"스마트폰에 NPU가 탑재되고, AI 전용 칩이 등장하면서 AI가 클라우드에서 디바이스로 이동하고 있다. AI 하드웨어가 어떻게 작동하는지, 어떤 변화를 가져오는지 일반인도 이해할 수 있도록 설명합니다.","tags":["AI 하드웨어","NPU","AI 칩","온디바이스 AI","Neural Processing Unit","AI","하드웨어"]}},{"excerpt":"AI와 저작권 창작자의 권리와 AI 생성 콘텐츠의 법적 경계 AI가 만든 이미지를 상업적으로 사용할 수 있을까? AI가 학습한 원작자의 작품은 보호받을 수 있을까? AI…","fields":{"slug":"/ai/AI와-저작권-창작자의-권리와-AI-생성-콘텐츠의-법적-경계/"},"frontmatter":{"date":"2025년 12월 2일","dateISO":"2025-12-02T12:00:00.000Z","title":"AI와 저작권 창작자의 권리와 AI 생성 콘텐츠의 법적 경계","category":"ai","description":"AI가 만든 이미지, 음악, 텍스트의 저작권은 누구에게 있을까? AI 학습에 사용된 원작자의 권리는? AI 시대의 저작권 문제를 일반인도 이해할 수 있도록 설명합니다.","tags":["AI 저작권","저작권","AI 법률","창작자 권리","AI 생성 콘텐츠","AI","법적 이슈"]}},{"excerpt":"소규모 LLM의 부상 경량 AI가 만드는 새로운 가능성 GPT-4는 강력하지만 크다. 수백 GB의 용량과 엄청난 연산 능력이 필요하다. 하지만 최근 작고 효율적인 소규모 LLM들이 등장하면서 상황이 바뀌고 있다. Llama 3.1, Phi-…","fields":{"slug":"/ai/소규모-LLM의-부상-경량-AI가-만드는-새로운-가능성/"},"frontmatter":{"date":"2025년 12월 2일","dateISO":"2025-12-02T12:00:00.000Z","title":"소규모 LLM의 부상 경량 AI가 만드는 새로운 가능성","category":"ai","description":"거대한 GPT-4의 시대가 지나고, 작고 효율적인 소규모 LLM의 시대가 왔다. Llama 3.1, Phi-3, Gemma 같은 경량 모델이 어떻게 AI의 접근성을 높이고 새로운 가능성을 만드는지 설명합니다.","tags":["소규모 LLM","Small Language Model","Llama","Phi-3","Gemma","경량 AI","AI","LLM"]}},{"excerpt":"대 에이전트의 시대 우리가 맞이할 변화와 준비 “내일 회의 일정 잡아줘”라고 말하면, AI가 캘린더를 확인하고, 참석자들의 일정을 조율하고, 회의실을 예약하고, 초대 메일을 보낸다. 이런 일이 이제 현실이 되었다. AI Agent…","fields":{"slug":"/ai/대-에이전트의-시대-우리가-맞이할-변화와-준비/"},"frontmatter":{"date":"2025년 11월 29일","dateISO":"2025-11-29T14:00:00.000Z","title":"대 에이전트의 시대 우리가 맞이할 변화와 준비","category":"ai","description":"AI Agent가 일상화되는 시대가 왔다. 기술적 설명을 넘어서, Agent 시대가 우리 삶과 사회에 미칠 변화에 대한 개인적인 생각을 정리합니다.","tags":["AI Agent","에이전트 시대","미래","사회 변화","AI","인공지능","자율 에이전트"]}},{"excerpt":"AI 검색 엔진의 부상 Perplexity와 대화형 검색의 미래 “2024년 파리 올림픽에서 한국이 획득한 금메달 수는?”이라고 물으면, 구글은 수많은 웹페이지 링크를 보여준다. 하지만 Perplexity 같은 AI…","fields":{"slug":"/ai/AI-검색-엔진의-부상-Perplexity와-대화형-검색의-미래/"},"frontmatter":{"date":"2025년 11월 29일","dateISO":"2025-11-29T12:00:00.000Z","title":"AI 검색 엔진의 부상 Perplexity와 대화형 검색의 미래","category":"ai","description":"구글 검색의 시대가 끝나고 AI 검색의 시대가 시작되었다. Perplexity 같은 AI 검색 엔진이 어떻게 정보 검색을 혁신하는지, 일반인도 쉽게 이해할 수 있도록 설명합니다.","tags":["AI 검색","Perplexity","대화형 검색","RAG","검색 엔진","AI","정보 검색"]}},{"excerpt":"AI 비디오 생성 혁명 Sora와 Runway가 바꾸는 콘텐츠 제작의 미래 “고양이가 우주를 날아다니는 모습을 보여줘”라고 텍스트만 입력하면, AI가 그 장면을 비디오로 만들어준다. 이제 이런 일이 현실이 되었다. OpenAI의 Sora와 Runway…","fields":{"slug":"/ai/AI-비디오-생성-혁명-Sora와-Runway가-바꾸는-콘텐츠-제작의-미래/"},"frontmatter":{"date":"2025년 11월 29일","dateISO":"2025-11-29T12:00:00.000Z","title":"AI 비디오 생성 혁명 Sora와 Runway가 바꾸는 콘텐츠 제작의 미래","category":"ai","description":"AI가 텍스트만으로 비디오를 생성하는 시대가 왔다. OpenAI Sora와 Runway Gen-3가 어떻게 콘텐츠 제작을 혁신하는지, 일반인도 쉽게 이해할 수 있도록 설명합니다.","tags":["AI 비디오 생성","Sora","Runway","생성형 AI","콘텐츠 제작","멀티모달 AI","AI"]}},{"excerpt":"AI 코딩 어시스턴트 실전 활용 Cursor와 GitHub Copilot으로 개발 생산성 극대화하기 “사용자 로그인 기능을 만들어줘”라고 입력하면, AI가 자동으로 코드를 작성해준다. 이제 이런 일이 현실이 되었다. Cursor와 GitHub…","fields":{"slug":"/ai/AI-코딩-어시스턴트-실전-활용-Cursor와-GitHub-Copilot으로-개발-생산성-극대화하기/"},"frontmatter":{"date":"2025년 11월 29일","dateISO":"2025-11-29T12:00:00.000Z","title":"AI 코딩 어시스턴트 실전 활용 Cursor와 GitHub Copilot으로 개발 생산성 극대화하기","category":"ai","description":"AI가 코드를 작성하는 시대가 왔다. Cursor와 GitHub Copilot 같은 AI 코딩 어시스턴트가 개발자의 생산성을 어떻게 높이는지, 실전 활용법을 일반인도 이해할 수 있도록 설명합니다.","tags":["AI 코딩","Cursor","GitHub Copilot","개발 생산성","코드 생성","AI","프로그래밍"]}},{"excerpt":"LLM 추론 최적화 - KV Cache, Quantization, Speculative Decoding LLM 추론은 계산 집약적이고 메모리를 많이 사용한다. 프로덕션 환경에서 LLM…","fields":{"slug":"/ai/LLM-추론-최적화-KV-Cache-Quantization-Speculative-Decoding/"},"frontmatter":{"date":"2025년 11월 28일","dateISO":"2025-11-28T00:00:00.000Z","title":"LLM 추론 최적화 - KV Cache, Quantization, Speculative Decoding","category":"ai","description":"LLM 추론 성능을 최적화하는 핵심 기술들을 실전 예제와 함께 정리합니다. KV Cache, Quantization, Speculative Decoding, 배치 처리, 모델 병렬화 등 모든 최적화 기법을 다룹니다.","tags":["LLM","추론 최적화","KV Cache","Quantization","Speculative Decoding","AI","성능 최적화","모델 서빙"]}},{"excerpt":"Docker와 Kubernetes 실전 배포 가이드 Docker와 Kubernetes는 현대적인 애플리케이션 배포의 표준이 되었다. 이 글은 Docker 컨테이너화부터 Kubernetes 클러스터 배포까지 실전 예제와 함께 완벽하게 정리한다.…","fields":{"slug":"/etc/Docker와-Kubernetes-실전-배포-가이드/"},"frontmatter":{"date":"2025년 11월 28일","dateISO":"2025-11-28T00:00:00.000Z","title":"Docker와 Kubernetes 실전 배포 가이드","category":"etc","description":"Docker 컨테이너화부터 Kubernetes 클러스터 배포까지 실전 예제와 함께 완벽하게 정리합니다. Dockerfile 작성, Docker Compose, Kubernetes 리소스 정의, 배포 전략까지 모든 것을 다룹니다.","tags":["Docker","Kubernetes","컨테이너","DevOps","배포","인프라","클라우드"]}},{"excerpt":"PostgreSQL 고급 기능 - JSON, Full-Text Search, Partitioning PostgreSQL은 가장 강력한 오픈소스 관계형 데이터베이스 중 하나다. JSON 지원, Full-Text Search…","fields":{"slug":"/etc/PostgreSQL-고급-기능-JSON-Full-Text-Search-Partitioning/"},"frontmatter":{"date":"2025년 11월 28일","dateISO":"2025-11-28T00:00:00.000Z","title":"PostgreSQL 고급 기능 - JSON, Full-Text Search, Partitioning","category":"etc","description":"PostgreSQL의 고급 기능들을 실전 예제와 함께 정리합니다. JSON/JSONB 데이터 타입, Full-Text Search, 테이블 파티셔닝, 인덱싱 전략, 성능 최적화까지 모든 것을 다룹니다.","tags":["PostgreSQL","데이터베이스","JSON","Full-Text Search","Partitioning","인덱싱","성능 최적화","SQL"]}},{"excerpt":"OAuth 2.0과 JWT 완전정복 - 인증/인가 실전 가이드 OAuth 2.0과 JWT는 현대적인 웹 애플리케이션의 인증/인가 시스템의 핵심이다. 이 글은 OAuth 2.0의 다양한 플로우와 JWT의 생성/검증을 실전 예제와 함께 정리한다.…","fields":{"slug":"/etc/OAuth-2.0과-JWT-완전정복-인증-인가-실전-가이드/"},"frontmatter":{"date":"2025년 11월 28일","dateISO":"2025-11-28T00:00:00.000Z","title":"OAuth 2.0과 JWT 완전정복 - 인증/인가 실전 가이드","category":"etc","description":"OAuth 2.0과 JWT를 활용한 현대적인 인증/인가 시스템을 실전 예제와 함께 완벽하게 정리합니다. Authorization Code Flow, Implicit Flow, Client Credentials, JWT 생성/검증, 보안 모범 사례까지 모든 것을 다룹니다.","tags":["OAuth 2.0","JWT","인증","인가","보안","API","웹 개발","백엔드"]}},{"excerpt":"TypeScript 완전정복 - 타입 시스템부터 고급 패턴까지 TypeScript는 JavaScript에 정적 타입을 추가한 언어로, 대규모 애플리케이션 개발에서 필수적인 도구가 되었다. 이 글은 TypeScript…","fields":{"slug":"/javascript/TypeScript-완전정복-타입-시스템부터-고급-패턴까지/"},"frontmatter":{"date":"2025년 11월 28일","dateISO":"2025-11-28T00:00:00.000Z","title":"TypeScript 완전정복 - 타입 시스템부터 고급 패턴까지","category":"javascript","description":"TypeScript의 타입 시스템부터 고급 패턴까지 실전 예제와 함께 완벽하게 정리합니다. 제네릭, 유틸리티 타입, 조건부 타입, 타입 가드, 모듈 시스템 등 TypeScript의 모든 것을 다룹니다.","tags":["TypeScript","타입 시스템","제네릭","유틸리티 타입","JavaScript","프론트엔드","웹 개발"]}},{"excerpt":"마인드업로드 시리즈 Part 3 - 뇌 시뮬레이션, 디지털 뇌를 만드는 기술 Part 2에서 우리는 뇌의 구조를 완전히 매핑하는 Connectome…","fields":{"slug":"/ai/마인드업로드-시리즈-Part-3-뇌-시뮬레이션/"},"frontmatter":{"date":"2025년 11월 27일","dateISO":"2025-11-27T00:00:00.000Z","title":"마인드업로드 시리즈 Part 3 - 뇌 시뮬레이션, 디지털 뇌를 만드는 기술","category":"ai","description":"뇌 구조를 매핑한 후, 이를 컴퓨터에서 시뮬레이션하는 기술을 설명합니다. 뉴런 모델링, 시냅스 시뮬레이션, 전체 뇌 시뮬레이션 프로젝트, 계산 자원과 성능 최적화를 다룹니다. 이는 마인드업로드 시리즈의 세 번째 글입니다.","tags":["마인드업로드","Mind Upload","뇌 시뮬레이션","Brain Simulation","뉴런 모델링","시냅스 시뮬레이션","Whole Brain Emulation","Blue Brain Project","Human Brain Project","NEURON","뇌 컴퓨팅"]}},{"excerpt":"마인드업로드 시리즈 Part 2 - 뇌 구조 매핑 기술, Connectome을 향한 여정 마인드업로드의 첫 번째 단계는 뇌의 구조를 완전히 이해하는 것이다. 인간의 뇌에는 약 860억 개의 뉴런과 10…","fields":{"slug":"/ai/마인드업로드-시리즈-Part-2-뇌-구조-매핑-기술/"},"frontmatter":{"date":"2025년 11월 24일","dateISO":"2025-11-24T00:00:00.000Z","title":"마인드업로드 시리즈 Part 2 - 뇌 구조 매핑 기술, Connectome을 향한 여정","category":"ai","description":"뇌의 모든 연결을 매핑하는 Connectome 프로젝트와 관련 기술을 설명합니다. 전자 현미경, 초고해상도 이미징, 자동화된 뉴런 추적, 그리고 대규모 뇌 매핑 프로젝트들을 다룹니다. 이는 마인드업로드 시리즈의 두 번째 글입니다.","tags":["마인드업로드","Mind Upload","Connectome","뇌 매핑","전자 현미경","신경 이미징","뉴런 추적","Brain Mapping","신경 연결체","EM 이미징","초고해상도 현미경"]}},{"excerpt":"최신 JavaScript - ES2020부터 ES2024까지, 모던 개발자를 위한 완벽 가이드 ES6(ES2015) 이후 JavaScript는 매년 새로운 기능을 추가하며 빠르게 발전하고 있다. ES2020부터 ES2024까지…","fields":{"slug":"/javascript/최신-JavaScript-ES2020부터-ES2024까지-모던-개발자를-위한-완벽-가이드/"},"frontmatter":{"date":"2025년 11월 24일","dateISO":"2025-11-24T00:00:00.000Z","title":"최신 JavaScript - ES2020부터 ES2024까지, 모던 개발자를 위한 완벽 가이드","category":"javascript","description":"ES2020부터 ES2024까지 추가된 최신 JavaScript 기능을 실전 예제와 함께 설명합니다. Optional Chaining, Nullish Coalescing, Top-level await, Private fields, Pattern Matching, Records & Tuples 등 모던 JavaScript의 모든 것을 다룹니다.","tags":["JavaScript","ES2020","ES2021","ES2022","ES2023","ES2024","ECMAScript","모던 JavaScript","Optional Chaining","Nullish Coalescing","Top-level await","Private Fields"]}},{"excerpt":"혼합현실 (Mixed Reality) - 현실과 가상의 완벽한 융합, 차세대 컴퓨팅 플랫폼 증강현실(AR)과 가상현실(VR) 사이에는 또 다른 차원이 있다. 혼합현실(Mixed Reality, MR…","fields":{"slug":"/ai/혼합현실-Mixed-Reality-현실과-가상의-완벽한-융합/"},"frontmatter":{"date":"2025년 11월 24일","dateISO":"2025-11-24T00:00:00.000Z","title":"혼합현실 (Mixed Reality) - 현실과 가상의 완벽한 융합, 차세대 컴퓨팅 플랫폼","category":"ai","description":"혼합현실(MR)의 개념과 기술을 설명합니다. VR, AR과의 차이, 공간 컴퓨팅, 홀로그램, 공간 앵커링, 그리고 산업별 응용 사례와 미래 전망을 다룹니다.","tags":["혼합현실","Mixed Reality","MR","공간 컴퓨팅","홀로그램","HoloLens","Magic Leap","현실-가상 융합","Spatial Computing","증강현실","가상현실"]}},{"excerpt":"가상세계 - 메타버스 이후의 다음 단계, 완전 몰입형 디지털 현실 메타버스가 화제가 되었지만, 진정한 가상세계는 아직 시작 단계에 있다. 현재의 메타버스는 주로 2D 화면과 VR…","fields":{"slug":"/ai/가상세계-메타버스-이후의-다음-단계/"},"frontmatter":{"date":"2025년 11월 20일","dateISO":"2025-11-20T00:00:00.000Z","title":"가상세계 - 메타버스 이후의 다음 단계, 완전 몰입형 디지털 현실","category":"ai","description":"가상세계의 개념과 기술적 구현 방법을 설명합니다. 메타버스와의 차이, 완전 몰입형 경험을 위한 기술(VR, AR, 뇌-컴퓨터 인터페이스), 사회적 영향, 그리고 미래 전망까지 다룹니다.","tags":["가상세계","Virtual World","메타버스","VR","AR","뇌-컴퓨터 인터페이스","BCI","디지털 현실","몰입형 경험","미래 기술"]}},{"excerpt":"마인드업로드 시리즈 Part 1 - 연구 목표와 방향성, 디지털 불멸을 향한 첫걸음 “내가 죽기 전에 뇌를 컴퓨터에 업로드할 수 있을까?” 이 질문은 SF 소설의 영역에서 벗어나 점점 현실적인 연구 주제가 되고 있다. 마인드업로드(Mind Upload…","fields":{"slug":"/ai/마인드업로드-시리즈-Part-1-연구-목표와-방향성/"},"frontmatter":{"date":"2025년 11월 20일","dateISO":"2025-11-20T00:00:00.000Z","title":"마인드업로드 시리즈 Part 1 - 연구 목표와 방향성, 디지털 불멸을 향한 첫걸음","category":"ai","description":"마인드업로드 연구의 목표와 방향성을 제시합니다. 의식의 본질, 뇌-컴퓨터 인터페이스, 신경 매핑, 의식 전송의 기술적 도전 과제, 그리고 연구 로드맵을 다룹니다. 이는 마인드업로드 시리즈의 첫 번째 글입니다.","tags":["마인드업로드","Mind Upload","의식 전송","뇌-컴퓨터 인터페이스","BCI","디지털 불멸","신경 매핑","Connectome","의식의 본질","뇌 시뮬레이션","Whole Brain Emulation"]}},{"excerpt":"MLOps 실전 가이드 - AI 모델 서빙과 운영 자동화 완벽 정리 머신러닝 모델을 개발하는 것과 프로덕션 환경에서 안정적으로 운영하는 것은 완전히 다른 차원의 문제다. Jupyter Notebook에서 9…","fields":{"slug":"/ai/MLOps-실전-가이드-AI-모델-서빙과-운영-자동화/"},"frontmatter":{"date":"2025년 11월 15일","dateISO":"2025-11-15T00:00:00.000Z","title":"MLOps 실전 가이드 - AI 모델 서빙과 운영 자동화 완벽 정리","category":"ai","description":"MLOps의 개념부터 실전 구현까지. 모델 버전 관리(MLflow), A/B 테스트, 모델 서빙(KServe, Seldon), 성능 모니터링, 데이터 드리프트 감지까지 프로덕션 환경에서 AI 모델을 운영하는 모든 것을 다룹니다.","tags":["MLOps","머신러닝 운영","모델 서빙","MLflow","Kubernetes","AI 모델 배포","모델 모니터링","데이터 드리프트","A/B 테스트","KServe","Seldon"]}},{"excerpt":"Responsible AI Operations 시리즈의 마지막 글이다. Part 1에서 규제 맵핑과 정책을 만들고, Part…","fields":{"slug":"/ai/Responsible-AI-Operations-Part-3-사고-대응과-지속-개선/"},"frontmatter":{"date":"2025년 11월 15일","dateISO":"2025-11-15T00:00:00.000Z","title":"Responsible AI Operations Part 3 사고 대응과 지속 개선","category":"ai","description":"AI 인시던트 대응 Runbook, 커뮤니케이션 체계, 감사·보고 프로세스를 정리합니다. 거버넌스 리뷰 보드 운영과 외부 감사·버그 바운티 연계 전략까지 포함합니다.","tags":["Responsible AI","인시던트 대응","Runbook","감사","거버넌스","지속 개선"]}},{"excerpt":"…","fields":{"slug":"/algorithm/고급-알고리즘-완전정복-세그먼트-트리부터-위상정렬까지/"},"frontmatter":{"date":"2025년 11월 15일","dateISO":"2025-11-15T00:00:00.000Z","title":"고급 알고리즘 완전정복 - 세그먼트 트리부터 위상정렬까지","category":"algorithm","description":"코딩 테스트와 실무에서 자주 사용되는 고급 알고리즘을 완벽 정리. 세그먼트 트리, 펜윅 트리, 유니온 파인드, 최소 공통 조상(LCA), 강한 연결 요소(SCC), 위상 정렬, 최소 신장 트리(MST), 최대 유량 등 실전 문제 해결에 필요한 모든 알고리즘을 JavaScript로 구현합니다.","tags":["알고리즘","Algorithm","세그먼트 트리","Segment Tree","유니온 파인드","Union-Find","위상 정렬","Topological Sort","최소 신장 트리","MST","최대 유량","Max Flow","코딩 테스트","JavaScript"]}},{"excerpt":"React와 Next.js 완전정복 - 현대적 프론트엔드 개발 실전 가이드 React는 현재 가장 인기 있는 프론트엔드 라이브러리이며, Next.js는 React 기반의 풀스택 프레임워크로 빠르게 성장하고 있다. 2024년 기준 React…","fields":{"slug":"/javascript/React-Next.js-완전정복-현대적-프론트엔드-개발-가이드/"},"frontmatter":{"date":"2025년 11월 15일","dateISO":"2025-11-15T00:00:00.000Z","title":"React와 Next.js 완전정복 - 현대적 프론트엔드 개발 실전 가이드","category":"javascript","description":"React Hooks 심화, Server Components, Next.js 14 App Router, React Query, 상태 관리 라이브러리 비교, 성능 최적화까지 현대적 React/Next.js 개발의 모든 것을 실전 예제와 함께 정리합니다.","tags":["React","Next.js","React Hooks","Server Components","React Query","프론트엔드","웹 개발","JavaScript","TypeScript","상태 관리"]}},{"excerpt":"FastAPI 완전정복 - 고성능 비동기 웹 API 개발 실전 가이드 FastAPI는 Python으로 고성능 웹 API를 빠르게 개발할 수 있게 해주는 현대적 웹 프레임워크다. Starlette와 Pydantic을 기반으로 하며, 자동 API…","fields":{"slug":"/python/FastAPI-완전정복-고성능-비동기-웹-API-개발-가이드/"},"frontmatter":{"date":"2025년 11월 15일","dateISO":"2025-11-15T00:00:00.000Z","title":"FastAPI 완전정복 - 고성능 비동기 웹 API 개발 실전 가이드","category":"python","description":"FastAPI 기초부터 고급 활용까지. 비동기 프로그래밍, 의존성 주입, Pydantic 검증, WebSocket, 백그라운드 작업, 데이터베이스 연동, 인증/인가, 테스트까지 실무에서 바로 사용할 수 있는 완벽한 가이드를 제공합니다.","tags":["FastAPI","Python","비동기 프로그래밍","웹 API","REST API","asyncio","Pydantic","WebSocket","데이터베이스","백엔드 개발"]}},{"excerpt":"마이크로서비스 아키텍처 완전정복 - 실전 구축 가이드 마이크로서비스 아키텍처는 대규모 애플리케이션을 독립적으로 배포 가능한 작은 서비스들로 분해하는 아키텍처 패턴이다. 각 서비스는 자체 데이터베이스를 가지며, API…","fields":{"slug":"/springboot/마이크로서비스-아키텍처-완전정복-실전-구축-가이드/"},"frontmatter":{"date":"2025년 11월 15일","dateISO":"2025-11-15T00:00:00.000Z","title":"마이크로서비스 아키텍처 완전정복 - 실전 구축 가이드","category":"springboot","description":"마이크로서비스 아키텍처의 설계 원칙부터 실전 구현까지. Service Mesh(Istio), API Gateway(Kong), 분산 트레이싱(Jaeger), 서비스 디스커버리, 이벤트 기반 아키텍처, 데이터 일관성, 모니터링까지 엔터프라이즈급 마이크로서비스 시스템 구축의 모든 것을 다룹니다.","tags":["마이크로서비스","Microservices","Service Mesh","API Gateway","분산 시스템","Istio","Kong","Jaeger","Kubernetes","이벤트 기반 아키텍처","Spring Cloud"]}},{"excerpt":"Responsible AI Operations 시리즈의 두 번째 글이다. Part…","fields":{"slug":"/ai/Responsible-AI-Operations-Part-2-위험-모니터링과-자동화-파이프라인/"},"frontmatter":{"date":"2025년 11월 14일","dateISO":"2025-11-14T00:00:00.000Z","title":"Responsible AI Operations Part 2 위험 모니터링과 자동화 파이프라인","category":"ai","description":"AI 위험 신호 정의, 모니터링 스택 설계, 자동화된 알림과 대응 파이프라인을 구축하는 방법을 정리합니다. 데이터·모델·운영 지표와 레드팀 자동화를 포함합니다.","tags":["Responsible AI","위험 모니터링","Observability","AI 레드팀","Alert Automation","Error Budget"]}},{"excerpt":"Responsible AI Operations…","fields":{"slug":"/ai/Responsible-AI-Operations-Part-1-규제-맵핑과-정책-프레임워크/"},"frontmatter":{"date":"2025년 11월 13일","dateISO":"2025-11-13T00:00:00.000Z","title":"Responsible AI Operations Part 1 규제 맵핑과 정책 프레임워크","category":"ai","description":"글로벌 AI 규제 동향을 맵핑하고 조직의 정책 프레임워크를 설계하는 방법을 정리합니다. 규제 분류, 위험 기반 의사결정, SOP 템플릿 구성까지 단계별로 안내합니다.","tags":["Responsible AI","AI 규제","정책 프레임워크","위험 관리","AI 거버넌스"]}},{"excerpt":"AI 활용이 조직 전반으로 확산되면, 기술적 우수성 못지않게 거버넌스가 경쟁력이 된다. 책임 있는 AI(Responsible AI…","fields":{"slug":"/ai/AI-거버넌스-조직-설계와-운영-지표/"},"frontmatter":{"date":"2025년 11월 12일","dateISO":"2025-11-12T00:00:00.000Z","title":"AI 거버넌스 조직 설계와 운영 지표","category":"ai","description":"책임 있는 AI 운영을 위한 거버넌스 조직 구조, 역할·책임(RACI), 정책 수명주기, 핵심 운영 지표와 도입 로드맵을 정리합니다.","tags":["AI 거버넌스","Responsible AI","RACI","정책 관리","AI 규제","운영 지표"]}},{"excerpt":"RWA(Real World Asset…","fields":{"slug":"/blockchain/RWA-토큰화-후속-아키텍처-실물-결제와-커스터디-연동-전략/"},"frontmatter":{"date":"2025년 11월 12일","dateISO":"2025-11-12T00:00:00.000Z","title":"RWA 토큰화 후속 아키텍처 실물 결제와 커스터디 연동 전략","category":"blockchain","description":"실물자산(RWA) 토큰화 이후 오프체인 결제, 커스터디, 감사 체계를 어떻게 연동할지 아키텍처 구성요소와 운영 전략을 분석합니다.","tags":["RWA","실물자산 토큰화","커스터디","결제 인프라","블록체인 아키텍처","규제 준수"]}},{"excerpt":"생성형 AI 서비스를 운영하다 보면 모델 응답 시간, 성공률, 비용까지 다양한 지표를 동시에 관리해야 한다. Spring Boot 3+는 Observability 스택을 내장해, Micrometer와 OpenTelemetry…","fields":{"slug":"/springboot/Spring-Observability와-AI-서비스-SLO-관리/"},"frontmatter":{"date":"2025년 11월 12일","dateISO":"2025-11-12T00:00:00.000Z","title":"Spring Observability와 AI 서비스 SLO 관리","category":"springboot","description":"Spring Observability, Micrometer, OpenTelemetry를 활용해 LLM·AI 마이크로서비스의 SLO를 설계하고 운영 지표를 수집·자동화하는 방법을 다룹니다.","tags":["Spring Observability","Micrometer","OpenTelemetry","SLO","AI 서비스","Error Budget"]}},{"excerpt":"생성형 AI…","fields":{"slug":"/ai/AI-레드팀과-모델-평가-생성형-AI-안전성-테스트-실전-가이드/"},"frontmatter":{"date":"2025년 11월 11일","dateISO":"2025-11-11T00:00:00.000Z","title":"AI 레드팀과 모델 평가 생성형 AI 안전성 테스트 실전 가이드","category":"ai","description":"생성형 AI 서비스에 대한 레드팀 프로세스 설계, 공격 시나리오, 자동화 도구와 평가 지표를 정리하고 조직이 구축해야 할 안전성 테스트 전략을 소개합니다.","tags":["AI 레드팀","모델 평가","안전성 테스트","LLM","AI 보안","Prompt Injection"]}},{"excerpt":"블록체인과 토큰 인센티브를 활용하여 현실 세계의 인프라를 구축·운영하는 모델이 빠르게 확산되고 있다. 이를 DePIN(Decentralized Physical Infrastructure Network)이라고 부른다. IoT 네트워크, GPU…","fields":{"slug":"/blockchain/DePIN-분산-물리-인프라-네트워크의-부상과-비즈니스-모델/"},"frontmatter":{"date":"2025년 11월 11일","dateISO":"2025-11-11T00:00:00.000Z","title":"DePIN 분산 물리 인프라 네트워크의 부상과 비즈니스 모델","category":"blockchain","description":"DePIN(Decentralized Physical Infrastructure Network)의 개념과 시장 동향을 정리하고, 대표 프로젝트 사례, 토큰 이코노미, 비즈니스 모델, 규제 이슈를 분석합니다.","tags":["DePIN","분산 인프라","토큰 이코노미","블록체인 비즈니스","Helium","Render Network"]}},{"excerpt":"LLM 서비스를 배포할 때 항상 고정형 서버 혹은 컨테이너를 사용할 필요는 없다. 이벤트가 발생했을 때만 함수를 실행하는 서버리스(Serverless) 모델은 비용 최적화와 운영 단순화 측면에서 매력적이다. Spring Cloud Function…","fields":{"slug":"/springboot/Spring-Cloud-Function과-Serverless-LLM-이벤트-기반-AI-마이크로서비스-구축/"},"frontmatter":{"date":"2025년 11월 11일","dateISO":"2025-11-11T00:00:00.000Z","title":"Spring Cloud Function과 Serverless LLM 이벤트 기반 AI 마이크로서비스 구축","category":"springboot","description":"Spring Cloud Function과 Serverless 플랫폼을 결합하여 LLM 기반 이벤트 마이크로서비스를 설계하는 방법을 아키텍처, 구현, 운영 관점에서 정리합니다.","tags":["Spring Cloud Function","Serverless","LLM","마이크로서비스","이벤트 기반 아키텍처","AWS Lambda"]}},{"excerpt":"온디바이스 생성형 AI 프라이버시 친화형 경량 모델 설계 트렌드 초거대 생성형 AI는 클라우드 의존도가 높지만, 개인정보 보호 규제와 지연 시간 요구가 강화되면서 모델을 사용자 장치에서 실행하려는 시도가 빠르게 늘고 있다. 온디바이스 생성형 AI…","fields":{"slug":"/ai/온디바이스-생성형-AI-프라이버시-친화형-경량-모델-설계-트렌드/"},"frontmatter":{"date":"2025년 11월 9일","dateISO":"2025-11-09T00:00:00.000Z","title":"온디바이스 생성형 AI 프라이버시 친화형 경량 모델 설계 트렌드","category":"ai","description":"온디바이스 생성형 AI의 개념과 아키텍처, 경량화 기법, 프라이버시 중심 설계 전략을 정리하고 실무 적용 가이드와 모니터링 팁을 제공한다.","tags":["온디바이스 AI","생성형 AI","프라이버시","모델 최적화","엣지 컴퓨팅","TinyML","모바일 AI","개인정보보호"]}},{"excerpt":"Node.js 애플리케이션은 비동기 호출이 얽히면서 요청별 로깅, 트랜잭션 ID…","fields":{"slug":"/javascript/async-localstorage로-nodejs-비동기-컨텍스트-추적하기/"},"frontmatter":{"date":"2025년 11월 9일","dateISO":"2025-11-09T00:00:00.000Z","title":"AsyncLocalStorage로 Node.js 비동기 컨텍스트 추적하기","category":"javascript","description":"Node.js 20 이후의 AsyncLocalStorage로 비동기 컨텍스트를 안정적으로 추적하는 방법과 Express, Fastify 실무 적용 전략을 정리한다.","tags":["Node.js","AsyncLocalStorage","비동기","컨텍스트","로깅","트랜잭션","Observability"]}},{"excerpt":"AI 보안과 모델 공급망 위험 관리 대형 언어 모델과 생성형 AI…","fields":{"slug":"/ai/AI-보안과-모델-공급망-위험-관리/"},"frontmatter":{"date":"2025년 11월 7일","dateISO":"2025-11-07T00:00:00.000Z","title":"AI 보안과 모델 공급망 위험 관리","category":"ai","description":"고도화된 LLM과 멀티모달 모델이 늘어나면서 등장한 보안 위협과 모델 공급망 리스크를 분석하고, 대응 전략과 거버넌스 수립 방법을 정리합니다.","tags":["AI 보안","모델 공급망","LLM","AI 거버넌스","Threat Modeling","Model Safety"]}},{"excerpt":"블록체인은 한동안 “모든 것을 하나의 체인에서 처리”하는 모놀리식 구조가 대세였다. 하지만 확장성과 개발 유연성의 한계가 드러나면서, 데이터 가용성·합의·실행 레이어를 분리하는 모듈형(Modular…","fields":{"slug":"/blockchain/소버린-롤업과-모듈형-블록체인-아키텍처/"},"frontmatter":{"date":"2025년 11월 7일","dateISO":"2025-11-07T00:00:00.000Z","title":"소버린 롤업과 모듈형 블록체인 아키텍처","category":"blockchain","description":"모듈형 블록체인과 소버린 롤업의 개념을 정리하고, 데이터·실행·합의 계층의 분리 전략, 프로젝트 사례, 설계 시 고려사항을 소개합니다.","tags":["모듈형 블록체인","소버린 롤업","Rollup","블록체인 아키텍처","Celestia","EigenLayer"]}},{"excerpt":"Spring 팀이 2024년 공개한 Spring AI는 LLM API 연동과 추론 워크플로우를 Spring Boot 애플리케이션에 자연스럽게 녹여준다. 동시에 기업들은 데이터 주권과 지연 시간 문제를 해결하기 위해 엣지(Edge…","fields":{"slug":"/springboot/Spring-AI와-엣지-배포-LLM-서비스-아키텍처-구축-가이드/"},"frontmatter":{"date":"2025년 11월 7일","dateISO":"2025-11-07T00:00:00.000Z","title":"Spring AI와 엣지 배포 LLM 서비스 아키텍처 구축 가이드","category":"springboot","description":"Spring AI 프로젝트와 엣지 추론 인프라를 결합하여 LLM 서비스를 설계하는 방법을 아키텍처, 구현 패턴, 운영 전략 관점에서 정리합니다.","tags":["Spring AI","Spring Boot","LLM 서비스","엣지 컴퓨팅","AI 아키텍처","Observability"]}},{"excerpt":"퀵 정렬 (Quick Sort) 퀵 정렬은 분할 정복 방식으로 평균적으로 O(n log n…","fields":{"slug":"/algorithm/퀵-정렬-quick-sort/"},"frontmatter":{"date":"2025년 11월 6일","dateISO":"2025-11-06T08:43:00.000Z","title":"퀵 정렬 (Quick Sort)","category":"algorithm","description":"퀵 정렬은 분할 정복 알고리즘으로 평균적으로 매우 빠른 정렬 알고리즘이다. 피벗을 선택해 기준으로 삼고, 작은 값과 큰 값을 분할해 재귀적으로 정렬한다.","tags":["퀵 정렬","Quick Sort","정렬","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"LangChain을 활용한 LLM 애플리케이션 개발 LLM을 활용한 애플리케이션을 만들 때는 프롬프트 관리, 메모리 처리, 외부 도구 연결 등 복잡한 작업이 필요하다. LangChain…","fields":{"slug":"/ai/LangChain을-활용한-LLM-애플리케이션-개발/"},"frontmatter":{"date":"2025년 11월 6일","dateISO":"2025-11-06T02:15:00.000Z","title":"LangChain을 활용한 LLM 애플리케이션 개발","category":"ai","description":"LangChain 프레임워크의 개념과 활용 방법을 설명합니다. Chain, Agent, Memory의 개념과 실무 예시까지 알아봅니다.","tags":["LangChain","LLM","AI 애플리케이션","Chain","Agent","Memory","AI"]}},{"excerpt":"…","fields":{"slug":"/blockchain/가상화폐/"},"frontmatter":{"date":"2025년 11월 6일","dateISO":"2025-11-06T00:00:00.000Z","title":"가상화폐란? 암호화폐와의 차이와 실무 활용","category":"blockchain","description":"가상화폐의 개념과 특징을 설명합니다. 암호화폐와의 차이, 주요 가상화폐 종류, 실무 활용 사례, 그리고 투자 시 주의사항까지 알아봅니다.","tags":["블록체인","가상화폐","암호화폐","비트코인","이더리움","디지털자산"]}},{"excerpt":"블록체인(Blockchain)은 2…","fields":{"slug":"/blockchain/블록체인-blockchain/"},"frontmatter":{"date":"2025년 11월 6일","dateISO":"2025-11-06T00:00:00.000Z","title":"블록체인(Blockchain)이란? 작동 원리와 실무 활용","category":"blockchain","description":"블록체인의 개념과 작동 원리를 설명합니다. 분산 원장 기술, 합의 알고리즘, 스마트 컨트랙트, 그리고 실무 활용 사례까지 알아봅니다.","tags":["블록체인","Blockchain","비트코인","분산원장","스마트컨트랙트","암호화폐","DeFi"]}},{"excerpt":"…","fields":{"slug":"/etc/夫狹相爲則責望-自爲則事行-부협상위즉책망-자위즉사행-한비자-외저설-좌상편/"},"frontmatter":{"date":"2025년 11월 6일","dateISO":"2025-11-06T00:00:00.000Z","title":"夫狹相爲則責望 自爲則事行(부협상위즉책망 자위즉사행) - 한비자의 리더십 철학","category":"etc","description":"한비자의 '부협상위즉책망 자위즉사행'을 현대적 관점에서 해석합니다. 상호 의존적 관계의 문제점과 자기 주도적 업무 수행의 중요성, 실무 적용 방법을 알아봅니다.","tags":["한비자","부협상위즉책망 자위즉사행","한비자 외저설 좌상편","리더십","조직관리","자기주도성"]}},{"excerpt":"…","fields":{"slug":"/etc/배움이란-모방에서-시작해-독창으로-나아가는-과정이다/"},"frontmatter":{"date":"2025년 11월 6일","dateISO":"2025-11-06T00:00:00.000Z","title":"배움이란 모방에서 시작해 독창으로 나아가는 과정이다 - 다산 정약용의 학습 철학","category":"etc","description":"다산 정약용의 학습 철학을 현대적 관점에서 해석합니다. 모방에서 독창으로 나아가는 학습 과정, 실무 적용 방법, 그리고 효과적인 학습 전략을 알아봅니다.","tags":["정약용","다산의마지막습관","배움","학습","모방","독창성","교육"]}},{"excerpt":"…","fields":{"slug":"/etc/수오재기-나-라는-것은/"},"frontmatter":{"date":"2025년 11월 6일","dateISO":"2025-11-06T00:00:00.000Z","title":"수오재기 '나' 라는 것은 - 자아 정체성과 자기 인식에 대한 고찰","category":"etc","description":"수오재기의 '나'에 대한 철학적 통찰을 현대적 관점에서 해석합니다. 자아 정체성의 불안정성과 자기 인식의 중요성, 그리고 실무에서의 적용 방법을 알아봅니다.","tags":["수오재기","자아","자기인식","철학","정체성"]}},{"excerpt":"파이썬(Python)은 1991년 귀도 반 로섬(Guido van Rossum…","fields":{"slug":"/python/파이썬-python-이란/"},"frontmatter":{"date":"2025년 11월 6일","dateISO":"2025-11-06T00:00:00.000Z","title":"파이썬(Python)이란? 설치부터 실무 활용까지","category":"python","description":"파이썬의 개념과 특징을 설명합니다. 설치 방법, 기본 문법, 주요 라이브러리, 그리고 데이터 과학과 머신러닝 분야에서의 실무 활용까지 알아봅니다.","tags":["파이썬","Python","프로그래밍","데이터과학","머신러닝","딥러닝","텐서플로","파이토치"]}},{"excerpt":"AI 모델 양자화 스마트폰에서도 돌아가는 AI의 비밀 GPT-4는 강력하지만 수백 GB의 메모리와 고성능 GPU가 필요하다. 일반 스마트폰이나 작은 서버에서는 실행하기 어렵다. 양자화(Quantization…","fields":{"slug":"/ai/AI-모델-양자화-스마트폰에서도-돌아가는-AI의-비밀/"},"frontmatter":{"date":"2025년 11월 5일","dateISO":"2025-11-05T00:00:00.000Z","title":"AI 모델 양자화 스마트폰에서도 돌아가는 AI의 비밀","category":"ai","description":"AI 모델 양자화의 개념과 작동 원리를 설명합니다. QAT, PTQ, GPTQ, AWQ 비교와 실무 적용, 성능 분석까지 알아봅니다.","tags":["양자화","Quantization","모델 압축","모델 최적화","AI","LLM","모바일 AI","엣지 AI"]}},{"excerpt":"Fine-tuning과 LoRA 나만의 AI 모델을 만드는 방법 채팅GPT는 일반적인 지식은 풍부하지만, 특정 회사의 정책이나 전문 분야 지식은 부족하다. 이런 한계를 극복하는 방법 중 하나가 Fine-tuning…","fields":{"slug":"/ai/Fine-tuning과-LoRA-나만의-AI-모델을-만드는-방법/"},"frontmatter":{"date":"2025년 11월 5일","dateISO":"2025-11-05T00:00:00.000Z","title":"Fine-tuning과 LoRA 나만의 AI 모델을 만드는 방법","category":"ai","description":"Fine-tuning과 LoRA의 개념과 작동 원리를 설명합니다. Full Fine-tuning vs LoRA 비교, 실무 적용 방법, 비용과 성능 분석까지 알아봅니다.","tags":["Fine-tuning","파인튜닝","LoRA","Low-Rank Adaptation","모델 학습","AI","LLM","도메인 특화"]}},{"excerpt":"멀티모달 AI 텍스트, 이미지, 음성을 동시에 이해하는 AI의 혁명 채팅GPT는 텍스트만 이해했다. 하지만 GPT-4V가 등장하면서 AI는 이미지를 보고 설명할 수 있게 되었다. 이제 AI…","fields":{"slug":"/ai/멀티모달-AI-텍스트-이미지-음성을-동시에-이해하는-AI/"},"frontmatter":{"date":"2025년 11월 5일","dateISO":"2025-11-05T00:00:00.000Z","title":"멀티모달 AI 텍스트, 이미지, 음성을 동시에 이해하는 AI의 혁명","category":"ai","description":"멀티모달 AI의 개념과 작동 원리를 설명합니다. GPT-4V, Claude 3, Gemini의 멀티모달 능력 비교와 실무 활용 사례까지 알아봅니다.","tags":["멀티모달 AI","Multimodal AI","GPT-4V","Claude 3","Gemini","Vision Transformer","이미지 인식","AI"]}},{"excerpt":"벡터 데이터베이스 RAG의 핵심 인프라 벡터 데이터베이스는 텍스트, 이미지, 음성 등을 숫자 벡터로 변환해 저장하고, 의미적 유사도를 빠르게 검색할 수 있는 전용 데이터베이스 이다. RAG(Retrieval-Augmented Generation…","fields":{"slug":"/ai/벡터-데이터베이스-RAG의-핵심-인프라/"},"frontmatter":{"date":"2025년 11월 2일","dateISO":"2025-11-02T00:00:00.000Z","title":"벡터 데이터베이스 RAG의 핵심 인프라","category":"ai","description":"벡터 데이터베이스의 개념과 RAG 시스템에서의 역할을 설명합니다. 임베딩, 유사도 검색, 주요 벡터 DB 종류와 실무 활용까지 알아봅니다.","tags":["벡터 데이터베이스","Vector Database","RAG","임베딩","Embedding","유사도 검색","Pinecone","Weaviate","Milvus"]}},{"excerpt":"프롬프트 엔지니어링 LLM을 제대로 쓰는 방법 프롬프트 엔지니어링은 LLM에 효과적인 지시를 작성하여 원하는 결과를 얻는 기술 이다. 같은 LLM이라도 프롬프트에 따라 출력 품질이 크게 달라진다. “요약해줘”보다 “…","fields":{"slug":"/ai/프롬프트-엔지니어링-LLM을-제대로-쓰는-방법/"},"frontmatter":{"date":"2025년 11월 2일","dateISO":"2025-11-02T00:00:00.000Z","title":"프롬프트 엔지니어링 LLM을 제대로 쓰는 방법","category":"ai","description":"프롬프트 엔지니어링의 핵심 기법과 실무 활용 가이드를 설명합니다. Zero-shot, Few-shot, Chain of Thought부터 실전 예시까지 알아봅니다.","tags":["프롬프트 엔지니어링","Prompt Engineering","LLM","Chain of Thought","Zero-shot","Few-shot","AI","ChatGPT"]}},{"excerpt":"MOC/MOO imbalance 데이터 분석 핵심 요약 MOC/MOO imbalance는 의료 데이터 분석에서 모성 산과적 상태(Maternal Obstetric Conditions, MOC)와 결과(Maternal Obstetric Outcomes…","fields":{"slug":"/etc/MOC-MOO-imbalance-데이터-분석/"},"frontmatter":{"date":"2025년 11월 1일","dateISO":"2025-11-01T18:00:00.000Z","title":"MOC/MOO imbalance 데이터 분석","category":"etc","description":"MOC/MOO imbalance 데이터 분석 방법론과 실무 활용 가이드. 클래스 불균형 문제 해결 기법부터 실전 인사이트까지.","tags":["MOC","MOO","데이터 분석","Data Analysis","클래스 불균형","Class Imbalance","머신러닝","Machine Learning"]}},{"excerpt":"채팅GPT를 사용해본 사람이라면 한 번쯤 이렇게 생각했을 것이다. “이 AI는 왜 지식만 있고 행동은 못할까?” 채팅GPT는 질문에 답변만 할 뿐, 실제로 무엇을 하지는 못한다. 하지만 AI Agent…","fields":{"slug":"/ai/AI가-스스로-행동한다-LLM과-AI-Agent의-충격적인-차이/"},"frontmatter":{"date":"2025년 11월 1일","dateISO":"2025-11-01T14:00:00.000Z","title":"AI가 스스로 행동한다? LLM과 AI Agent의 충격적인 차이","category":"ai","description":"AI Agent의 정의와 작동 원리를 비유로 설명합니다. 단순 LLM과 Agent의 차이, Agent가 어떻게 목표를 달성하는지 알아봅니다.","tags":["AI Agent","에이전트","Agent","AI","인공지능","자율 에이전트","LLM"]}},{"excerpt":"채팅GPT를 사용하다 보면 “이 정보가 맞나?”라는 의심이 든다. AI는 매우 확신에 차 있는 어조로 가짜 정보를 만들기도 한다. 이를 “AI 환각(Hallucination)“이라고 한다. RAG(Retrieval-Augmented Generation…","fields":{"slug":"/ai/AI-환각을-막는다-RAG가-만드는-신뢰할-수-있는-AI/"},"frontmatter":{"date":"2025년 11월 1일","dateISO":"2025-11-01T13:00:00.000Z","title":"AI 환각을 막는다? RAG가 만드는 신뢰할 수 있는 AI","category":"ai","description":"RAG(검색 기반 생성)가 LLM의 한계를 어떻게 극복하는지 설명합니다. 검색과 생성의 결합, 실무 적용 예시까지 알아봅니다.","tags":["RAG","Retrieval Augmented Generation","검색 기반 생성","AI","LLM","벡터 검색","임베딩"]}},{"excerpt":"채팅GPT가 등장하면서 인공지능에 대한 대중의 관심이 급증했다. 많은 사람들이 채팅GPT에게 질문하고 답변을 받지만, 정작 그 뒤에서 무엇이 일어나는지는 모른다. 이 글은 LLM(Large Language Model…","fields":{"slug":"/ai/채팅GPT의-비밀-공개-LLM이-당신과-대화하는-진짜-원리/"},"frontmatter":{"date":"2025년 11월 1일","dateISO":"2025-11-01T12:00:00.000Z","title":"채팅GPT의 비밀 공개 LLM이 당신과 대화하는 진짜 원리","category":"ai","description":"채팅GPT의 핵심 기술인 LLM이 어떻게 우리와 대화하는지 쉽게 설명합니다. 트랜스포머 아키텍처부터 다음 단어 예측까지, AI의 언어 이해 원리를 알아봅니다.","tags":["LLM","Large Language Model","트랜스포머","Transformer","인공지능","AI","채팅GPT","딥러닝"]}},{"excerpt":"KMP 알고리즘 (Knuth-Morris-Pratt) KMP…","fields":{"slug":"/algorithm/kmp-알고리즘-kmp-algorithm/"},"frontmatter":{"date":"2025년 11월 1일","dateISO":"2025-11-01T00:00:00.000Z","title":"KMP 알고리즘 (Knuth-Morris-Pratt)","category":"algorithm","description":"문자열 검색을 효율적으로 수행하는 알고리즘. 실패 함수(Failure Function)를 이용해 불필요한 비교를 건너뛰며, 시간복잡도는 O(N+M)이다.","tags":["KMP 알고리즘","Knuth-Morris-Pratt","문자열 검색","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"벨만-포드 알고리즘 (Bellman-Ford…","fields":{"slug":"/algorithm/벨만-포드-bellman-ford/"},"frontmatter":{"date":"2025년 11월 1일","dateISO":"2025-11-01T00:00:00.000Z","title":"벨만-포드 알고리즘 (Bellman-Ford)","category":"algorithm","description":"음수 가중치가 있는 그래프에서 최단 경로를 구할 수 있는 알고리즘. 음수 사이클 감지도 가능하며, 시간복잡도는 O(VE)이다.","tags":["벨만-포드","Bellman-Ford","최단 경로","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"병합 정렬 (Merge Sort) 병합 정렬은 배열을 반으로 나누고 재귀적으로 정렬한 뒤 합치는 분할 정복 방식의 정렬 알고리즘이다. 정의 배열을 크기가…","fields":{"slug":"/algorithm/병합-정렬-merge-sort/"},"frontmatter":{"date":"2025년 11월 1일","dateISO":"2025-11-01T00:00:00.000Z","title":"병합 정렬 (Merge Sort)","category":"algorithm","description":"분할 정복(Divide and Conquer) 기법을 사용하는 안정 정렬 알고리즘. 시간복잡도는 O(N log N)이며, 추가 공간이 필요하다.","tags":["병합 정렬","Merge Sort","정렬","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"최장 공통 부분수열 (LCS) LCS는 두 문자열에서 공통으로 나타나는 부분수열 중 가장 긴 것을 찾는 동적 계획법 문제다. 정의 부분수열은 원래 문자열에서 일부 문자를 순서대로 선택한 것이다. 예를 들어 “ABCD”의 부분수열에는 “A”, “AC…","fields":{"slug":"/algorithm/최장-공통-부분수열-lcs/"},"frontmatter":{"date":"2025년 11월 1일","dateISO":"2025-11-01T00:00:00.000Z","title":"최장 공통 부분수열 (LCS)","category":"algorithm","description":"두 문자열의 공통 부분수열 중 가장 긴 것을 찾는 동적 계획법 문제. 문자열 유사도 측정과 차이점 분석에 활용된다.","tags":["최장 공통 부분수열","LCS","Longest Common Subsequence","동적 계획법","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"트리 순회 (Tree Traversal…","fields":{"slug":"/algorithm/트리-순회-tree-traversal/"},"frontmatter":{"date":"2025년 11월 1일","dateISO":"2025-11-01T00:00:00.000Z","title":"트리 순회 (Tree Traversal)","category":"algorithm","description":"이진 트리에서 노드를 방문하는 순서를 다르게 하는 세 가지 순회 방법. 전위, 중위, 후위 순회로 나뉘며 재귀 또는 스택으로 구현 가능하다.","tags":["트리 순회","Tree Traversal","전위 순회","중위 순회","후위 순회","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"깊이 우선 탐색 (DFS) DFS…","fields":{"slug":"/algorithm/깊이우선탐색-depth-first-search/"},"frontmatter":{"date":"2025년 10월 30일","dateISO":"2025-10-30T00:00:00.000Z","title":"깊이 우선 탐색 (Depth-First Search, DFS)","category":"algorithm","description":"그래프에서 한 경로를 가능한 깊게 따라간 뒤, 더 갈 곳이 없으면 되돌아오는 탐색 방법. 재귀 또는 스택을 사용하며, 연결 요소 탐색과 위상 정렬 등에 활용된다.","tags":["깊이 우선 탐색","Depth-First Search","DFS","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"너비 우선 탐색 (BFS) BFS…","fields":{"slug":"/algorithm/너비우선탐색-breadth-first-search/"},"frontmatter":{"date":"2025년 10월 30일","dateISO":"2025-10-30T00:00:00.000Z","title":"너비 우선 탐색 (Breadth-First Search, BFS)","category":"algorithm","description":"그래프에서 시작 정점으로부터 가까운 정점부터 차례대로 탐색하는 알고리즘. 최단 간선 수 경로 탐색에 유용하며 큐(Queue)를 사용한다.","tags":["너비 우선 탐색","Breadth-First Search","BFS","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"다익스트라 (Dijkstra) 다익스트라는 비음수 가중치 그래프에서 시작 정점으로부터 각 정점까지의 최단 거리를 구한다. 정의 가중치가 모두…","fields":{"slug":"/algorithm/다익스트라-dijkstra/"},"frontmatter":{"date":"2025년 10월 30일","dateISO":"2025-10-30T00:00:00.000Z","title":"다익스트라 알고리즘 (Dijkstra)","category":"algorithm","description":"가중치가 모두 비음수인 그래프에서 한 시작 정점으로부터의 최단 경로를 구하는 알고리즘. 우선순위 큐(최소 힙)를 사용하면 효율적이다.","tags":["다익스트라","Dijkstra","최단 경로","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"이진 탐색 (Binary Search…","fields":{"slug":"/algorithm/이진-탐색-binary-search/"},"frontmatter":{"date":"2025년 10월 30일","dateISO":"2025-10-30T00:00:00.000Z","title":"이진 탐색 (Binary Search)","category":"algorithm","description":"정렬된 배열에서 중간값을 기준으로 탐색 범위를 절반으로 줄여가며 값을 찾는 알고리즘. 시간복잡도는 O(log N)이다.","tags":["이진 탐색","Binary Search","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"최소 동전 수 (Coin Change, DP) 그리디로는 항상 최적을 보장하지 못하는 거스름돈 문제를, 동적 계획법으로 최적해로 해결한다. 정의 여러 종류의 동전으로 딱 맞게 금액 N…","fields":{"slug":"/algorithm/최소-동전수-dp-coin-change/"},"frontmatter":{"date":"2025년 10월 30일","dateISO":"2025-10-30T00:00:00.000Z","title":"최소 동전 수 (Coin Change, DP)","category":"algorithm","description":"동적 계획법(DP)을 사용하여 특정 금액을 만들기 위한 최소 동전 개수를 구한다. 그리디가 항상 최적을 보장하지 않는 경우에도 최적해를 보장하는 방법이다.","tags":["동적 계획법","Dynamic Programming","Coin Change","알고리즘","Algorithm","JavaScript"]}},{"excerpt":"Function Calling과 Tool Use - LLM이 실제 도구를 사용하는 방법 채팅GPT나 클로드 같은 LLM을 사용해본 사람이라면 한 가지 아쉬운 점을 느꼈을 것이다. 이 AI…","fields":{"slug":"/ai/Function-Calling과-Tool-Use-LLM이-실제-도구를-사용하는-방법/"},"frontmatter":{"date":"2025년 1월 15일","dateISO":"2025-01-15T11:00:00.000Z","title":"Function Calling과 Tool Use - LLM이 실제 도구를 사용하는 방법","category":"ai","description":"Function Calling과 Tool Use를 통해 LLM이 API 호출, 데이터베이스 조회, 코드 실행 등 실제 도구를 사용하는 방법을 설명합니다. OpenAI, Anthropic, Google의 구현 방식과 실전 활용 예시를 알아봅니다.","tags":["Function Calling","Tool Use","LLM","API","OpenAI","Anthropic","Google","AI","Agent"]}},{"excerpt":"AI Agent 프레임워크 비교 - AutoGPT vs CrewAI vs LangGraph 실전 가이드 AI Agent를 처음 만들어보려는 개발자라면, 그 복잡함에 놀랄 수 있다. 단순히 AI에게 질문하고 답변을 받는 것이 아니라, AI…","fields":{"slug":"/ai/AI-Agent-프레임워크-비교-AutoGPT-vs-CrewAI-vs-LangGraph-실전-가이드/"},"frontmatter":{"date":"2025년 1월 15일","dateISO":"2025-01-15T10:00:00.000Z","title":"AI Agent 프레임워크 비교 - AutoGPT vs CrewAI vs LangGraph 실전 가이드","category":"ai","description":"AI Agent를 구축하기 위한 주요 프레임워크인 AutoGPT, CrewAI, LangGraph를 비교 분석합니다. 각 프레임워크의 특징, 장단점, 실전 활용 방법을 알아봅니다.","tags":["AI Agent","AutoGPT","CrewAI","LangGraph","프레임워크","에이전트","Agent","AI","LLM"]}},{"excerpt":"프로젝트 킥오프 가이드 반응형 웹 디자인 반응형 웹 디자인(responsive web design, RWD)이란 하나의 웹사이트에서 PC, 스마트폰, 태블릿 PC…","fields":{"slug":"/etc/반응형-웹-기획-디자인-개발/"},"frontmatter":{"date":"2022년 2월 12일","dateISO":"2022-02-12T17:58:59.354Z","title":"반응형 웹 기획, 디자인, 개발","category":"etc","description":"반응형 웹 디자인(responsive web design, RWD)이란 하나의 웹사이트에서 PC, 스마트폰, 태블릿 PC 등 접속하는 디스플레이의 종류에 따라 화면의 크기가 자동으로 변하도록 만든 웹페이지 접근 기법을 말한다. 웹사이트를 PC용과 모바일용으로 각각 별개로 제작하지 않고, 하나의 공용 웹사이트를 만들어 다양한 디바이스에 대응할 수 있다.","tags":["반응형 웹","디자인","UI컴포넌트","적응형 웹"]}},{"excerpt":"…","fields":{"slug":"/etc/flutter-and-react-native/"},"frontmatter":{"date":"2022년 1월 3일","dateISO":"2022-01-03T21:58:59.354Z","title":"Flutter, React Native","category":"etc","description":"플러터(Flutter)는 구글이 개발한 오픈 소스 모바일 애플리케이션 개발 프레임워크이다. 안드로이드, iOS용 애플리케이션 개발을 위해, 또 구글 퓨시아용 애플리케이션 개발의 주된 방식으로 사용된다. 리액트 네이티브(React Native)는 페이스북이 개발한 오픈 소스 모바일 애플리케이션 프레임워크이다.안드로이드, iOS, 웹, UWP용 애플리케이션을 개발하기 위해 사용되며, 개발자들이 네이티브 플랫폼 기능과 더불어 리액트를 사용할 수 있게 한다.","tags":["flutter","reactnative","dart","javascript","크로스플랫폼이"]}},{"excerpt":"Vue Js 한글 입력 과 IME IME…","fields":{"slug":"/vue/vue-js-한글-입력/"},"frontmatter":{"date":"2021년 11월 27일","dateISO":"2021-11-27T15:11:34.709Z","title":"Vue Js 한글 입력 과 IME","category":"vue","description":"IME란 한국어, 중국어, 일본어, 한자처럼 컴퓨너 자판에 있는 글자보다 더 많은 수의 문자를 계산서나 조합하여 입력해 주는 시스템 소프트웨어이다. 이러한 조합이 필요한 언어들은 v-model 디렉티브를 활용할 때 제대로 동작 안되는 문제가 있어, @input 이벤트를 활용하여 v-model 디렉티브 기능을 대신 구현해야 정확한 데이터 바인딩을 할 수 있다.","tags":["vue","javascript","framework","frontend","web","ime"]}},{"excerpt":"Vue Js 서버 사이드 렌더링 서버 사이드 렌더링이란 서버에서 페이지를 렌더링후 클라이언트(브라우저)로 보내 화면에 표시하는 기법을 의미한다. 뷰 싱글 페이지 애플리케이션을 서버 사이드 렌더링의 반대인 클라이언트 사이드 렌더링 방식이다. CSR…","fields":{"slug":"/vue/vue-js-서버-사이드-렌더링/"},"frontmatter":{"date":"2021년 5월 16일","dateISO":"2021-05-16T16:11:34.709Z","title":"Vue Js 서버 사이드 렌더링","category":"vue","description":null,"tags":["vue","javascript","framework","frontend","web","ssr"]}},{"excerpt":"Vue Js 뷰 JWT 기반 사용자 인증 JWT ( JSON WEB TOKEN ) 이란? JWT 는 JSON Web Token의 약자로 전자 서명 된 URL-safe (URL로 이용할 수있는 문자 만 구성된)의 JSON이다. 전자 서명은 JSON…","fields":{"slug":"/vue/vue-js-jwt-기반-사용자-인증/"},"frontmatter":{"date":"2021년 5월 9일","dateISO":"2021-05-09T15:11:34.709Z","title":"Vue Js 뷰 JWT 기반 사용자 인증","category":"vue","description":"라우트에 연결하거나 탐색을 수행 할 때 이름이 있는 라우트를 사용할수 있다. 사용 법은 routes 에 name 옵션을 지정 하면 된다. 라우트 관리가 편리 하다 라는 장점이 있다.","tags":["vue","javascript","framework","frontend","web","router guards","jwt"]}},{"excerpt":"Android ROOM 개요 Room은 SQLite에 대한 추상화 레이어를 제공하여 원활한 데이터베이스 액세스를 지원하는 동시에 SQLite…","fields":{"slug":"/android/android-room/"},"frontmatter":{"date":"2021년 5월 2일","dateISO":"2021-05-02T18:11:34.709Z","title":"Android ROOM","category":"android","description":null,"tags":["android","kotlin","framework","room"]}},{"excerpt":"Vue Js 소프트웨어국제화(i18n) 단순히 번역 원고를 받아 글자 바꾸는 것보다 신경 써야 할 부분이 많다. 그 부분들을 통틀어 국제화(Internationalization; i18n) 라고 한다. i18n은 어떤 프레임워크가 아니고 i와 n…","fields":{"slug":"/vue/vue-js-소프트웨어국제화-i18n/"},"frontmatter":{"date":"2021년 5월 2일","dateISO":"2021-05-02T16:11:34.709Z","title":"Vue Js 소프트웨어국제화(i18n)","category":"vue","description":"라우트에 연결하거나 탐색을 수행 할 때 이름이 있는 라우트를 사용할수 있다. 사용 법은 routes 에 name 옵션을 지정 하면 된다. 라우트 관리가 편리 하다 라는 장점이 있다.","tags":["vue","javascript","framework","frontend","web","file","FormData","FileReader"]}},{"excerpt":"Vue Js 뷰 파일업로드 MIME TYPE이란 이미지나 사진 동영상 파일등은 바이너리 데이터이다. 즉 0과…","fields":{"slug":"/vue/vue-js-파일업로드/"},"frontmatter":{"date":"2021년 5월 2일","dateISO":"2021-05-02T15:11:34.709Z","title":"Vue Js 뷰 파일업로드","category":"vue","description":"라우트에 연결하거나 탐색을 수행 할 때 이름이 있는 라우트를 사용할수 있다. 사용 법은 routes 에 name 옵션을 지정 하면 된다. 라우트 관리가 편리 하다 라는 장점이 있다.","tags":["vue","javascript","framework","frontend","web","file","FormData","FileReader"]}},{"excerpt":"Vue Js Vee Validate 개요 서비스 개발시 Form 유효성 검사는 필수다. 보통 정규표현식을 사용하여 간단하게 구현할수 있고, HTML 에서 기본적으로 지원해 주는 type, required…","fields":{"slug":"/vue/vue-js-vee-validate/"},"frontmatter":{"date":"2021년 4월 25일","dateISO":"2021-04-25T23:11:34.709Z","title":"Vue Js Vee Validate","category":"vue","description":"서비스 개발시 Form 유효성 검사는 필수이다. 보통 정규표현식을 사용하여 간단하게 구현할수 있지만, Vue 에서는 VeeValidate 를 활용하여 일관성 있는 Form 유효성 검사 기능을 구현 할수 있다.","tags":["vue","javascript","framework","frontend","web","veevalidate","library"]}},{"excerpt":"2021년도에는 아래와 같은 순서로 하나하나 살펴 보고자 한다. Internet HTTP/S HTTP/S 개념과 차이에 대해 학습 한다. Basic HTML 하이퍼텍스트 마크업 언어는 웹 페이지를 위한 지배적인 마크업 언어다. 또한, HTML…","fields":{"slug":"/etc/2021-front-end-road-map/"},"frontmatter":{"date":"2021년 4월 25일","dateISO":"2021-04-25T17:58:59.354Z","title":"2021 Front end Road Map","category":"etc","description":"2021년 Front End Road Map HTTP/S, HTML, CSS, JavaScript, NPM, BEM, Styled Component, CSS Module, Prettier, Jest, Cypress, Electron 등..","tags":["roadmap","frontend","2021년"]}},{"excerpt":"아산상회 언박싱 데이 (Unboxing Day) - 스타트업 데모데이 발표 회사 제시키친 온라인 부스 : https://asansanghoeunboxing.oopy.io/a7459c20-bde6-4e5c-9ff8-37f19921404c…","fields":{"slug":"/etc/아산상회-2기-언박싱-데이-unboxing-day-스타트업-데모데이-정리/"},"frontmatter":{"date":"2021년 4월 23일","dateISO":"2021-04-23T23:22:55.354Z","title":"아산상회 2기 언박싱 데이 (Unboxing Day) - 스타트업 데모데이 정리","category":"etc","description":"아산나눔재단에서 주최하는 글로벌 팀창업 프로그램 아산상회 Unboxing Day 회사별 특징 정리","tags":["아산나눔재단","아산상회","데모데이"]}},{"excerpt":"애자일 스크럼 애자일의 스크럼(Scrum)은 특정 개발 언어나 방법론에 의존적이지 않으며, 제품 개발 뿐만 아니라 일반적인 프로젝트 관리에도 사용 가능한 프로세스 프레임워크입니다. 스크럼(Scrum)은 작은 주기(Sprint…","fields":{"slug":"/etc/애자일-스크럼/"},"frontmatter":{"date":"2021년 4월 22일","dateISO":"2021-04-22T23:23:59.354Z","title":"애자일 스크럼","category":"etc","description":"애자일의 스크럼(Scrum)은 특정 개발 언어나 방법론에 의존적이지 않으며, 제품 개발 뿐만 아니라 일반적인 프로젝트 관리에도 사용 가능한 프로세스 프레임워크입니다. 스크럼(Scrum)은 작은 주기(Sprint)로 개발 및 검토를 하며 효율적인 협업 방법을 제공한다.","tags":["스크럼","프로젝트","애자일"]}},{"excerpt":"JAMStack 이란 JAMStack Jamstack은 Javascript, API 및 Markup의 약자이며 2015 년 Netlify의 CEO 인 Mathias Biilmann…","fields":{"slug":"/etc/jamstack-이란/"},"frontmatter":{"date":"2021년 4월 18일","dateISO":"2021-04-18T22:11:34.709Z","title":"JAMStack 이란","category":"etc","description":"Jamstack은 Javascript, API 및 Markup의 약자이며 2015 년 Netlify의 CEO 인 Mathias Biilmann이 처음 만들어졌습니다. 서버 없이 배포 운영되는 모던 웹 개발 구조 이며, 장점으로는 높은 안정성, 빠른 성능, 확장성 및 낮은 비용, 쉬운 자동화 등이 있습니다.","tags":["JAMStack","Gatsby","Nuxt.js","Next.js","Netlify"]}},{"excerpt":"…","fields":{"slug":"/etc/프로젝트-킥오프-가이드/"},"frontmatter":{"date":"2021년 4월 17일","dateISO":"2021-04-17T14:23:59.354Z","title":"프로젝트 킥오프 가이드","category":"etc","description":"킥오프 미팅을 앞두고 있다면, 우선 회의에서 이야기할 주제를 결정해야 한다. 그다음 안건과 프로젝트의 내용, 목적, 현황 분석이 담긴 자료를 배포하여, 팀웜들이 프로젝트 내용에 대해 사전에 숙지할 수 있도록 한다. 누구를 미팅에 초대해야 할지가 정해졌다는 가정하에 성공적인 킥오프 미팅을 위해서는 미팅 아젠다를 전략적으로 잘 계획하는 것은 매우 중요하다. 미팅 아젠다는 참석자들에게 지침서 역할과 함께 회의를 준비하고 집중할 수 있도록 하며 진행자에게는 회의 운영의 뼈대를 제공하고 회의가 산으로 가는 것을 막을 수 있게 하는 도구가 되기도 한다.","tags":["킥오프미팅","프로젝트","애자일"]}},{"excerpt":"NPM의 신규 or 업데이트된 JavaScript 라이브러는 최신 안정화 Node.js 버전이 필요하다. 따라서 Node.js 를 주기적으로 업데이트를 해줘야 한다. Mac 기준 Node.js…","fields":{"slug":"/etc/mac-에서-node-js-npm-업데이트-하기-2021/"},"frontmatter":{"date":"2021년 4월 14일","dateISO":"2021-04-14T00:37:23.601Z","title":"Mac 에서 Node.js, NPM 업데이트 하기 (2021)","category":"etc","description":"NPM의 신규 or 업데이트된 JavaScript 라이브러는 최신 안정화 Node.js 버전이 필요하다. 따라서 Node.js 를 주기적으로 업데이트를 해줘야 한다. Mac 기준 Node.js 를 가장 쉽게 업데이트 할수 있는 방법을 소개 하고자 한다.","tags":["javascript","nodejs","npm","update","mac"]}},{"excerpt":"Vue Js Axios 및 Rest Api 를 활용한 CRUD 구현 Aajx AJAX (Asynchronous Javascript And XML)\nAJAX란, Javascript의 라이브러리중 하나이며 Asynchronous Javascript And…","fields":{"slug":"/vue/vue-js-axios-및-rest-api-를-활용한-crud-구현/"},"frontmatter":{"date":"2021년 4월 11일","dateISO":"2021-04-11T23:11:34.709Z","title":"Vue Js Axios 및 Rest Api 를 활용한 CRUD 구현","category":"vue","description":"Axios는 브라우저, Node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리이다. 비동기 방식은 웹페이지를 리로드하지 않고 데이터를 불러오는 방식이며,Ajax를 통해서 서버에 요청을 한 후 멈추어 있는 것이 아니라 그 프로그램은 계속 돌아간다는 의미를 내포하고 있다.","tags":["vue","javascript","framework","frontend","web","axios","ajax","crud"]}},{"excerpt":"Vue Js Vuex 저장소(store) 속성 및 모듈화 폴더 모듈화 & Namespacing Vue Js Vuex Modules 중간 크기 이상의 복잡한 앱을 제작할 때 getters & mutations & actions…","fields":{"slug":"/vue/vue-js-vuex-저장소-store-속성-및-모듈화/"},"frontmatter":{"date":"2021년 4월 11일","dateISO":"2021-04-11T21:11:34.709Z","title":"Vue Js Vuex 저장소(store) 속성 및 모듈화","category":"vue","description":"중간 크기 이상의 복잡한 앱을 제작할 때 getters & mutations & actions 의 이름을 유일하게 정하지 않으면 namespace 충돌이 난다. 따라서, 네임스페이스를 구분하기 위해 types.js 로 각 속성의 이름들을 빼고 store.js 와 각 컴포넌트에 import 하여 사용하는 방법이 있다. 혹은 modules 라는 폴더로 만들어 각 단위별로 파일을 분리해서 관리하는 방법도 있다.","tags":["vue","javascript","framework","frontend","web","vuex","modules"]}},{"excerpt":"Vue Js Vuex State, Mutations, Actions, Getters 이해 및 활용 Vuex State Vuex State 는 데이터 상태를 관리 합니다. Vuex State 등록  에 count state…","fields":{"slug":"/vue/vue-js-vuex-state-mutations-actions-getters-이해-및-활용/"},"frontmatter":{"date":"2021년 4월 11일","dateISO":"2021-04-11T20:11:34.709Z","title":"Vue Js Vuex State, Mutations, Actions, Getters 이해 및 활용","category":"vue","description":"Vuex State 는 데이터 상태를 관리 하며, Getters 를 사용하여 동일한 로직을 중앙에서 관리 하도록한다. Mutations 에는 순차적인 로직들만 선언하고 Actions 에는 비 순차적 또는 비동기 처리 로직들을 선언한다. 그리고 mapGetters, mapMutations, mapActions 등 헬퍼 함수가 있다.","tags":["vue","javascript","framework","frontend","web","vuex","mutations","actions","getters"]}},{"excerpt":"Vue Js Vuex 설치 및 등록 Vuex 설치 및 등록 Vue Js Vuex Install Vuex 를 등록할 자바스크립트 파일을 하나 새로 생성합니다. 이름은 store/index.js 로 합니다. Vue Js Vuex Dir main.js…","fields":{"slug":"/vue/vue-js-vuex-설치-및-등록/"},"frontmatter":{"date":"2021년 4월 11일","dateISO":"2021-04-11T19:11:34.709Z","title":"Vue Js Vuex 설치 및 등록","category":"vue","description":"Vuex는 npm install vuex 로 설치 할수 있다.","tags":["vue","javascript","framework","frontend","web","vuex"]}},{"excerpt":"스프링 부트 Unit Test Unit Test 유닛 테스트(unit test)는 컴퓨터 프로그래밍에서 소스 코드의 특정 모듈이 의도된 대로 정확히 작동하는지 검증하는 절차다. 즉, 모든 함수와 메소드에 대한 테스트 케이스(Test case…","fields":{"slug":"/springboot/스프링-부트-unit-test/"},"frontmatter":{"date":"2021년 4월 8일","dateISO":"2021-04-08T23:19:29.537Z","title":"스프링 부트 Unit Test","category":"springboot","description":"유닛 테스트(unit test)는 컴퓨터 프로그래밍에서 소스 코드의 특정 모듈이 의도된 대로 정확히 작동하는지 검증하는 절차다. JUnit 은 Java에서 독립된 단위테스트(Unit Test)를 지원해주는 프레임워크이다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크","스프링부트구조","아키텍쳐","Junit"]}},{"excerpt":"스프링 부트 Spring Security를 활용한 인증 및 권한부여 Spring Security…","fields":{"slug":"/springboot/스프링-부트-spring-security를-활용한-인증-및-권한부여/"},"frontmatter":{"date":"2021년 4월 8일","dateISO":"2021-04-08T22:19:29.537Z","title":"스프링 부트 Spring Security를 활용한 인증 및 권한부여","category":"springboot","description":"스프링 시큐리티는 스프링 기반의 애플리케이션의 보안(인증과 권한,인가 등)을 담당하는 스프링 하위 프레임워크이다. 주로 서블릿 필터와 이들로 구성된 필터체인으로의 위임모델을 사용한다. 그리고 보안과 관련해서 체계적으로 많은 옵션을 제공해주기 때문에 개발자 입장에서는 일일이 보안관련 로직을 작성하지 않아도 된다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크","스프링부트구조","아키텍쳐","Spring Security"]}},{"excerpt":"스프링 부트 MessageSource를 활용한 Exception 처리 MessageSource란 ApplicationContext는 다양한 기능을 상속하고 있다, 그중 MessageSource…","fields":{"slug":"/springboot/스프링-부트-message-source를-활용한-exception-처리/"},"frontmatter":{"date":"2021년 4월 8일","dateISO":"2021-04-08T21:59:29.537Z","title":"스프링 부트 MessageSource를 활용한 Exception 처리","category":"springboot","description":"ApplicationContext는 다양한 기능을 상속하고 있다, 그중 MessageSource는 다국어 처리를 할 때 사용되는 객체이다. 스프링 부트를 사용한다면 별다른 설정 필요없이 messages.properties 로 정의하면 된다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크","스프링부트구조","아키텍쳐","MessageSource"]}},{"excerpt":"스프링 부트 ControllerAdvice를 활용한 Exception…","fields":{"slug":"/springboot/스프링-부트-controller-advice를-활용한-exception-처리/"},"frontmatter":{"date":"2021년 4월 8일","dateISO":"2021-04-08T21:29:29.537Z","title":"스프링 부트 ControllerAdvice를 활용한 Exception 처리","category":"springboot","description":"오류 처리는 프로그램을 개발하는데 있어서 매우 큰 부분을 차지한다. 오류를 예측해서 비정상적인 상황이 발생하지 않게 하는 것은 중요하다. 과하다할 만큼 상세하고 다양하게 예외를 잡아 처리해준다면, 클라이언트도 그렇고 서버도 그렇고 더 안정적인 프로그램이 될 수 있게 도와준다. 예외 처리에 집중 하다 보면, 비즈니스 로직에 집중하기 어렵고, 비즈니스 로직과 관련된 코드보다 예외 처리를 위한 코드가 더 많아지는 경우도 생기게 된다. 이런 문제를 조금이라도 개선하기 위해 @ExceptionHandler와 @ControllerAdvice를 사용한다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크","스프링부트구조","아키텍쳐","ControllerAdvice"]}},{"excerpt":"스프링 부트 API 인터페이스 및 결과 데이터 구조 설계 API 서버 개발 진행을 위해 api 인터페이스 및 결과 데이터의 구조를 살펴보고 확장 가능한 형태로 설계해 보자. api는 제공 대상이 클라이언트 App 또는 Web…","fields":{"slug":"/springboot/스프링-부트-API-인터페이스-및-결과-데이터-구조-설계/"},"frontmatter":{"date":"2021년 4월 8일","dateISO":"2021-04-08T20:29:29.537Z","title":"스프링 부트 API 인터페이스 및 결과 데이터 구조 설계","category":"springboot","description":"Http 프로토콜은 여러 가지 사용목적에 따라 GET, POST, PUT, DELETE, FETCH.. 등 HttpMethod를 제공하고 있다. 주소 체계는 정형화된 구조로 구성하고 HttpMethod를 통해 리소스의 사용목적을 판단되도록 해야 한다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크","스프링부트구조","아키텍쳐"]}},{"excerpt":"Vue Js Vuex의 개념 및 구조의 이해 Vuex Vuex는 Vue.js…","fields":{"slug":"/vue/vue-js-vuex의-개념-및-구조의-이해/"},"frontmatter":{"date":"2021년 4월 4일","dateISO":"2021-04-04T19:11:34.709Z","title":"Vue Js Vuex의 개념 및 구조의 이해","category":"vue","description":"Vuex는 Vue.js 애플리케이션에 대한 상태 관리 패턴 + 라이브러리 이다. 애플리케이션의 모든 컴포넌트에 대한 중앙 집중식 저장소 역할을 하며 예측 가능한 방식으로 상태를 변경할 수 있다.","tags":["vue","javascript","framework","frontend","web","router"]}},{"excerpt":"Vue Js 뷰 네임드 라우트 뷰 네임드 라우트(Named Routes) 라우트에 연결하거나 탐색을 수행 할 때 이름이 있는 라우트를 사용할수 있다. 사용 법은 routes 에 name…","fields":{"slug":"/vue/vue-js-네임드-라우트/"},"frontmatter":{"date":"2021년 4월 4일","dateISO":"2021-04-04T15:11:34.709Z","title":"Vue Js 뷰 네임드 라우트","category":"vue","description":"라우트에 연결하거나 탐색을 수행 할 때 이름이 있는 라우트를 사용할수 있다. 사용 법은 routes 에 name 옵션을 지정 하면 된다. 라우트 관리가 편리 하다 라는 장점이 있다.","tags":["vue","javascript","framework","frontend","web","router","named-routes"]}},{"excerpt":"Vue Js 히스토리 관리 History API 리엑트, 뷰, 앵귤러를 사용하면 기본적으로 싱글 페이지 애플리케이션(SPA) 형태로 개발 하게 된다. SPA…","fields":{"slug":"/vue/vue-js-히스토리-관리/"},"frontmatter":{"date":"2021년 4월 4일","dateISO":"2021-04-04T15:11:34.709Z","title":"Vue Js 히스토리 관리","category":"vue","description":"vue-router의 기본 모드는 hash mode 입니다. URL 해시를 사용하여 전체 URL을 시뮬레이트하므로 URL이 변경될 때 페이지가 다시 로드 되지 않는다. 해시를 제거하기 위해 라우터의 history 모드 를 사용할 수 있다. history.pushState API를 활용하여 페이지를 다시 로드하지 않고도 URL 탐색을 할 수 있다.","tags":["vue","javascript","framework","frontend","web","router"]}},{"excerpt":"Vue Js Redirect / Alias Redirect 리디렉션은 routes 에서 설정 할 수 있습니다. /user에서 /post…","fields":{"slug":"/vue/vue-js-redirect-alias/"},"frontmatter":{"date":"2021년 4월 4일","dateISO":"2021-04-04T15:11:34.709Z","title":"Vue Js Redirect / Alias","category":"vue","description":"리디렉션은 routes 에서 설정 할 수 있습니다. 별칭은 /user의 별칭은 /post는 사용자가 /post를 방문했을 때 URL은 /post을 유지하지만 사용자가 /user를 방문한 것처럼 매칭하는것 이다. 아래 처럼 위 라우터를 구현 할수 있다.","tags":["vue","javascript","framework","frontend","web","router","redirect","alias"]}},{"excerpt":"Vue Js 동적 라우트 뷰 동적 라우트(Dynamic Route Matching) 주어진 패턴을 가진 라우트를 동일한 컴포넌트에 매핑해야하는 경우가 있다. 예를 들어 게시물 상세보기에 대해 동일한 레이아웃을 가지지만 하지만 다른 게시물 ID…","fields":{"slug":"/vue/vue-js-동적-라우트/"},"frontmatter":{"date":"2021년 4월 4일","dateISO":"2021-04-04T13:11:34.709Z","title":"Vue Js 동적 라우트","category":"vue","description":"주어진 패턴을 가진 라우트를 동일한 컴포넌트에 매핑해야하는 경우가 있다. 예를 들어 게시물 상세보기에 대해 동일한 레이아웃을 가지지만 하지만 다른 게시물 ID로 렌더링되어야하는 Post 컴포넌트가 있을 수 있다. vue-router에서 경로에서 동적 세그먼트를 사용하여 아래와 같이 할 수 동적으로 라우트를 매칭하여 세그먼트를 같은 레이아웃에 다른 게시물을 보여줄수 있다.","tags":["vue","javascript","framework","frontend","web","router","dynamic-route-matching"]}},{"excerpt":"그리디 알고리즘 (Greedy Algorithm…","fields":{"slug":"/algorithm/그리디-알고리즘-greedy-algorithm/"},"frontmatter":{"date":"2021년 4월 4일","dateISO":"2021-04-04T13:02:48.519Z","title":"그리디 알고리즘 (Greedy Algorithm)","category":"algorithm","description":"그리디 알고리즘, 탐욕 알고리즘 이라고도 부른다. 그리드 알고리즘은 최적해를 구하는 데에 사용되는 근사적인 방법으로, 여러 경우 중 하나를 결정해야 할 때마다 그 순간에 최적이라고 생각 되는것을 선택해 나가는 방식이다.","tags":["그리디 알고리즘","Greedy","Algorithm","알고리즘","JavaScript"]}},{"excerpt":"Vue Js 뷰 중첩 라우트 뷰 중첩 라우트(Nested Routes) 실제 앱 UI는 일반적으로 여러 단계로 중첩 된 컴포넌트로 이루어져 있다. URL…","fields":{"slug":"/vue/vue-js-중첩-라우트/"},"frontmatter":{"date":"2021년 4월 4일","dateISO":"2021-04-04T11:11:34.709Z","title":"Vue Js 뷰 중첩 라우트","category":"vue","description":"라우터 컴포넌트 안에 하위에 라우터 컴포넌트를 중첩하여 구성하는 방식이 중첩 라우트 이다.","tags":["vue","javascript","framework","frontend","web","router","nested-routes"]}},{"excerpt":"Vue JS Router 설치 및 설정 라우팅(Routing…","fields":{"slug":"/vue/vue-js-router-설치-및-설정/"},"frontmatter":{"date":"2021년 4월 4일","dateISO":"2021-04-04T10:11:34.709Z","title":"Vue JS Router 설치 및 설정","category":"vue","description":"웹에서의 라우팅은 웹 페이지 간의 이동 방법을 뜻 한다. 예를 들면 아래와 같다. Vue.js의 공식 라우트 이고, Vue.js 코어와 긴밀하게 연결되어 SPA를 쉽게 구축 할 수 있다. 그리고 화면 간의 이동 시, 깜빡거림 없이 매끄럽게 전환 할수 있다. (HTML History API)","tags":["vue","javascript","framework","frontend","web","router"]}},{"excerpt":"스프링 부트 Swagger API 문서 자동화 Swagger는 개발자가 REST 웹 서비스를 설계, 빌드, 문서화, 소비하는 일을 도와주는 대형 도구 생태계의 지원을 받는 오픈 소스 소프트웨어 프레임워크이다. 대부분의 사용자들은 스웨거 UI…","fields":{"slug":"/springboot/스프링-부트-swagger-api-문서-자동화/"},"frontmatter":{"date":"2021년 4월 1일","dateISO":"2021-04-01T23:39:29.537Z","title":"스프링 부트 Swagger API 문서 자동화","category":"springboot","description":"Swagger는 개발자가 REST 웹 서비스를 설계, 빌드, 문서화, 소비하는 일을 도와주는 대형 도구 생태계의 지원을 받는 오픈 소스 소프트웨어 프레임워크이다. 대부분의 사용자들은 스웨거 UI 도구를 통해 스웨거를 식별하며 스웨거 툴셋에는 자동화된 문서화, 코드 생성, 테스트 케이스 생성 지원이 포함되며, 간단한 설정으로 프로젝트에서 지정한 URL들을 HTML화면으로 확인할 수 있게 해준다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크","Swagger"]}},{"excerpt":"스프링 부트 MariaDB 연동 스프링 부트 MariaDB 연동 순서는 아래와 같다. DB설치 및 테스트 데이터베이스 생성 Spring Boot에 새로운 프로젝트 생성 Spring JDBC 연결 Spring Boot와 JPA 들어가기에 앞서 JDBC…","fields":{"slug":"/springboot/스프링-부트-mariadb-연동/"},"frontmatter":{"date":"2021년 4월 1일","dateISO":"2021-04-01T22:29:29.537Z","title":"스프링 부트 MariaDB 연동","category":"springboot","description":"JDBC는 자바 프로그램이 DBMS에 일관된 방식으로 접근할 수 있도록 API를 제공하는 자바 클래스들의 모임이다. MariaDB 특징은 기존에 MySQL 엔터프라이즈에서 플러그인으로 제공한 쓰레드풀 기능이 내장됐으며, 스토리지 엔진을 활용한 샤딩 기술을 제공한다. 즉, MySQL의 오픈소스 버전을 넘어 모든 버전을 대체할 수 있는 특징들을 갖추고 있다. JPA는 여러 ORM 전문가가 참여한 EJB 3.0 스펙 작업에서 기존 EJB ORM이던 Entity Bean을 JPA라고 바꾸고 JavaSE, JavaEE를 위한 영속성(persistence) 관리와 ORM을 위한 표준 기술이다. JPA는 ORM 표준 기술로 Hibernate, OpenJPA, EclipseLink, TopLink Essentials과 같은 구현체가 있고 이에 표준 인터페이스가 바로 JPA이다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크","MariaDB","JDBC"]}},{"excerpt":"Vue JS 인스턴스 & 컴포넌트 소개 인스턴스 Vue 인스턴스는 생성된 Vue 오브젝트 하나의 오브젝트 이다. Vue…","fields":{"slug":"/vue/vue-js-인스턴스-&-컴포넌트-소개/"},"frontmatter":{"date":"2021년 3월 28일","dateISO":"2021-03-28T10:11:34.709Z","title":"Vue JS 인스턴스 & 컴포넌트 소개","category":"vue","description":"Vue 인스턴스는 생성될 때 일련의 초기화 단계를 거친다. 데이터가 변경되어 DOM을 업데이트하는 경우가 있다고 가정 하면, 그 과정에서 사용자 정의 로직을 실행할 수있는 라이프사이클의 훅 도 호출 된다. 컴포넌트는 하나의 블록을 의미한다. 레고처럼 여러 블럭을 쌓아서 하나의 집을 모양을 만들 듯이, 컴포넌트를 활용하여 화면을 만들면 보다 빠르게 구조화하여 일괄적인 패턴으로 개발할 수 있다. 이렇게 화면의 영역을 컴포넌트로 쪼개서 재활용할 수 있는 형태로 관리하면 나중에 코드를 재사용 할수 있다. 또한 모든 사람들이 레고의 사용설명서처럼 정해진 방식대로 컴포넌트를 등록하거나 사용하게 되므로 남이 작성한 코드를 직관적으로 이해할 수 있다.","tags":["vue","javascript","framework","frontend","web"]}},{"excerpt":"Vue JS 이해 및 환경설정 Vue.js는 웹 애플리케이션의 사용자 인터페이스를 만들기 위해 사용하는 오픈 소스 프로그레시브 자바스크립트 프레임워크이다. 아래와 같은 특징을 가진다. 특징 SPA (Single Page Application…","fields":{"slug":"/vue/vue-js-이해-및-환경설정/"},"frontmatter":{"date":"2021년 3월 28일","dateISO":"2021-03-28T09:11:34.709Z","title":"Vue JS 이해 및 환경설정","category":"vue","description":"뷰(Vue.js)는 점진적으로 채택 가능한 구조를 갖추고 있다. 코어 라이브러리는 선언형 렌더링과 컴포넌트 구성에 초점을 두며 기존 페이지에 임베드가 가능하다. 라우팅, 상태 관리, 빌드 도구화와 같이 복잡한 애플리케이션에 필요한 고급 기능들은 공식적으로 유지 보수되는 지원 라이브러리와 패키지를 통해 제공된다.","tags":["vue","javascript","framework","frontend","web"]}},{"excerpt":"스프링 부트 구조 Spring Boot Architecture 스프링 부트 아키텍쳐는 아래와 같다. Spring Boot Architecture Controller Layer : UI 에서 요청을 받고 응답을 전달 한다. Service Layer…","fields":{"slug":"/springboot/스프링-부트-구조/"},"frontmatter":{"date":"2021년 3월 23일","dateISO":"2021-03-23T22:29:29.537Z","title":"스프링 부트 구조","category":"springboot","description":"스프링부트는 최소한의 설정으로 스프링 플랫폼과 서드파티 라이브러리들을 사용 할 수 있도록 고안된 프레임워크 이다. 즉 스프링 부트는 환경 설정을 최소화하고 개발자가 비즈니스 로직에 집중할 수 있게하여 생산성을 크게 향상시켜준다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크","스프링부트구조","아키텍쳐"]}},{"excerpt":"Gradle, Maven 기본 개념과 Gradle Multi Project Maven, Gradle은 라이브러리 관리, 프로젝트 관리, 단위 테스트 시 의존성 관리를 한다. Maven XML 사용 pom.xml…","fields":{"slug":"/springboot/gradle-maven-기본-개념/"},"frontmatter":{"date":"2021년 3월 23일","dateISO":"2021-03-23T20:29:29.537Z","title":"Gradle, Maven 기본 개념과 Gradle Multi Project","category":"springboot","description":"Maven, Gradle은 라이브러리 관리, 프로젝트 관리, 단위 테스트 시 의존성 관리를 한다. Maven은 pom.xml을 이용한 정형화된 빌드 시스템, Gradle은 build.gradle을 이용한 정형화된 빌드 시스템 이다. Gradle은 Multi Project 를 구성 하여 공통된 부분을 효율적으로 활용 할수 있다.","tags":["XML","Groovy","의존성","Gradle","Maven","Gradle Multi Project","빌드시스템"]}},{"excerpt":"JavaScript 기본 문법 변수,조건문,반복문,함수 식별자 변수, 리터럴(상수), 함수 등의 이름이다.\n이러한 식별자를 만들때는 규칙이 있는데 다음과 같다. 숫자로 시작할수 없다. 예약어 (if, True , False…","fields":{"slug":"/javascript/javascript-기본-문법-변수-조건문-반복문-함수/"},"frontmatter":{"date":"2021년 3월 21일","dateISO":"2021-03-21T09:06:14.444Z","title":"JavaScript 기본 문법 변수,조건문,반복문,함수","category":"javascript","description":"자바스크립트에는 적연 변수와 지역 변수가 있고 연산자는 산술, 증감, 비트, 시프트, 대입, 비교, 논리, 조건 등이 있다. 마지막으로 조건문는 if - else, switch 등이 있다. 자바스크립트 연산자는 산술, 증감, 비트, 시프트, 대입, 비교, 논리, 조건 등이 있다.","tags":["Javascript","변수","조건문","반복문","함수"]}},{"excerpt":"JavaScript 기본 문법 DOM, BOM JavaScript는 웹 브라우저 기반의 객체 위에서 동작합니다. 그래서 DOM 과 BOM에 대해 자세히 알 필요가 있다. BOM…","fields":{"slug":"/javascript/javascript-기본-문법-dom-bom/"},"frontmatter":{"date":"2021년 3월 20일","dateISO":"2021-03-20T09:05:14.444Z","title":"JavaScript 기본 문법 DOM, BOM","category":"javascript","description":"JavaScript는 웹 브라우저 기반의 객체 위에서 동작합니다. 그래서 DOM 과 BOM에 대해 자세히 알 필요가 있다. DOM 은 Document Object Model 이다. BOM 은 Browser Object Model 이다.","tags":["Javascript","DOM","BOM","node"]}},{"excerpt":"JavaScript MVC vs MVVM 개념의 이해 MVC Mode View Contorller의 약자로 어플리케이션을 모델, 뷰, 컨트롤러 세 부분으로 나누어 역할을 구분한 것이다. JavaScript MVC…","fields":{"slug":"/javascript/javascript-mvc-mvvm-개념의-이해/"},"frontmatter":{"date":"2021년 3월 20일","dateISO":"2021-03-20T09:03:14.444Z","title":"JavaScript MVC vs MVVM 개념의 이해","category":"javascript","description":"MVC 모델이 가지고 있는 정보를 따로 저장해서는 안된다. 모델이나 컨트롤러와 같이 다른 구성 요소를 몰라야한다. 변경이 일어나면 변경 통지에 대한 처리 방법을 구현해야한다. 뷰는 사용자에게 데이타를 출력하고 표현하는 영역이다. 즉, 사용자가 눈으로 확인할 수 있는 UI 화면이다. 컨트롤러는 컨트롤러는 모델과 뷰의 중개자로써 사용자의 입력을 받고 처리하는 부분이다.","tags":["Javascript","MVC","MVVM","디자인 패턴"]}},{"excerpt":"JavaScript MVC 디자인 패턴 개념 이해 MVC…","fields":{"slug":"/javascript/javascript-mvc-디자인-패턴-개념-이해/"},"frontmatter":{"date":"2021년 3월 20일","dateISO":"2021-03-20T09:01:14.444Z","title":"JavaScript MVC 디자인 패턴 개념 이해","category":"javascript","description":"사용자는 애플리케이션과 상호작용한다. 컨트롤러의 이벤트 헨들러가 작동된다. 컨트롤러는 모델로부터 데이터를 요구하고, 그 결과를 뷰로 전달한다. 뷰는 데이터를 사용자에게 보여준다.","tags":["Javascript","MVC","디자인 패턴"]}},{"excerpt":"HTTP, HTTP2 기본 개념 HTTP HTTP1.1은 1999년 출시 이후 지금까지 가장 많이 사용되고 있다. HTTP는 웹상에서 클라이언트와 웹서버간 통신을 위한 프로토콜 중 하나다. HTTP1.…","fields":{"slug":"/springboot/http-1-http2-기본-개념/"},"frontmatter":{"date":"2021년 3월 19일","dateISO":"2021-03-19T23:29:29.537Z","title":"HTTP, HTTP2 기본 개념","category":"springboot","description":"HTTP1.1은 1999년 출시 이후 지금까지 가장 많이 사용되고 있다. HTTP는 웹상에서 클라이언트와 웹서버간 통신을 위한 프로토콜 중 하나다. HTTP1.1은 기본적으로 연결당 하나의 요청과 응답을 처리하기 때문에 동시전송 문제와 다수의 리소스를 처리하기에 속도와 성능 이슈를 가지고 있다. HTTP2는 성능 뿐만 아니라 속도면에서도 월등하다. Multiplexed Streams(한 커넥션에 여러개의 메세지를 동시에 주고 받을 수 있다), Stream Prioritization(요청 리소스간 의존관계를 설정), Server Push(HTML문서상에 필요한 리소스를 클라이언트 요청없이 보내줄 수 있다), Header Compression(Header 정보를 HPACK압충방식을 이용하여 압축전송)을 사용하여 성능을 획기적으로 향상 시켰다.","tags":["HTTP","HTTP/1","HTTP/2"]}},{"excerpt":"목표 Vue 와 ECMAScript 6 을 활용하여 단일 페이지 프론트엔드 개발을 할 수 있다. Router 를 활용 하여 다수의 화면 컨트롤 할 수 있다. Vuex 를 활용하여 클라이언트 상태 관리를 할 수 있다. MVC, MVVM…","fields":{"slug":"/study/Vue-JS를-활용한-프론트엔드-개발/"},"frontmatter":{"date":"2021년 3월 17일","dateISO":"2021-03-17T20:29:29.537Z","title":"Vue JS를 활용한 프론트엔드 개발","category":"study","description":"Vue 와 ECMAScript6 을 활용하여 웹페이지 개발 방법에 대해 학습하고, JamStack 기반 블로그를 개발 합니다.","tags":["Vue.js","JamStack","Netlify","Nuxt.js","JavaScript"]}},{"excerpt":"목표 Spring Boot 를 활용하여 Rest API 를 개발 할 수 있다. Swagger UI 를 활용하여 동적 API 명세서를 제공 할 수 있다. 자바 ORM 기술을 사용 할 수 있다. Spring Boot & MariaDB, & JPA…","fields":{"slug":"/study/Spring-Boot를-활용한-Rest-API-개발/"},"frontmatter":{"date":"2021년 3월 17일","dateISO":"2021-03-17T20:29:29.537Z","title":"Spring Boot를 활용한 Rest API 개발","category":"study","description":"스프링 부트를 활용하여 REST API를 개발하고 Swagger UI 로 API 문서화 자동화에 대해 학습 하고, Spring Boot & MariaDB, & JPA 를 활용해 REST API 를 개발 합니다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크","REST API"]}},{"excerpt":"스프링 부트 Custom Annotation(커스텀 어노테이션), GET 요청 ~ JSON 응답 Custom Annotation…","fields":{"slug":"/springboot/스프링-부트-custom-annotation/"},"frontmatter":{"date":"2021년 3월 16일","dateISO":"2021-03-16T20:29:29.537Z","title":"스프링 부트 Custom Annotation(커스텀 어노테이션), GET 요청 ~ JSON 응답","category":"springboot","description":"프로그램에 관한 데이터를 제공하거나 코드에 정보를 추가할 때 사용하는 것을 어노테이션이라고 한다. 대표적인 어노테이션으로는 @Controller, @SpringBootApplication등이 있다. 하지만 위 예시 어노테이션들은 이미 만들어진 어노테이션들이고, 직접 커스텀해서 어노테이션을 만들 수 있는데, 이것을 커스텀 어노테이션이라고 한다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크","Custom Annotation","REST API"]}},{"excerpt":"…","fields":{"slug":"/springboot/스프링-부트-소개/"},"frontmatter":{"date":"2021년 3월 16일","dateISO":"2021-03-16T20:29:29.537Z","title":"스프링 부트 소개","category":"springboot","description":"스프링부트는 최소한의 설정으로 스프링 플랫폼과 서드파티 라이브러리들을 사용 할 수 있도록 고안된 프레임워크 이다. 즉 스프링 부트는 환경 설정을 최소화하고 개발자가 비즈니스 로직에 집중할 수 있게하여 생산성을 크게 향상시켜준다.","tags":["스프링","스프링부트","Spring","SpringBoot","Java","프레임워크"]}},{"excerpt":"MySQL 상태확인, 시작, 중지 DataBase DataBase 조회 DataBase 생성 DataBase 사용설정 DataBase 삭제","fields":{"slug":"/etc/mac-mysql-명령어-정리/"},"frontmatter":{"date":"2021년 1월 22일","dateISO":"2021-01-22T15:15:22.980Z","title":"Mac MySQL 명령어 정리","category":"etc","description":"MySQL 상태확인, 시작, 중지 및 데이터베이스 조회, 생성, 삭제","tags":["MySQL","Mac"]}},{"excerpt":"…","fields":{"slug":"/blockchain/탈중앙-화폐와-블록체인/"},"frontmatter":{"date":"2021년 1월 7일","dateISO":"2021-01-07T07:51:01.932Z","title":"탈중앙 화폐와 블록체인","category":"blockchain","description":"블록체인은 정보를 공유하고 다수가 합의에 의한 방 식으로 운영하게 하는 시스템이다. 이에 블록체인은 공유형 원장과 함께 합의 알고리즘이 사용되는데, 합의 알고리즘은 데이 터를 공유하는 방식에서 합의에 이르기까지 기능을 담당한다. 그래서 합의 알고리즘은 블록체인 주요 3요소라고 볼 수 있는 “보안성”, “탈중앙성” 그리고 “확장성”에 영향을 많이 미친다.","tags":["블록체인발전방향","블록체인","Blockchain","비트코인","암호화폐"]}},{"excerpt":"파이어베이스(Firebase) Functions 클라우드 함수는 Node.js…","fields":{"slug":"/etc/파이어베이스-firebase-functions/"},"frontmatter":{"date":"2020년 12월 18일","dateISO":"2020-12-18T12:38:30.330Z","title":"파이어베이스(Firebase) Functions","category":"etc","description":"클라우드 함수는 Node.js 환경에서 실행되는 자바스크립트 함수이다. 이 함수는 특정한 이벤트가 발생할 때만 실행된다. 가령, 실시간 데이터베이스의 데이터 변경 인증을 통한 신규 사용자 가입, Analytics의 전환 이벤트에 대해 트리거되는 함수를 만들 수 있다.","tags":["파이어베이스","Firebase","Cloud Firestore","Realtime Database","Hosting","Functions","Authentication"]}},{"excerpt":"파이어베이스(Firebase) Hosting 파이어베이스 호스팅을 사용하면 단일 페이지 웹앱 또는 프로그레시브 웹앱을 간현하게 배포할 수 있다. 이는 배포된 각 사이트에 대하여 SSL…","fields":{"slug":"/etc/파이어베이스-firebase-hosting/"},"frontmatter":{"date":"2020년 12월 18일","dateISO":"2020-12-18T12:33:52.900Z","title":"파이어베이스(Firebase) Hosting","category":"etc","description":"파이어베이스 호스팅을 사용하면 단일 페이지 웹앱 또는 프로그레시브 웹앱을 간편하게 배포할 수 있다. 이는 배포된 각 사이트에 대하여 SSL 인증서를 자동으로 준비하여 구성한다. 도메인도 손쉽게 연결할 수 있다.","tags":["파이어베이스","Firebase","Cloud Firestore","Realtime Database","Hosting","Functions","Authentication"]}},{"excerpt":"파이어베이스(Firebase) Storage 클라우드 스토라지는 사진,동영상등의 파일을 빠르고 손쉽게 저장하고 이를 제공할 수 있다. 파이어베이스(Firebase) Storage 파일(Files…","fields":{"slug":"/etc/파이어베이스-firebase-storage/"},"frontmatter":{"date":"2020년 12월 18일","dateISO":"2020-12-18T10:55:50.026Z","title":"파이어베이스(Firebase) Storage","category":"etc","description":"클라우드 스토라지는 사진,동영상등의 파일을 빠르고 손쉽게 저장하고 이를 제공할 수 있다.","tags":["파이어베이스","Firebase","Cloud Firestore","Realtime Database","Hosting","Functions","Authentication"]}},{"excerpt":"파이어베이스(Firebase) Realtime Database 실시간으로 데이터를 저장하고 동기화할 수 있는 클라우드 호스팅 NoSQL…","fields":{"slug":"/etc/파이어베이스-firebase-realtime-database/"},"frontmatter":{"date":"2020년 12월 18일","dateISO":"2020-12-18T10:15:13.147Z","title":"파이어베이스(Firebase) Realtime Database","category":"etc","description":"실시간으로 데이터를 저장하고 동기화할 수 있는 클라우드 호스팅 NoSQL 데이터베이스이다. 파이어페이스 클라우드 함수를 사용하여 데이터베이스가 트리거하는 이벤트에 응답하는 백엔드 코드를 만들 수도 있다. 선언적인 규칙을 설정한 보안 모델을 사용하여 사용자 ID 또는 데이터 패턴 일치를 기준으로 액세스를 허용할 수 있다.","tags":["파이어베이스","Firebase","Cloud Firestore","Realtime Database","Hosting","Functions","Authentication"]}},{"excerpt":"파이어베이스(Firebase) Authentication 파이어베이스 인증의 목표는 인증 시스템을 손쉽게 구축하도록 지원한다. 이메일/비밀번호 계정, 전화 인증, Google, Twitter, Facebook, Github…","fields":{"slug":"/etc/파이어베이스-firebase-authentication/"},"frontmatter":{"date":"2020년 12월 18일","dateISO":"2020-12-18T09:59:14.435Z","title":"파이어베이스(Firebase) Authentication","category":"etc","description":"파이어베이스 인증의 목표는 인증 시스템을 손쉽게 구축하도록 지원한다. 이메일/비밀번호 계정, 전화 인증, Google, Twitter, Facebook, Github 로그인 등을 지원하는 종합적인 ID 솔루션을 제공한다.","tags":["파이어베이스","Firebase","Cloud Firestore","Realtime Database","Hosting","Functions","Authentication"]}},{"excerpt":"파이어베이스(Firebase) 소개 파이어베이스 소개 파이어베이스(https://firebase.google.com)는 웹 모바일 개발에 필요한 통합 앱 플랫폼을 제공하는 BaaS(Backend as a Service…","fields":{"slug":"/etc/파이어베이스-firebase-소개/"},"frontmatter":{"date":"2020년 12월 13일","dateISO":"2020-12-13T19:44:35.960Z","title":"파이어베이스(Firebase) 소개","category":"etc","description":"파이어베이스(https://firebase.google.com)는 웹 모바일 개발에 필요한 통합 앱 플랫폼을 제공하는 BaaS(Backend as a Service) 이다. 초기에는 백엔드 데이터베이스를 구축할 필요 없이 API 형태로 데이터를 저장하고 자겨올 수 있는 기능에 국한되어 있었으나, 현재는 인증 및 실시간 데이터베이스, 클라우드 저장소, 호스팅, 애널리틱스 등 다양한 기능들이 통합되었다.","tags":["파이어베이스","Firebase","Cloud Firestore","Realtime Database","Hosting","Functions","Authentication"]}},{"excerpt":"ES6 Map & Set Map과 Set은 Java와 같은 다른 프로그래밍 언어에서도 자주 사용하는 데이터 구조이다. Map은 키와 값으로 이루어진 데이터 구조이고, Set…","fields":{"slug":"/javascript/es6-map-set/"},"frontmatter":{"date":"2020년 12월 13일","dateISO":"2020-12-13T19:29:19.802Z","title":"ES6 Map & Set","category":"javascript","description":"Map과 Set은 Java와 같은 다른 프로그래밍 언어에서도 자주 사용하는 데이터 구조이다. Map은 키와 값으로 이루어진 데이터 구조이고, Set은 중복 없는 키-값으로 이루어진다. 기존 자바스크립트에서는 배열과 객체로 해당 기능을 구현할 수 있었지만, 입력값의 목록이나 특정값 찾기를 수행하기 위해서는 별도의 과정이 필요하다.","tags":["ES6","Map & Set","JavaScript","ECMAScript6"]}},{"excerpt":"ES6 객체 표현식 ES6에서는 더욱 동적이고 간단하게 객체를 생성하고 할당하는 표현식을 제공한다. 만약, 객체의 속성을 변수명과 같은 속성명으로 설정하려면 이를 간단하게 표현할 수 있다. 예를 들어, 아래 코드1과 같은 객체가 있다면, 코드…","fields":{"slug":"/javascript/es6-객체-표현식/"},"frontmatter":{"date":"2020년 12월 13일","dateISO":"2020-12-13T19:15:26.956Z","title":"ES6 객체 표현식","category":"javascript","description":"ES6에서는 더욱 동적이고 간단하게 객체를 생성하고 할당하는 표현식을 제공한다. 만약, 객체의 속성을 변수명과 같은 속성명으로 설정하려면 이를 간단하게 표현할 수 있다.","tags":["ES6","객체 표현식","JavaScript","ECMAScript6"]}},{"excerpt":"ES6 임포트(import)와 익스포트(export) 모듈 모듈 프로그래밍은 각 프로그램 파일을 모듈 단위로 분리하여, 이를 구조화할 수 있는 장점이 있다. ES…","fields":{"slug":"/javascript/es6-임포트-import-와-익스포트-export-모듈/"},"frontmatter":{"date":"2020년 12월 10일","dateISO":"2020-12-10T18:16:37.710Z","title":"ES6 임포트(import)와 익스포트(export) 모듈","category":"javascript","description":"모듈 프로그래밍은 각 프로그램 파일을 모듈 단위로 분리하여, 이를 구조화할 수 있는 장점이 있다. ES5 이전의 자바스크립트는 모듈을 지원하지 않았기에 다양한 방식을 사용해 이를 구현해왔다. ES6부터 import, export 구문을 활용하면, 한 모듈이 특정 변수를 익스포트(export)하고 다른 모듈이 이를 임포트(import)하여 계층 관계를 만들 수 있다.","tags":["ES6","임포트(import)","익스포트(export)","JavaScript","ECMAScript6"]}},{"excerpt":"ES6 프라미스(Promise) 프라미스(Promise)는 비동기 호출이 일어났을 때 또는 해당 테스크가 완료했을 때, 이를 처리할 함수나 에러를 처리할 함수를 설정하는 모듈이다. 특히, 비동기 처리가 많이 일어나는 XMLHttpRequest…","fields":{"slug":"/javascript/es6-프라미스-promise/"},"frontmatter":{"date":"2020년 12월 7일","dateISO":"2020-12-07T16:46:26.518Z","title":"ES6 프라미스(Promise)","category":"javascript","description":"프라미스(Promise)는 비동기 호출이 일어났을 때 또는 해당 테스크가 완료했을 때, 이를 처리할 함수나 에러를 처리할 함수를 설정하는 모듈이다. 특히, 비동기 처리가 많이 일어나는 XMLHttpRequest 처리에 주로 사용되며, 반환값이 연계적으로 처리가 가능하기에 순차적인 호출을 보장한다.","tags":["프라미스(Promise)","ES6","ECMA2015","JS"]}},{"excerpt":"ES6 For ... Of 루프 기존 자바스크립트에서는 for, for..in 루프만 사용할 수 있었는데, for..of는 iterator 형태로 순환할 수 있는 기능을 제공한다. iterator…","fields":{"slug":"/javascript/es6-for-of-루프/"},"frontmatter":{"date":"2020년 11월 24일","dateISO":"2020-11-24T19:22:59.726Z","title":"ES6 For ... Of 루프","category":"javascript","description":"기존 자바스크립트에서는 for, for..in 루프만 사용할 수 있었는데, for..of는 iterator 형태로 순환할 수 있는 기능을 제공한다. iterator는 어떤 데이터 집합을 순서대로 접근할 때 사용된다. for..of 는 Symbol.iterator를 호출 하는데 배열과 문자열은 이 속성을 제공하고 있다. 즉, 배열을 순서대로 순회하며, 문자열은 문자를 하나씩 접근하게 된다. 또한, 사용자 정의 iterator을 커스텀 객체에 만들 수도 있다.","tags":["For ... Of 루프","ES6","ECMA2015","JS"]}},{"excerpt":"ES6 Spread & Rest 연산자 ES6부터 가변 인자를 표현할  키워드가 추가 되었다. 기존에는 배열 값을 함수 임자로 넘기려면  내장 메서드나  를 통해 변수를 받아서, 이를 Array.prorotype.slice…","fields":{"slug":"/javascript/es6-spread-rest-연산자/"},"frontmatter":{"date":"2020년 11월 19일","dateISO":"2020-11-19T18:15:44.771Z","title":"ES6 Spread & Rest 연산자","category":"javascript","description":"ES6부터 가변 인자를 표현할 '...' 키워드가 추가 되었다. 기존에는 배열 값을 함수 임자로 넘기려면 apply() 내장 메서드나 argments 를 통해 변수를 받아서, 이를 Array.prorotype.slice() 함수로 잘라내야 했지만 '...' 키워드를 이용하면 여러 개의 인자를 넘길 수 있다. 이는 Spread 연산자라고 한다.","tags":["ES6","Spread","Rest","JavaScript","ECMAScript6"]}},{"excerpt":"ES6 디스트럭처링(Destructuring) 디스트럭처링(Destructuring)은 Object 객체를 개별 변수에 할당하는 것을 말한다. 이를 이용하면, JSON…","fields":{"slug":"/javascript/es6-디스트럭처링-destructuring/"},"frontmatter":{"date":"2020년 11월 18일","dateISO":"2020-11-18T18:51:30.185Z","title":"ES6 디스트럭처링(Destructuring)","category":"javascript","description":"디스트럭처링(Destructuring)은 Object 객체를 개별 변수에 할당하는 것을 말한다. 이를 이용하면, JSON 형태의 객체를 쉽게 매핑하여 변수에 할당할 수 있고, 반환값도 여러 개를 설정할 수 있다.","tags":["ES6","디스트럭처링","Destructuring","JavaScript","ECMAScript6"]}},{"excerpt":"ES6 템플릿 문자열 (template string) 템플릿 문자열(Template String…","fields":{"slug":"/javascript/es6-템플릿-문자열-template-string/"},"frontmatter":{"date":"2020년 11월 17일","dateISO":"2020-11-17T18:07:36.947Z","title":"ES6 템플릿 문자열 (template string)","category":"javascript","description":"템플릿 문자열(Template String)은 문자열을 생성하는 새롭게 도입된 리터럴이다. 문자열을 설정하기 위해 따옴표(`)를 이용한다. 기존에는 변수를 문자열 안에 삽입하기 위해 따옴표 사이에 그 변수를 넣어 합치는 작업이 필요했는데, 템플릿문자열을 이용하면 이를 간단하게 만들 수 있다.","tags":["ES6","ECMAScript","템플릿 문자열","JavaScript"]}},{"excerpt":"ES6 클래스 (Class) 기존에는 객체지향을 구현하려고 할 때 function을 사용하여 구현 했다. ES6에서는 class 키워드를 사용하여 객체지향을 구현 할수 있다. 기존에는 아래와 같이 객체지향을 구현 했다. new…","fields":{"slug":"/javascript/es6-클래스-class/"},"frontmatter":{"date":"2020년 11월 5일","dateISO":"2020-11-05T14:56:31.083Z","title":"ES6 클래스 (Class)","category":"javascript","description":"기존에는 객체지향을 구현하려고 할 때 function을 사용하여 구현 했다. ES6에서는 class 키워드를 사용하여 객체지향을 구현 할수 있다. ES6 클래스는 생성자와 상속을 더욱 간단하고 명확한 구문으로 다룰 수 있게 한다. 클래스 자신도 함수이며, 생성자를 가지고 함수를 생성하는 새로운 구문이다.","tags":["ES6","Class","객체지향","Function","JavaScript"]}},{"excerpt":"ES6 화살표 함수 (arrow function expression) ES6에서는 익명함수를 표현하기 위해 화살표 함수(Arrow function) 표현식을 지원한다.\n기존에는 아래와 같이 함수를 선언 하였다. 위와 같은 함수를 ES…","fields":{"slug":"/javascript/es6-화살표-함수-arrow-function/"},"frontmatter":{"date":"2020년 10월 21일","dateISO":"2020-10-21T13:00:33.383Z","title":"ES6 화살표 함수 (arrow function expression)","category":"javascript","description":"ES6에서는 익명함수를 표현하기 위해 화살표 함수 (Arrow function) 표현식을 지원한다.","tags":["화살표 함수","Arrow function","ES6","ECMA2015","익명함수","JS"]}},{"excerpt":"OSX Wondows Linux","fields":{"slug":"/etc/chrome-cross-origin/"},"frontmatter":{"date":"2020년 10월 18일","dateISO":"2020-10-18T07:11:12.292Z","title":"Chrome cross origin","category":"etc","description":"OSX, Windows Chrome cross origin","tags":["OSX","Windows","Chrome"]}},{"excerpt":"RTOS의 특징 Multi Process, Multi Thread, Preemptible 기능 스레드 우선순위 (대부분의 실시간 운영체제는 256단계 지원) 예측 가능한 스레드 동기화 우선순위에 근거한 선점형(preemptive…","fields":{"slug":"/rtos/free-rtos/"},"frontmatter":{"date":"2020년 10월 13일","dateISO":"2020-10-13T07:11:12.292Z","title":"RTPS 와 RebbleOS(Pebble)","category":"rtos","description":"RTOS(←Real Time Operating System)는 실시간 응용 프로그램을 위해 개발된 운영 체제이다. Pebble OS 는 RTOS 에 기반하여 개발되었다.","tags":["RTOS","Pebble","eCos","FreeRTOS"]}},{"excerpt":"현재 다양한 웹 프론트엔드(Front-End) 프레임워크가 있다. 그중 인기 있는 프레임워크는 React, AngularJS, Vue.js 등이 있다.\n폴리머(https://www.polymer-project.org…","fields":{"slug":"/javascript/polymer/"},"frontmatter":{"date":"2020년 10월 11일","dateISO":"2020-10-11T09:11:34.709Z","title":"Polymer","category":"javascript","description":"폴리머는 웹 컴포넌트 기반 애플리케이션을 쉽고 빠르게 만들어주는 라이브러리이다. 폴리머 3.0은 ES6을 이용하여 개발이 가능하며, 프로그레시브 웹앱을 적극 지원한다.","tags":["polymer","javascript","framework","frontend","web"]}},{"excerpt":"ES6 let & cont 기존에는 var 키워드로 변수와 상수를 모두 정의 하였지만 ES6에서는 변수와 상수를 구분할수 있는 let 과 const 가 추가 되었다. let let…","fields":{"slug":"/javascript/es6-let-cont/"},"frontmatter":{"date":"2020년 10월 11일","dateISO":"2020-10-11T07:11:12.292Z","title":"ES6 let & cont","category":"javascript","description":"let, const 는 ES6 에 추가 되었다. let,const는 변수(let)와 상수(const)를 구분 하여 정의할때 사용 된다.","tags":["JavaScript","ES6","ECAMScript 2015","Let","Const","Var"]}},{"excerpt":"2009년에 발표된 ES(ECMAScript 5)는 웹 어플리케이션 부터 소셜게임 까지 다양한 곳에서 활용이 되었다. 그 이후, 기존에 자바스크립트의 여러 문제점을 해결하고 개선한 ES6(ECMAScript 2015)이 201…","fields":{"slug":"/javascript/es6-vs-es5/"},"frontmatter":{"date":"2020년 10월 9일","dateISO":"2020-10-09T09:06:14.444Z","title":"ES6 vs ES5","category":"javascript","description":"기존 자바스크립트의 여러 문제점을 해결하고 개선한 ES6 (ECMA6) 에 대해 알아 본다","tags":["ES6","ECMAScript 2016","Javascript","ES5","ECMAScript 5"]}}]}},"pageContext":{}},"staticQueryHashes":["213619243","3262363727"]}