코드나라

요즘 AI를 활용한 개발이 점점 일상화되고 있습니다.저는 이번에 OpenAI의 GPT와 함께 Firestore DB와 FastAPI를 활용한 커뮤니티 웹사이트를 직접 만들어봤습니다.처음부터 끝까지 GPT에게 단계별로 요청하고,그에 맞춰 코드 작성과 수정, 디버깅을 거쳐 완성된 실전 프로젝트였습니다 💻이 글에서는 다음과 같은 기능들을 어떻게 구현했는지 정리해보려고 합니다:FastAPI로 웹 서버 구성Firestore와 연동하여 글/댓글 저장JavaScript 기반 클라이언트 페이지네이션글 작성, 수정, 삭제 및 비밀번호 검증댓글 작성 및 삭제 기능"아이피 앞 두 자리" 표현 등 커스텀 처리실제 운영 가능한 커뮤니티의 핵심 기능을 구현했으며,단순한 코드 복사 수준을 넘어 실제 동작하는 서비스 형태로 완성되..

요즘 ChatGPT로 개발 도움 받는 사람들이 많죠? 저도 실제로 웹서비스를 하나 만들면서 GPT의 도움을 적극 활용해봤습니다. 이번 글에서는 **GPT와 함께 랜덤채팅 웹앱을 처음부터 완성해나가는 과정**을 소개합니다. 단순한 설명이 아니라, **실제로 FastAPI + WebSocket을 이용해서 1:1 랜덤채팅 웹페이지를 구성하는 실전 과정**을 담고 있어요. 기획, 코드 작성, 디버깅, 기능 추가까지 전부 GPT에게 질문하고 응답받아 완성해가는 방식으로 진행했습니다. --- 💡 이런 분들께 도움이 될 수 있어요: - 백엔드로 FastAPI를 활용한 실시간 기능이 궁금하신 분 - 웹소켓 기반 채팅 구조가 어떻게 구성되는지 궁금한 분 - GPT로 실제 서비스를 어디까지 구현할 수 있는지 ..

✍️ 전시간에 ChatGPT를 활용해 Pygame 게임을 직접 만들고, 이를 웹으로 배포하였습니다.이번 시간에는 해당 게임을을 실행할 수 있는 웹 게임을 Flutter로 만든 앱에서도 할 수 있도록 Flutter WebView로 감싸 실제 APK 앱으로 빌드하고 해당 apk파일을 핸드폰에 설치해 실행해 보겠습니다. flutter 앱 개발 및 빌드에 앞서, 게임의 그래픽 요소를 실제 게임처럼 업그레이드 해보겠습니다.우선 모바일 환경에서도 실행될 수 있도록 왼쪽이동 오른쪽이동 버튼을 추가하고, 장애물이나 체력포션, 내 캐릭터 등등을 이미지에서 가져와 진짜 게임처럼 구성해보겠습니다. [챗GPT와 함께 게임 그래픽 요소 업그레이드 하기 Start!]Q1. GPT 질문내용 이제 이 게임의 그래픽적인 요소들을 좀..

✍️ 이 튜토리얼은 ChatGPT를 활용해 Pygame 게임을 직접 만들고, 이를 웹과 앱으로 배포하는 전 과정을 실시간으로 구성해보는 과정을 담고 있습니다.GPT에게 질문하고, 받은 코드와 설명을 바탕으로 실제로 게임을 만들고 배포해나가는 흐름 자체가 이 글의 핵심입니다.AI를 활용해 하나의 게임이 어떻게 완성되고 앱으로 확장될 수 있는지를 그대로 따라가며 보여주는 실전형 튜토리얼입니다. 이 시간에는 Pygame으로 만든 Python 게임을 Flutter 기반 앱으로 배포하기 위한 준비 과정 중 1단계를 먼저 설명합니다.먼저 pygbag을 활용해 Pygame 게임을 HTML/JS 형태로 변환하고, FastAPI로 정적 서버를 띄워 외부에서도 접속 가능한 웹 게임 형태로 만드는 방법을 정리했습니다.왜 ..

다음과 같이 챗지피티(ChatGPT)를 켜고 "pygame으로 아래와 같은 조건의 간단한 리듬 게임을 만들어줘 1. S,D,F,J,K,L 키를 이용함 2. 음악의 bpm 변수에 따라서 박자에 맞게 노트를 생성함 3. 노트 가로는 100으로 해주고 노트의 세로는 20으로 해줘 4. S,L 노트는 흰색으로, D,K 노트는 노란색으로 F,J노트는 핑크색으로 해줘 5. 화면 맨 아래에 판정라인을 빨간색 바로 그려줘 두께는 노트의 세로보다 0.5cm정도 두껍게 - 해당 라인의 일부라도 노트가 겹쳐있을때 해당 노트에 맞는 키를 치면 점수 증가 6. 배경은 어두운 회색으로 해주고 노트와 노트 사이에 일정한 간격으로 구분선 넣어줘 (밝은 회색) 7. 노트별로 노트가 생성되는 부분 위쪽에 해당 노트의(S,D,F,J,K..