📘 [6편] 인터뷰 시뮬레이션 루틴 만들기 – 질문 3개, 답변 3개, 피드백 3개

📘 [6편] 인터뷰 시뮬레이션 루틴 만들기 – 질문 3개, 답변 3개, 피드백 3개

---

이제 본격적으로 실제 면접처럼 질문 3개를 연속으로 진행하고,
각각에 실시간으로 답변하고 평가받는 루틴을 구성해봅니다.

GPT와 사용자가 대화하듯 인터뷰를 진행하며,
각 질문에 대해 개별 피드백과 마지막 종합 피드백을 받아보는 게 목표입니다.

---

🎯 이번 목표

✅ GPT가 3개의 질문을 차례대로 제시
✅ 질문 1 → 답변 1 → 피드백 1 (순차 진행)
✅ 모든 피드백을 배열로 저장하여 표시
✅ 마지막엔 종합 평가 요약

---

🧠 GPT 질문 프롬프트 설계

당신은 채용 면접관입니다. 프론트엔드 개발자 지원자에게 실전 면접 질문 3가지를 하나씩 순서대로 제시해주세요.

질문은 아래 형식의 JSON 배열로 주세요:

[
  "첫 번째 질문",
  "두 번째 질문",
  "세 번째 질문"
]

---

🔁 시뮬레이션 진행 순서

[
  {
    question: "프로젝트에서 가장 어려웠던 순간은?",
    answer: "제가 전에 맡았던...",
    feedback: { structure: 4, delivery: 3, ... }
  },
  {
    question: "...",
    answer: "...",
    feedback: { ... }
  },
  ...
]

---

📄 루틴 상태 구조 (React 예시)

const [interviewFlow, setInterviewFlow] = useState([]); // 질문+답변+피드백 저장
const [currentIndex, setCurrentIndex] = useState(0);
const [isAnswering, setIsAnswering] = useState(false);
const [isEvaluating, setIsEvaluating] = useState(false);

---

⚙️ 진행 로직 (요약 흐름)

반응형

// 1. GPT로 질문 3개 요청
const questions = await getInterviewQuestions("프론트엔드 개발자");
setInterviewFlow(questions.map(q => ({ question: q, answer: "", feedback: null })));

// 2. 사용자가 답변 음성 입력 (또는 타이핑)
handleAnswer(index, answerText);

// 3. GPT로 피드백 요청
const feedback = await evaluateAnswer(answerText);
updateFlow(index, { answer: answerText, feedback });

---

✅ 피드백 끝난 후 요약 화면

• 3개 피드백을 한 눈에 보여주는 카드 뷰
• 종합 요약 (평균 점수 / GPT 요약)

const avgScore = Math.round(
  flow.reduce((acc, cur) => acc + cur.feedback.structure + cur.feedback.delivery + cur.feedback.content + cur.feedback.vocabulary, 0) / (flow.length * 4)
);

return <h2>✨ 총점 평균: {avgScore} / 5</h2>;

---

✅ 이번 글 요약

기능 완료 여부

GPT 질문 3개 생성	✅
질문-답변-피드백 루프 구성	✅
인터뷰 흐름 저장	✅
종합 피드백 및 평균 점수 산출	✅

---

📘 다음 글 예고

이제 앱의 거의 모든 기능이 완성됐습니다!
다음 편에서는 사용자 히스토리 저장 기능을 넣고,
면접 기록을 날짜별로 불러오고 확인할 수 있도록 정리해봅니다.

---

 

gpt 면접 루틴 구현,react gpt 인터뷰 흐름,react ai 인터뷰 시뮬레이션,interview simulation gpt,react 질문 답변 반복,gpt4 면접 피드백 루틴,react 인터뷰 시나리오,gpt 면접 평균 점수,gpt4 json 질문 리스트,gpt react 면접 챗봇