AI 코딩 혁신 깃허브 스파크

Share

깃허브 스파크(Spark): AI 코딩 플랫폼, 바이브 코딩의 정점을 찍다

깃허브가 새로운 AI 기반 코딩 플랫폼인 깃허브 스파크(Spark)를 공개했습니다. 꽤 오랫동안 소규모 비공개 베타 단계에 머물러 있던 스파크는 이제 깃허브 코파일럿+ 구독자라면 누구나 사용할 수 있게 되었으며, 앞으로 공개 범위가 더욱 넓어질 것으로 예상됩니다. 깃허브 스파크는 개발자가 아이디어를 코드로 빠르게 전환할 수 있도록 지원하는 바이브 코딩의 정점이라고 할 수 있습니다.

깃허브 스파크, 무엇이 다를까?

기존의 깃허브 코파일럿은 스마트한 인텔리센스(IntelliSense)처럼 개발자가 입력한 코드를 기반으로 아이디어를 제안하는 역할을 했습니다. 하지만 깃허브 스파크는 비주얼 스튜디오 코드의 코파일럿 에이전트에 내장된 툴에 더 가깝습니다. 프롬프트를 사용해 질문에 대한 답을 작성하고 개발자의 아이디어를 실제로 구현하는 코드를 생성합니다. 스파크의 코드 뷰에서 출력을 수정할 수도 있지만, 대부분 프롬프트를 변경하거나 다듬는 방식으로 원하는 애플리케이션을 구현하게 됩니다.

아이디어에서 시작하는 코딩

깃허브 스파크는 설계부터 시작하는 것이 아니라 아이디어부터 시작해서 스파크의 툴을 활용해 빠르게 아이디어를 코드로 전환할 수 있다는 점이 특징입니다. 생성되는 자바스크립트와 직접 상호작용할 필요도 없습니다. 필자는 깃허브의 넥스트(Next) 플랫폼에서 현재는 초대를 받아야 이용할 수 있는 프리뷰 서비스를 실험적으로 사용해 보았습니다. 이전까지는 바이브 코딩을 해본 적이 없고, 익숙하지 않은 API의 구문을 파악하기 위해 가끔 깃허브 코파일럿을 사용하는 정도였습니다.

던전 앤 드래곤 주사위 굴리기 앱 만들기

익히는 과정은 꽤 재미있었습니다. 먼저 "던전 앤 드래곤(Dungeons & Dragons) 게임의 주사위를 굴리는 애플리케이션. 여러 개의 주사위를 함께 굴릴 수 있음"이라는 프롬프트로 시작한 다음, 이후 주사위의 색을 바꾸고 주기적으로 사용하는 주사위 조합을 저장하고 주사위 굴림과 그 결과의 기록을 저장할 수 있는 앱으로 발전시켜 나갔습니다. 각 반복은 생성된 코드를 기반으로 하며, 새 프롬프트를 사용해 디자인과 기능을 개선합니다. 애플리케이션과 현재 코드의 미리보기를 볼 수 있었지만, 아쉽게도 코드를 리포지토리에 저장하는 옵션은 제공되지 않았습니다.

코드 저장과 공유

비주얼 스튜디오 코드 또는 비슷한 다른 편집기에 코드를 복사해서 붙여넣은 다음 로컬이나 깃허브에 저장하는 방법을 사용할 수 있는데, 이 경우 생성된 코드는 저장되지만 기반 스파크 플랫폼이 제공하는 라이브러리와 기능에 의존하므로 깃허브 외부로 완벽하게 이식할 수는 없습니다. 다섯 번의 프롬프트로 만족스러운 웹 애플리케이션을 만들어 다른 깃허브 스파크 사용자들과 공유할 수 있었습니다. 공유 옵션은 두 가지입니다. 기본값은 읽기 전용 액세스 권한이지만 다른 사용자들이 동일한 디자인 공간 내에서 협업할 수 있게 해주는 옵션도 있습니다.

깃허브 스파크 개발 환경

깃허브 스파크 개발 공간은 3개의 패널로 구성된 웹 애플리케이션입니다. 가운데 패널은 코드 영역이며, 오른쪽에는 실행 중인 앱과 코드 생성 애니메이션이 표시되고 왼쪽에는 다양한 툴이 위치합니다. 이런 툴은 여러 기능을 제공합니다. 먼저, 애플리케이션의 현재 버전이 마음에 들지 않을 경우 이전 프롬프트로 되돌아갈 수 있습니다. 또한 입력란을 사용해 현재 생성된 코드를 기반으로 새 프롬프트를 추가할 수 있습니다. 스크린샷을 선택할 수도 있고 기반 깃허브 코파일럿 서비스에서 사용 중인 현재 LLM을 변경할 수도 있습니다. 필자는 기본값인 앤트로픽의 클로드 소네트(Claude Sonnet) 3.5를 사용했습니다.

코드 개선 및 디자인 옵션

프롬프트와 관련된 개념을 기반으로 코드 개선을 제안하는 몇 가지 선택 옵션도 이 기능의 일부로 제공됩니다. 그 외에 현재 테마, 글꼴 또는 애플리케이션 아이콘에 사용되는 스타일을 비롯한 저수준 애플리케이션 디자인 옵션을 변경할 수 있는 컨트롤도 제공됩니다. 또한 디자인 툴을 사용해서 그래픽 요소의 테두리, 배율을 조정하거나 프로그레시브 웹 앱(PWA) 기반의 코드 설치를 위한 애플리케이션 아이콘도 선택할 수 있습니다.

데이터 저장소 및 사용자 설정

깃허브 스파크에는 빌드와 세션이 넘어가도 지속되는 애플리케이션 데이터를 위한 내장 키/값 저장소가 있습니다. 툴바에는 현재 키와 값 저장소에 사용되는 데이터 구조의 목록이 표시됩니다. 정의를 클릭하면 현재 저장된 데이터가 편집할 수 있는 형태로 표시되므로 여기서 원치 않는 내용을 제거할 수 있습니다. 코드가 LLM을 호출하는 경우 사용되는 프롬프트 목록도 확인할 수 있습니다. 마지막 옵션은 사용자별 설정 모음으로, 모든 애플리케이션에 사용할 수 있는 기본 프롬프트도 포함됩니다. 이 설정을 통해 애플리케이션을 맞춤 구성하고, AI가 생성한 코드에 자기만의 스타일을 추가할 수 있습니다.

기업용 깃허브 스파크

깃허브 코파일럿+ 라이선스(사용자당 월 39달러)가 있는 경우 기업에 더 잘 맞는 깃허브 스파크 버전을 사용할 수 있습니다. 이 버전은 자바스크립트 리액트 코드가 아닌 강력한 타입스크립트를 사용하며, 코드를 수정하고 테스트할 수 있는 코드스페이스(Codespace)와 통합됩니다. 팀 작업도 지원됩니다. 리포지토리를 통해 코드를 저장 및 공유할 수 있고 두 환경 간의 양방향 동기화도 가능합니다. 이미지 업로드, 코드 편집, CSS 수정 등 다양한 기능이 추가되었습니다.

깃허브 스파크의 한계와 활용 분야

깃허브 스파크도 다른 많은 프롬프트 기반 코딩 툴과 마찬가지로 제한이 있습니다. 구독에는 월 375개의 스파크 프롬프트와 반복이 포함되며, 이를 초과해 추가되는 프롬프트에는 건당 0.16달러의 요금이 붙습니다. 하지만 깃허브 스파크는 프로토타이핑 툴로서 매우 유용합니다. 아이디어를 실제 작동하는 예시로 빠르게 구현할 수 있기 때문입니다. 또한, UI 컨셉을 빠르게 생성하고 반복을 통해 공유 가능한 최종 애플리케이션을 만들 수 있다는 장점이 있습니다.

결론

깃허브 스파크는 AI 기반 코딩의 새로운 가능성을 보여주는 플랫폼입니다. 프로토타이핑, 퓨전 팀 협업 등 다양한 분야에서 활용될 수 있으며, 개발자의 생산성을 향상시키는 데 기여할 수 있을 것으로 기대됩니다. 다만, 코드의 구조와 스타일에 대한 이해, 비용 등의 한계점을 고려하여 적절히 활용하는 것이 중요합니다.

이것도 좋아하실 수 있습니다...