[IT Biz] 문과생의 Chat GPT와 Replit을 활용한 서비스 기획부터 배포까지

RPE-VIEW

- 오늘의 아티클은 '문과생이 Chat GPT와 Replit으로 서비스 기획부터 배포까지'라는 제목의 아티클입니다. 코딩에 관한 개발 지식이 전문적으로 있지 않더라도 서비스 기획 및 배포까지 할 수 있는 ai서비스를 소개하는 아티클인데요, 저자가 실제로 사용하며 어떻게 기획부터 배포까지 진행되는지 직접 소개합니다. 

 

아티클 소개

https://eopla.net/magazines/25327

문과생이 Chat GPT와 Replit으로 서비스 기획부터 배포까지

 

 

 

저자 정보

저자: 하이아웃풋클럽

- 1인 사업가, 브랜드 오너, 프리랜서 성장 도움

https://blog.highoutputclub.com/hoc-program/?utm_source=eo&utm_medium=article&utm_campaign=21th

하이아웃풋클럽 21기 프로그램 안내

 

핵심 내용 요약

AI 기반 코딩 도구: Cursor AI와 Replit

Cursor AI: 간단한 아이디어 실현에 적합

- 코딩 지식이 없어도 ai가 코드를 자동 생성해 주는 도구. 사용자가 무엇을 만들고 싶은지 자연어로 설명하기만 하면 ai가 코드를 작성하고 필요한 기능을 구현해 줍니다

-한계: 생성된 코드를 수정하거나 기능을 보완하려면 ai에 의존해야 합니다. 코드에서 예상치 못한 오류가 발생하면 해결하기 어려운 경우가 생깁니다.

- 추천 대상: 아이디어를 빠르게 테스트하거나 간단한 프로젝트를 시도해보고 싶은 사람

 

Replit: 기획에서 배포까지 모두 가능

- Replit은 브라우저 기반 통합 개발 환경(IDE)으로 초보자도 쉽게 사용할 수 있도록 설계도니 도구. ai Assistant 기능을 활용해 코드 작성, 디버깅, 수정, 기능 추가까지 가능하며 여러 사람이 동시에 작업도 가능합니다.

- 한계: 기본적인 코딩 문법을 알고 있어야 원활한 진행이 가능합니다.

- 추천 대상: 서비스를 실제로 완성하고 배포까지 경험하고 싶은 사람. 코드를 이해하며 성장하고 싶은 초보자

 

Chat GPT를 활용한 서비스 기획 및 배포

저자의 아이디어: 글쓰기 강제 웹사이트 제작

 

아이데이션: gpt4와 함께 진행

1) 기능 목록 정리

- 글쓰기 클럽 챌린지 참여자를 위한 강제 글쓰기 웹사이트

- 30초 이내에 글을 쓰지 않을 시 글이 모두 지워

- 글을 쓰고 [완료] 버튼을 눌러야 글이 더 이상 지워지지 않음

2) 사용자 경험 설계

- 깔끔하고 직관적인 UI 구성 방안 제안

- 사용자가 쉽게 목표를 설정하고 결과를 확인할 수 있는 흐름 설계

3) 기술 스택 추천

- HTML, CSS, JavaScript 를 기본으로 하되 Replit에서 제공하는 간단한 데이터 저장 방식을 활용해 파일로 데이터 관리

 

개발: Replit

- gpt에서 얻는 프롬프트를 활용하여 직접 개발. flask(파이썬 기반 웹 프레임워크)와 vanilla JavaScript를 활용하여 간단한 글쓰기 서비스 구현

- Replit은 단순히 코드를 작성해 주는 것 이상으로, 구현된 기능의 정상 작동 여부를 묻고, 새로운 기능을 제안하는 방식을 제공. 서비스 개발의 전반적인 흐름을 정리하고 다음 단계를 자연스럽게 연결해 주는 데 큰 도움

- 이후 Replit에서 UI/UX 개선

 

배포: depoly

- 1차 depoly를 실패함. 원인은 환경 변수 설정 누락으로 인해 flask app이 배포 중 필요한 정보를 찾지 못했음. Replit의 Secrets 도구를 활용해 환경 변수를 안전하게 설정하고, 배포를 다시 진행하면 문제가 해결됨.

- AI assistant로 문제를 해결하고, Replit애 depoly를 원한다고 하니 해당 상태까지 작업을 진행해 줌

 

결과: 30분 만에 2.25달러로 간단하고 실용적인 웹서비스를 만들 수 있었음