OpenSpec Changes Everything - No More Vibe Coding (Full Tutorial)

OpenSpec Changes Everything - No More Vibe Coding (Full Tutorial)

간략한 요약

이 비디오에서는 OpenSpec이라는 새로운 라이브러리를 소개하고, 이를 통해 스펙 주도 개발을 수행하는 방법을 설명합니다. OpenSpec은 인간과 AI 코딩 도우미가 코드를 작성하기 전에 빌드할 내용을 계획하고 합의하도록 돕는 도구입니다. 주요 내용은 다음과 같습니다.

  • OpenSpec은 스펙 주도 개발을 위한 경량화된 도구입니다.
  • OpenSpec은 프로젝트의 현재 상태와 제안된 업데이트를 관리하기 위해 두 개의 폴더 모델을 사용합니다.
  • OpenSpec은 다양한 AI 도구와 호환됩니다.
  • OpenSpec을 설치하고 프로젝트에 통합하는 방법을 보여줍니다.
  • OpenSpec을 사용하여 새로운 기능을 제안하고 구현하는 방법을 설명합니다.

소개

OpenSpec은 스펙 주도 개발을 통해 애플리케이션을 개발하고 유지 관리하는 데 도움이 되는 새로운 툴킷입니다. OpenSpec은 인간과 AI 코딩 도우미가 코드를 작성하기 전에 빌드할 내용을 계획하고 합의하도록 돕습니다. API 키가 필요 없으며 구현 전에 의도를 고정합니다. OpenSpec은 제안, 작업 및 스펙 업데이트와 일관성을 유지하여 범위 변경을 검토하고 투명하게 만듭니다. OpenSpec은 Specit보다 명령이 적고 설정이 최소화된 경량 버전입니다. OpenSpec은 현재 상태를 위한 specs 폴더와 제안된 업데이트를 위한 changes 폴더의 두 폴더 모델을 사용합니다. 이 모델은 기존 기능을 수정하거나 여러 스펙을 변경할 때 더 효과적입니다. Specit은 처음부터 시작하는 새로운 프로젝트에 가장 적합합니다. OpenSpec은 스펙 주도 개발을 사용하여 애플리케이션을 구축하고 유지 관리할 때 더 많은 제어, 명확성 및 안정성을 제공합니다. 또한 Cloud Code, Cursor, Open Code, Kilo Code 등과 같은 많은 인기 있는 AI 도구에서 지원됩니다.

OpenSpec 설치 및 초기화

OpenSpec을 설치하려면 먼저 Node.js가 컴퓨터에 설치되어 있어야 합니다. Node.js가 없으면 nodejs.org에서 무료로 설치할 수 있습니다. Node.js를 설치한 후 터미널을 열고 npm install -g openspec 명령을 실행하여 OpenSpec을 설치합니다. 설치가 완료되면 openspec --version 명령을 실행하여 설치를 확인할 수 있습니다. OpenSpec을 프로젝트 디렉터리에서 초기화하려면 VS Code에서 터미널을 열고 openspec init 명령을 실행합니다. OpenSpec을 구성하라는 메시지가 표시되면 Enter 키를 누르고 사용하려는 AI 도구를 선택합니다. OpenSpec 워크플로 및 템플릿이 프로젝트 디렉터리에 추가됩니다. 프로젝트 탐색기에서 .kilode/workflows 폴더와 openspec 폴더를 확인할 수 있습니다. openspec 폴더에는 agents.mmd 파일, changes 디렉터리 및 specs 디렉터리가 있습니다.

OpenSpec 워크플로 및 기능 구현

OpenSpec은 터미널에 다음 단계를 제시합니다. 먼저 프로젝트 마크다운 파일에 프로젝트 요약, 텍스트 태그 및 규칙과 같은 프로젝트 세부 정보를 입력합니다. AI 도우미를 사용하여 이 작업을 수행할 수 있습니다. AI 도우미에 프롬프트를 입력하여 프로젝트에 대한 요약을 생성하고 사용된 텍스트 스택, 실행 방법 등과 같은 기술 세부 정보를 추가합니다. 다음으로 추가하려는 새로운 기능에 대한 프롬프트를 AI에 요청하고 OpenSpec 변경 제안을 생성하라는 지시를 추가합니다. AI 에이전트는 변경에 대한 이유, 프로젝트에서 변경될 내용, 단계별로 실행할 수 있는 작업 목록 및 변경 사항이 충족해야 하는 시나리오를 설명하는 스펙 문서를 생성합니다. OpenSpec 워크플로를 설명하도록 AI에 요청할 수도 있습니다. 변경 사항에 대한 제안을 생성하고 에이전트에게 스펙을 진행하거나 구현하도록 지시하여 구현할 수 있습니다. 변경이 완료되면 변경 사항을 보관하여 OpenSpec이 과거 변경 사항과 현재 변경 사항을 구별할 수 있습니다. 새로운 기능을 구현하려면 AI에 구현하도록 요청합니다. 에이전트는 앱을 변경하고 스타일링 작업을 수행합니다. 모든 작업이 완료되면 작업이 완료되었다는 메시지가 표시되고 앱을 탐색할 수 있습니다.

OpenSpec을 사용한 칸반 보드 앱 데모

이 비디오에서는 OpenSpec을 사용하여 칸반 보드 앱을 빌드하는 방법을 보여줍니다. 앱은 열과 카드를 생성, 편집, 삭제 및 이동할 수 있습니다. 앱의 스타일링은 완벽하지 않지만 기능은 제대로 작동합니다. 제안된 변경 사항이 구현되었으므로 스펙을 보관할 수 있습니다. openspec archive <spec name> --yes 명령을 실행하여 스펙을 보관하고 활성 변경 사항에서 제거합니다. 칸반 보드의 CSS 스타일링을 조정하고 반응형으로 만드는 새로운 제안을 보낼 수 있습니다.

OpenSpec 요약 및 결론

OpenSpec은 프롬프트를 구조화된 검토 가능한 제안 및 구현 계획으로 전환하여 AI 에이전트를 안내할 수 있는 훌륭한 도구입니다. openspec view 명령을 실행하여 모든 활성 제안을 볼 수 있습니다. 이 명령은 사양 요약, 활성 변경 사항, 완료된 변경 사항 및 작업 진행률을 보여줍니다. OpenSpec은 Specit보다 가볍습니다. OpenSpec은 하나의 명령 또는 프롬프트로 새로운 기능에 대한 제안, 작업 및 스펙을 생성할 수 있습니다. OpenSpec은 Specit보다 자세한 내용을 채우려고 하지 않고 검토하고 수정할 수 있는 충분한 컨텍스트를 생성합니다. OpenSpec은 무료 오픈 소스이며 GitHub 리포지토리에서 사용할 수 있습니다.

Share

Summarize Anything ! Download Summ App

Download on the Apple Store
Get it on Google Play
© 2024 Summ