JavaScript 프론트엔드와 Java 백엔드를 사용하여 소셜 미디어 애플리케이션을 구축하면서 GitHub Copilot 바이브 코딩을 사용해봅시다!
Take Home Message:
어? 깃헙 코파일럿 있으니까 할만하네?🤔
Contoso는 다양한 아웃도어 활동용 제품을 판매하는 회사입니다. Contoso의 마케팅 부서에서는 기존 및 잠재 고객에게 자사 제품을 홍보하기 위한 마이크로 소셜 미디어 웹사이트를 출시하고자 합니다. 첫 번째 MVP로, 그들은 현대적인 웹 기술을 사용하여 빠르게 웹사이트를 구축하고자 합니다. 애플리케이션은 JavaScript로 구축된 React 프론트엔드와 Java로 구축된 Spring Boot 백엔드로 구성됩니다.
하지만 여기서 문제가 발생했습니다...
- GitHub Copilot Agent 모드를 사용하여 기존 애플리케이션을 컨테이너화합니다.
- GitHub Copilot에 사용자 지침을 추가하여 GitHub Copilot을 원하는대로 제어합니다.
- GitHub Copilot에 다양한 MCP 서버를 추가하여 자유롭게 활용해봅니다.
- Visual Studio Code
- VS Code GitHub Copilot 확장 프로그램
- VS Code GitHub Copilot Chat 확장 프로그램
- git CLI
- GitHub CLI
- Docker Desktop
- nvm 또는 nvm for Windows
- nvm을 통한 Node.js의 최신 LTS 버전
- npm (Node.js와 함께 제공됨)
- SDKMAN (권장) 또는 수동 설치
- SDKMAN을 통한 OpenJDK 17+
- SDKMAN을 통한 Gradle Build Tool (또는 포함된 래퍼 사용)
- VS Code Extension Pack for Java 확장 프로그램
- VS Code Spring Boot Extension Pack 확장 프로그램
다른 무엇보다도 이 PRD (Product Requirements Document) 문서를 가장 먼저 보아야합니다. 이 문서는 무엇을, 어떻게 해야 하는지 요구사항명세가 구체적으로 작성되어 있습니다. 다만, 이번 데모에서는 이러한 PRD를 기반으로 이미 앱을 구축하였다고 가정합니다.
이 워크숍은 GitHub Copilot으로 구축된 완전한 소셜 미디어 애플리케이션을 시연합니다:
| 단계 | 링크 |
|---|---|
| 00: 개발 환경 설정 | 00-setup.md |
| 05: 컨테이너화 | 05-containerization.md |
| 06: Horizontal scaling | 06-horizontal-scaling |
| 06: Cloud Deployment | 07-azure-deploy |
| 06: What's next | 08-what's-next |
