# 02. Project 4 Project

**회사에서 개발 중인 솔루션을 전면 개편해보고 싶어졌다.**

**무슨 솔루션인지는 밝힐 수 없고... 개편하는 이유는 초창기 기획의 아쉬움 때문이였다.**

**그래서 최대한 필요한 기능 및 구성요소를 최대한 세밀하게 기획하고 싶어졌고, 거기서 출발한 생각으로 프로젝트를 위한 프로젝트를 만들기로 했다.**

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/NP2icHNmqMBusOV3-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/NP2icHNmqMBusOV3-image.png)

**시연을 위해 임의의 프로젝트 생성, 처음엔 빈 템플릿을 가져오므로 오른쪽 위의 스마트 캔버스를 통해 ai를 통해 기본 구조를 생성한다.**

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/HlIs4FurBs2LuAO6-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/HlIs4FurBs2LuAO6-image.png)

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/eYcrPIQaPQ7qFMCL-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/eYcrPIQaPQ7qFMCL-image.png)

**이런식으로 ai를 통해 쉽게 프로젝트의 설계 구조를 짤 수 있다.**

**물론 수동으로 직접 만드는것도 가능하다.**

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/gB6HmkISgiFlMsV7-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/gB6HmkISgiFlMsV7-image.png)

**ai를 통해 노드 정렬, 각 노드들의 태그를 지정 및 선택하여 관련 파이프라인만 확인하는 것 또한 가능하며,**  
**챗봇을 추가하여 여러 조언을 구하거나 해당 조언을 바로 노드 구조에 반영할 수도 있다.**

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/wcY3W0Krz5JFLUlQ-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/wcY3W0Krz5JFLUlQ-image.png)

**DB 노드들은 상세 페이지에 테이블 및 컬럼 설계도 가능하며, ai가 설계 및 간단한 설명을 남겨주는 것 또한 가능하다.**

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/nv3wwBbY8EWPyZ5G-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/nv3wwBbY8EWPyZ5G-image.png)

**아래는 ai 가 만들어준 테이블 및 컬럼 구조**

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/CSgMA745J2PPI9An-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/CSgMA745J2PPI9An-image.png)

**이런식으로 노드들을 확장하여 서비스를 설계하고 생성탭에 들어가면,**

**해당 노드구조로 견본을 만들어볼 수도, ai에게 제공할 설계도를 만들 수도 있다.**

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/mMuPGmcFfZ2xcf8y-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/mMuPGmcFfZ2xcf8y-image.png)

**대략적으로 사용되는 토큰을 알려주긴 하는데 정말 대략이다**

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/JDtm1j396cHkw7Oe-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/JDtm1j396cHkw7Oe-image.png)

**프로세스가 실행되면, ai에게 참고시킬 설계도들이 생성된다.**

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/llyzNrBiBZCGwxre-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/llyzNrBiBZCGwxre-image.png)

**블루프린트가 아닌 전체 코드 생성 시 위와 같이 미리보기 페이지가 생성되며, 즉각적으로 피드백이 가능하다.**

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/dTGb7lWknjVBpKm6-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/dTGb7lWknjVBpKm6-image.png)

[![image.png](https://www.ochidstudy.com/uploads/images/gallery/2026-03/scaled-1680-/SmDyLpTXjjslQWNw-image.png)](https://www.ochidstudy.com/uploads/images/gallery/2026-03/SmDyLpTXjjslQWNw-image.png)

**생각보다 더 잘해줘서 당황스럽네;**

**아무튼 해당 프로젝트는** [**https://github.com/ochid00/project4project**](https://github.com/ochid00/project4project) **에 오픈소스로 공개해 두었으니 누구나 사용해볼 수 있다.**

**\*ai 사용에 필요한 api 키는 개인 api키를 삽입하여야함!**