영어강사 개발일기

지금까지의 프로젝트 진행 과정 중간 보고 프로젝트 계획 수립챗봇 프로젝트의 목표와 방향 설정초기 버전은 단답형 챗본으로 구현차후 채팅형 UI로 확장 예정Api key등 민감 정보는 .env 파일로 관리 하여 보안 유지Flask 서버 프레임 워크 사용 GPT API와 연동해 동작 하도록 설계.env 파일 제작 API Key와 같은 민감 정보를 .env 파일에 따로 저장기본 웹에이지(index.html) 구조 설계챗봇 UI를 이루는 기본 요소 구상:제목 영역()질문 입력창()전송 버튼()답변 표시 영역()기본 웹페이지(index.html) 제작HTML 코드 작성 로 전체 UI 감싸기나중에 CSS 적용 및 JS 이벤트 처리를 위해 ID 및 클래스 부여 현재는 CSS 없이 뼈대만 완성, 디자인은 추후 전부 구현..

Flask 서버 연동중 발생 한 오류 기록이번 파트에서는 Flask 서버와 API를 분리하여 구현하려 한다. Flask 서버는 질문자의 질문을받고 JSON형태로 답변을 반환하는 역할을 한다. 우선 진행 하기 전에 Flask 를 install 진행하자 pip install flask 코드를 작성해보자from flask import Flask, request, jsonify# GPT API 호출 모듈 importfrom CHATBOT_GPT_API import get_gpt_response# Flask 앱 초기화app = Flask(__name__)# 기본 라우트 (테스트용)@app.route("/")def home(): return "챗봇 서버가 실행 중입니다."# 질문 처리 라우트@app.rou..

플라스크?? 플라스틱??flask 서버를 만들기 전에 Flask 가 뭐하는 서버인건지 모르는 분들이 있을거 같아 코드를 작성 하기 전에 우선 알아보기로 하자 (사실은 내가 flask 서버가 뭔지 몰랐다.) Flask가 뭔데?웹 개발을 처음 접하는 사람들은 이해가 어려울 수있으니단순히 쉽게 말해 보자면 가벼운 Python 웹 프레임워크라고 알아두자 1️⃣ Flask의 특징경량(가벼움)최소한의 코드로 웹서버와 라우트를 만들 수 있음유연성필요한 기능만 서택해 확장 가능 하며, 복잡한 구조 없이 빠르게 개발가능 Python 친화적Python 코드로 라우트, 요청 처리, API 연동등 쉽게 구현2️⃣ Flask의 기본 구조from flask import Flask, request, jsonify# 1. Flask..

화면을 만들었으니 이제 챗봇 API를 불러오는 단계로 넘어가보도록 하자 우선 .env파일은 이전에 말했듯 공개가 불가능 함으로 해당 코드 생성 하는 작업은 작성하지 않도록 하겠다. CHATBOT_GPT.py 코드 구조어떤 코드를 작성하던 무조건 코드를 작성 할때엔 그 코드의 구조를 어떻게 짤건지프레임부터 만드는것이 가장 중요하다.이력서 홈페이지를 제작 하면서 구조 설계없이 무작정 코드를 짜면 유지보수가 어렵다는 것을그 프로젝트를 진행 하다 보니 저절로 깨우치게 되었다. 역시... 모든건 당해봐야 절실히 깨닫는다.. 그렇기에 이번 프로젝트에서 Flask 서버와 GPT5 Nano API 연동하고사용자의 질문을 받아 API를 호출하며, 그 응답을 Json 형태로 반환하는 구조로 만들어 보려고 한다. 구조는..

챗봇 프로젝트 - 기본 페이지 만들기프로젝트의 계획을 만들었으니 이제 챗봇의 얼굴인 페이지를 만들어보자 페이지는 우선 간단하게 chatarea 와 버튼으로 구성해 보았다. DOCTYPE html> html lang="en"> head> meta charset="UTF-8" /> meta name="viewport" content="width=device-width, initial-scale=1.0" /> title>Documenttitle> head> body> h1>챗봇 창h1> div id="chatbot_container"> textarea name=..

AI 개발자 마스터 국비 교육 과정을 듣기 4개월차 드디어 마지막 미니 프로젝트 HTML 홈페이지 제작 프로젝트가 시작 되었다. 오랜지 주스에 첨가되는 0.9%의 오랜지 향처럼 AI 개발자교육생 답게, 조금이라도 특별한 "킥"을 추가를 해야 하는게 맞다고 생각이 들었다. 그렇게 이번 프로젝트에서 가장 중책(?)인 챗봇 개발(?) 을 담당하였다. 이번 프로젝트는 이전 LLM 미니 프로젝트에서 개발한 버트 모델을 기반하여 한 프로젝트의 연장선으로홈페이지를 직접 구현 해 보기는 연장선이다. . 프로젝트 폴더 구조 시작 하기 전에 트리 구조 부터 만들어보았다. 메인 폴더: CHATBOT.PYTHON하위 폴더: HTMLtempates, CSS, jsCHATBOT.PYTHON├── HTMLtemplet├─..