Treedi - AI 학습 플랫폼

1) 포트폴리오 소개
AI 기반 교육 웹 플랫폼AI와의 대화를 트리 구조로 시각화하는 학습 도구. 하나의 답변에서 여러 질문을 동시에 생성하고, 각 질문이 독립적인 가지로 관리되어 학습 맥락을 체계적으로 정리합니다. 2주 만에 기획부터 배포까지 완성.

2) 작업 범위
웹 애플리케이션 풀스택 개발
프론트엔드 (React, TypeScript, React Flow)
백엔드 (Node.js, MongoDB)
AI API 통합 (OpenAI GPT-4)
실시간 스트리밍 응답 처리
복잡한 트리 시각화 UI/UX

3) 주요 기능
트리 구조 대화 관리: 질문-답변을 트리 형태로 시각화
다중 질문 생성: 하나의 답변에서 여러 부분을 동시에 선택해 질문
독립적 컨텍스트: 각 대화 가지마다 분리된 맥락 유지
AI 스트리밍 응답: 실시간으로 끊김 없이 답변 표시
폴더 기반 저장: 학습 세션 전체를 저장하고 언제든 불러오기
인터랙티브 노드 편집: 드래그로 자유롭게 배치 및 탐색

4) 주안점
복잡한 UI/UX 구현: React Flow를 활용한 직관적인 트리 시각화
AI 통합 전문성: OpenAI API 최적화 및 스트리밍 처리
압도적 개발 속도: 2주 만에 풀스택 서비스 완성
성능 최적화: 수백 개 노드도 부드럽게 동작하는 렌더링 최적화

Treedi - AI 학습 플랫폼

1) 포트폴리오 소개
AI 기반 교육 웹 플랫폼AI와의 대화를 트리 구조로 시각화하는 학습 도구. 하나의 답변에서 여러 질문을 동시에 생성하고, 각 질문이 독립적인 가지로 관리되어 학습 맥락을 체계적으로 정리합니다. 2주 만에 기획부터 배포까지 완성.

2) 작업 범위
웹 애플리케이션 풀스택 개발
프론트엔드 (React, TypeScript, React Flow)
백엔드 (Node.js, MongoDB)
AI API 통합 (OpenAI GPT-4)
실시간 스트리밍 응답 처리
복잡한 트리 시각화 UI/UX

3) 주요 기능
트리 구조 대화 관리: 질문-답변을 트리 형태로 시각화
다중 질문 생성: 하나의 답변에서 여러 부분을 동시에 선택해 질문
독립적 컨텍스트: 각 대화 가지마다 분리된 맥락 유지
AI 스트리밍 응답: 실시간으로 끊김 없이 답변 표시
폴더 기반 저장: 학습 세션 전체를 저장하고 언제든 불러오기
인터랙티브 노드 편집: 드래그로 자유롭게 배치 및 탐색

4) 주안점
복잡한 UI/UX 구현: React Flow를 활용한 직관적인 트리 시각화
AI 통합 전문성: OpenAI API 최적화 및 스트리밍 처리
압도적 개발 속도: 2주 만에 풀스택 서비스 완성
성능 최적화: 수백 개 노드도 부드럽게 동작하는 렌더링 최적화