ν”Όλ“œλ‘œ λŒμ•„κ°€κΈ°
I got sick of boring AI chatbots, so I built a 1940s detective to roast my dreams πŸ•΅οΈβ€β™‚οΈ
Dev.toDev.to
AI/ML

Entity Extraction 기반의 μ‹€μ‹œκ°„ State 동기화 Evidence Board κ΅¬ν˜„

I got sick of boring AI chatbots, so I built a 1940s detective to roast my dreams πŸ•΅οΈβ€β™‚οΈ

Aniket Mehra2026λ…„ 5μ›” 16일2λΆ„beginner

AI μš”μ•½

Context

λ‹¨μˆœ ν…μŠ€νŠΈ 기반의 Chatbot UIμ—μ„œ λ²—μ–΄λ‚œ μΈν„°λž™ν‹°λΈŒν•œ μ‚¬μš©μž κ²½ν—˜ ν•„μš”μ„± λŒ€λ‘. 정적인 λŒ€ν™”μ°½μ„ λ„˜μ–΄ μ±„νŒ… μ»¨ν…μŠ€νŠΈμ— λ°˜μ‘ν•˜λŠ” 동적 μ‹œκ°ν™” μš”μ†Œμ˜ 결합이 핡심 과제둜 섀정됨.

Technical Solution

  • ERNIE LLM을 ν™œμš©ν•œ μ‹€μ‹œκ°„ Entity Extraction 둜직 μ„€κ³„λ‘œ 핡심 λͺ…사 μΆ”μΆœ
  • LLM 응닡 내에 μ‹œκ°μ  λ Œλ”λ§μ„ μœ„ν•œ μ „μš© Tagging μ‹œμŠ€ν…œμ„ λ„μž…ν•˜μ—¬ ν”„λ‘ νŠΈμ—”λ“œ 전달
  • React 기반의 Split-screen λ ˆμ΄μ•„μ›ƒμ„ ν†΅ν•œ μ±„νŒ…μ°½κ³Ό Corkboard UI의 독립적 ꡬ성
  • μ±„νŒ… μž…λ ₯κ³Ό λ™μ‹œμ— λ°±κ·ΈλΌμš΄λ“œμ—μ„œ Entityλ₯Ό μΆ”μΆœν•˜μ—¬ Page Reload 없이 Stateλ₯Ό μ—…λ°μ΄νŠΈν•˜λŠ” μ‹€μ‹œκ°„ 동기화 ꡬ쑰 채택
  • MeDo Generative App Builderλ₯Ό ν†΅ν•œ Prompt 기반의 CSS μŠ€νƒ€μΌλ§ 및 UI λ ˆμ΄μ•„μ›ƒ μžλ™ 생성

μ‹€μ²œ 포인트

1. LLM 응닡 섀계 μ‹œ λ‹¨μˆœ ν…μŠ€νŠΈ 외에 κ΅¬μ‘°ν™”λœ Tagging을 ν¬ν•¨ν•˜μ—¬ UI μ»΄ν¬λ„ŒνŠΈ μ œμ–΄κΆŒ 확보

2. μ‚¬μš©μž μž…λ ₯-뢄석-μ‹œκ°ν™”λ‘œ μ΄μ–΄μ§€λŠ” νŒŒμ΄ν”„λΌμΈμ—μ„œ 비동기 μƒνƒœ μ—…λ°μ΄νŠΈλ₯Ό ν†΅ν•œ UX μ €ν•΄ μš”μ†Œ 제거

3. Generative UI 도ꡬλ₯Ό ν™œμš©ν•œ 초기 ν”„λ‘œν† νƒ€μ΄ν•‘ 속도 ν–₯상 및 λ””μžμΈ μ œμ•½ μ‚¬ν•­μ˜ Prompt 기반 μ •μ˜ κ²€ν† 

νƒœκ·Έ

#Generative AI#React#Entity Extraction#Real-time State Update#LLM prompting
원문 읽기