준비사항
- 보조 모니터
- 웹캠
- 배경 가리기
- 라이트모드
- 화면 확대
진행
Python: FastAPI
Getting Started
자기소개
안녕하세요. GitHub Copilot Bootcamp에 오신 여러분들 진심으로 환영합니다 << 수정예정 저는 Microsoft Certified Trainer인 윤금재입니다.
학습목표
여러분들 혹시 바이브 코딩이라는 말 들어보셨나요? 바이브 코딩은 AI에게 자연어로 프롬프트를 입력하여 코딩하는 것을 의미하는 신조어인데요. 이번 강의(강의, 강좌, 부트캠프… 수정 예정)에서는 GitHub Copilot과 함께 직접 바이브 코딩을 해보겠습니다.
레포지토리 안내
아래 링크로 접속하시면 microsoft의 공식 레포지토리로 연결됩니다. 이 레포지토리는 한국어를 비롯한 다양한 언어를 지원하구요. 한국어 링크를 눌러 한국어로 보겠습니다.
한국어로 된 리드미 페이지가 나오는데요. 배경을 보시면 Contoso라는 회사가 있고, 제품 홍보를 위한 SNS 웹사이트를 런칭하려 한다고 합니다. 이 웹 사이트를 GitHub Copilot과 바이브 코딩으로 만들어 보겠습니다.
GitHub Copilot의 다양한 기능들 중 에이전트 모드를 사용할 것이고요. 커스텀 지시사항을 추가하여 더 세밀하게, MCP 서버를 추가하여 더 정확하게 앱을 구축해보겠습니다.
PRD
손자병법에 나오는 말입니다. 지피지기 백전불태. 적을 알고 나를 알면 백번 싸워도 위태로울 것이 없다죠. 본격적으로 개발을 시작하기 전에, 저희가 만들고자 하는 것이 무엇인지 잘 알아야 합니다. 대충 SNS 라고만 말해서는 원하는 결과물을 얻을 수는 없습니다.
프롬프트가 자세할수록 원하는 결과물이 더 잘 나온다 라고 추가하기
댓글도 달 수 있어야 하는데 게시글 작성 기능만 있을 수도 있고, 댓글에 좋아요를 누를 필요는 없는데 구현되어 있을 수 있습니다. 사람들이 각자 SNS 하면 떠오르는 서비스와 기능들이 다른 만큼,
여기 링크(리드미의 제품요구사항문서 링크)를 클릭해볼게요. 이미 레포지토리에서 필요한 기능들을 상세히 잘 작성해놓았습니다. 저희가 만들 제품의 제목은 간단산 소셜 미디어 애플리케이션이고요, 게시글과 댓글의 CRUD(Create, Read, Update, Delete)와 게시글 좋아요 기능이 있습니다. API 우선 접근 방식을 사용해서 백엔드 서버로서 사용할 수 있어야 합니다.
그리고 각 기능들에 대해서는 엔드포인트와 파라미터까지 정의해줍니다.
게시글 생성을 예시로 보면,
/api/posts로 POST 요청을 보내야하는데 -
username과 content 필드가 필수적이고,
새 게시글 생성에 사용된다고 합니다.
PRD는 단순히 기능들을 나열한 것이 아닙니다. 어떤 기능이 들어가야하는지는 당연하고요. MVP 패턴을 사용해라, 단순성을 유지해라, RESTful하게 API를 설계해라 등의 요구사항 또한 존재합니다. 최대한 원하는 결과물에 대해 자세하게 적어주는 것이 포인트입니다. 어떤 앱을 만들지 자세하게 설명할 만큼, 개발자의 의도 대로 앱이 잘 만들어지겠죠.
00: 개발환경
코드스페이스
이제 본격적으로 개발을 시작해보겠습니다. 이전 페이지로 돌아와, 워크샵 지침의 00번 항목에 들어가봅시다. 저희는 깃헙 코드스페이스를 사용할 것이니 코드스페이스 기준으로 볼게요. 여기 링크가 있죠. 이 링크를 눌러 코드스페이스를 열어줍니다. 그냥 열어도 되는데요. 오른쪽을 클릭해서 새 탭에서 열기 할게요. 코드스페이스에서 마크다운 문서를 봐도 되기는 하는데, 괜히 에디터 안에서 여러 창 띄우면 헷갈릴 수 있으니까요. 다른거 건드리지 말고 초록 버튼을 눌러주기만 하면 코드스페이스가 만들어집니다.
코드스페이스는 레포지토리에서 설정을 마친 상태라, 로컬에서 vscode로 개발하는 것과 달리 이미 파이썬과 같은 것들이 준비되어있을 것입니다. 그래도 혹시 모르니 아래 명령어들을 통해 확인을 해봅시다. git 명령어를 통해 git 저장소가 제대로 설정되었는지도 확인합니다. 만약 문서와 다르게 표기가 된다면 코드스페이스를 삭제하고 다시 생성해봅니다.
MCP
이렇게 코드스페이스에 대한 설정은 모두 완료가 되었고, 링크를 눌러 MCP 서버를 설정해봅시다. 여기 명령어로 환경 변수를 설정하는데요. 저희는 코드스페이스를 사용하기 때문에 PowerShell은 무시하셔도 되고 bashShell의 명령어를 사용하겠습니다. 이 명령어는 깃 레포지토리의 최상위 디렉토리를 레포지토리 루트 라는 환경변수로 할당하는 명령어구요. 아래 명령어를 통해 MCP 서버의 설정을 복사하겠습니다. MCP 서버 설정 내용을 복사해왔기 때문에 그 내용이 코드스페이스에 적용이 될 것이구요. 명령 팔레트를 열어 MCP 서버들의 목록을 가져와 서버를 실행합니다. 저희가 사용할 MCP 서버는 context7입니다. context7은 최신 문서를 바탕으로 에이전트가 작업을 수행할 수 있게 해줍니다. AI 모델은 미리 학습되었기에 최신 API 사양을 지원하지 않을 수 있는데요. 이를 방지하기 위해 context7 서버를 사용합니다.
GitHub Copilot 에이전트 모드
코드스페이스를 열었고 MCP 서버를 설정했습니다. 이제 깃헙 코파일럿을 사용하기 위한 준비를 해보겠습니다. 화면 상단의 코파일럿 아이콘을 눌러 코파일럿 창을 열어줍니다. 코파일럿에는 세 가지 모드가 있는데요. Ask 모드는 코드에 대한 답변만을 제공하지, 실제로 코드를 수정하지는 않습니다. edit 모드는 특정 파일의 코드 변경을 요청하면 그 내용을 수정해주고요. Agent모드를 사용해야 코파일럿이 직접 파일을 선택하고, 코드를 작성하는 등의 자율적인 작업을 수행합니다. 저희는 바이브 코딩이 목적이니 Agent 모드로 바꿔줍니다.
Custom Instructions
리포지토리에는 미리 작성된 커스텀 지시사항이 있습니다. 이 파일을 복사하고 현재 작업공간에서 적용합니다.
PRD 분석, API 설계
이제 API 문서를 작성해볼텐데요. 코파일럿에서 에이전트 모드를, AI 모델은 클로드 4 또는 지피티 4.1 모델을 사용하는지 확인하구요. 요구사항이 정의된 product-requirements.md 파일을 코파일럿에 추가합니다. 마지막으로 다음 프롬프트를 입력하면 됩니다. (입력 후 실행) PRD를 바탕으로 작업을 하라 했으니, PRD에서 정의해놓은 API 명세를 openapi.yaml 형식으로 작성을 할 것입니다. 저장소의 루트에 파일을 저장하라 했으니 작업이 완료되면 파일이 생성될 것이구요. (대충작업기다림) openapi.yaml이 생성된 것을 확인했으니 keep (또는 유지) 버튼을 눌러 변경 내용을 적용합니다.
마무리
코드스페이스를 설정하고, MCP 서버를 실행한 뒤, 깃헙 코파일럿의 에이전트 모드를 통해 PRD를 바탕으로 openAPI.yaml 파일을 생성할 수 있었습니다. 개발을 위한 준비가 모두 완료되었으며, 다음으로 넘어가보겠습니다.
01: Python 백엔드 개발
파이썬으로 백엔드 애플리케이션을 개발하기 위한 준비사항은 이전에서 모두 마쳤고요. 파이썬 백엔드 개발을 위한 커스텀 지시사항을 준비하겠습니다. 미리 준비된 파일을 명령어를 통해 복사 후 현재 작업환경에 적용해줍니다.
가상환경
파이썬으로 개발해본 적 있는 분이라면 아시겠지만, 파이썬은 쉬운 버전 관리를 위해 가상환경을 설정하고 개발하곤 합니다. 저희 프로젝트에서도 가상환경을 먼저 설정해줄건데요. 이 프롬프트를 이용해 가상환경부터 설정하겠습니다. (복붙 후 실행) 이 프롬프트에서는 MCP 서버 사용 여부, 작업 디렉토리, 프레임워크 등을 정의하고 있습니다. 이 작업이 완료되면 요구사항을 바탕으로 프레임워크와 라이브러리들을 설치하고 가상환경을 세팅할 것입니다.
앱 개발
이제 앱을 개발해보겠습니다. product-requirements.md와 openapi.yaml을 추가해주고 이 명령어를 입력할게요. (입력) 코파일럿에 추가했으니 당연히 prd와 openapi 문서를 참고할 것이구요. context7으로 최신 문법을 사용하고, python 디렉토리 내부에서 작업을 수행할 것입니다. 포트 번호와 CORS 설정까지 상세히 설명을 해 준 후, 실행해볼게요.
여기서부터는 파이팅..
Java: SpringBoot
저희 애플리케이션은 Python으로 개발되었죠. 그런데 파이썬 개발자가 퇴사를 하는 바람에 어찌저찌해서 스프링부트로 마이그레이션해야 하는 상황이 되었습니다. 이미 있는 애플리케이션을 다른 프레임워크로 마이그레이션 하면 됩니다. 이 경우에서도 코파일럿을 사용할 수 있겠죠.
다른 개발 프로젝트 처럼 미리 세팅을 해두고, 자바 스프링부트 개발을 위해 스프링부트 CLI를 설치하겠습니다. (명령어 입력 후 설치) 이제 스프링부트 프로젝트를 스캐폴드 한다고 하는데요. 스캐폴드는 프로젝트의 구조를 만드는 것이라 생각하시면 됩니다. 스프링부트 앱을 개발할 때 초기에 설정해야하는 것들이 꽤 있죠. 그레이들을 쓰느냐, 메이븐을 쓰느냐 등등… 프롬프트를 보시면 이런 설정들이 정의되어 있습니다. 스프링부트 프로젝트의 초기 설정을 이 프롬프트로 명령을 내리면, 코파일럿이 프로젝트를 바로 시작할 수 있게 세팅해주겠죠. (복붙실행) 세팅이 완료되면 keep (또는 유지) 버튼을 눌러 진행상황을 반영해줍니다.
FastAPI 마이그레이션
프로젝트가 세팅되었으니 본격적으로 시작해볼건데요. product-requirement.md와 openapi.yaml 파일을 코파일럿에 추가해주고요. 이 프롬프트를 입력해서 마이그레이션 작업을 해보겠습니다. (실행) 제일 먼저 마이그레이션을 위한 단계를, 그러니까 구체적인 계획을 세울 것이고요. FastAPI 앱을 분석하고, 계획에 따라 마이그레이션을 진행할 것입니다. 엔드포인트도 동일하게 설정되었고요. (명령어 입력 후 실행) 일단 완료가 되었는데요. 제대로 되었는지 확인해보겠습니다. 이 프롬프트를 입력해서 결과를 볼게요. 앱을 빌드하고, 빌드한 원인을 분석하고, 수정합니다. 이 과정은 앱이 정상적으로 만들어질 때 까지 반복합니다. (실행) 빌드가 되어도 원하는대로 작동하지 않을 수 있으니 실행되는지도 확인해보겠습니다.
파이팅