Hugging Face's logo

Spaces:
jeongsoo
/
RAG6_DockerLLM_API_Service
Paused

App Files Community
RAG6_DockerLLM_API_Service / templates /index.html
jeongsoo's picture
jeongsoo
Add application file
babf3f3
raw
history blame contribute delete
5.23 kB
<!DOCTYPE html>
<html lang="ko">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>RAG 챗봇 - ν™ˆ</title>
 <link rel="stylesheet" href="/static/css/style.css">
 <!-- Bootstrap CSS -->
 <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
 <!-- Font Awesome -->
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
</head>
<body>
 <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
 <div class="container">
 <a class="navbar-brand" href="/">
 <i class="fas fa-robot me-2"></i>RAG 챗봇
 </a>
 <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
 <span class="navbar-toggler-icon"></span>
 </button>
 <div class="collapse navbar-collapse" id="navbarNav">
 <ul class="navbar-nav ms-auto">
 <li class="nav-item">
 <a class="nav-link active" href="/"><i class="fas fa-home me-1"></i>ν™ˆ</a>
 </li>
 <li class="nav-item">
 <a class="nav-link" href="/chat"><i class="fas fa-comments me-1"></i>μ±„νŒ…</a>
 </li>
 <li class="nav-item">
 <a class="nav-link" href="/knowledge"><i class="fas fa-database me-1"></i>μ§€μ‹λ² μ΄μŠ€</a>
 </li>
 </ul>
 </div>
 </div>
 </nav>
<div class="container mt-5">
 <div class="row justify-content-center">
 <div class="col-md-8 text-center">
 <h1 class="display-4 mb-4">RAG 챗봇</h1>
 <p class="lead mb-5">Retrieval-Augmented Generation 기반 지λŠ₯ν˜• 챗봇 μ„œλΉ„μŠ€</p>
<div class="row mt-5">
 <div class="col-md-4">
 <div class="card mb-4 shadow-sm h-100">
 <div class="card-body text-center py-4">
 <i class="fas fa-comments fa-4x mb-3 text-primary"></i>
 <h3 class="card-title">ν…μŠ€νŠΈ μ±„νŒ…</h3>
 <p class="card-text">ν…μŠ€νŠΈλ‘œ μ§ˆλ¬Έμ„ μž…λ ₯ν•˜κ³  지식 기반 닡변을 λ°›μœΌμ„Έμš”.</p>
 <a href="/chat" class="btn btn-primary mt-2">μ±„νŒ… μ‹œμž‘</a>
 </div>
 </div>
 </div>
<div class="col-md-4">
 <div class="card mb-4 shadow-sm h-100">
 <div class="card-body text-center py-4">
 <i class="fas fa-microphone fa-4x mb-3 text-danger"></i>
 <h3 class="card-title">μŒμ„± μ±„νŒ…</h3>
 <p class="card-text">VITO STTλ₯Ό ν™œμš©ν•œ μŒμ„± 질문으둜 λŒ€ν™”ν•˜μ„Έμš”.</p>
 <a href="/chat" class="btn btn-danger mt-2">μŒμ„± μ±„νŒ…</a>
 </div>
 </div>
 </div>
<div class="col-md-4">
 <div class="card mb-4 shadow-sm h-100">
 <div class="card-body text-center py-4">
 <i class="fas fa-database fa-4x mb-3 text-success"></i>
 <h3 class="card-title">μ§€μ‹λ² μ΄μŠ€</h3>
 <p class="card-text">λ¬Έμ„œλ₯Ό μ—…λ‘œλ“œν•˜μ—¬ μ±—λ΄‡μ˜ 지식을 ν™•μž₯ν•˜μ„Έμš”.</p>
 <a href="/knowledge" class="btn btn-success mt-2">μ§€μ‹λ² μ΄μŠ€ 관리</a>
 </div>
 </div>
 </div>
 </div>
<div class="row mt-5">
 <div class="col-md-12">
 <div class="card shadow-sm">
 <div class="card-body">
 <h4 class="mb-3">RAG κΈ°μˆ μ— λŒ€ν•˜μ—¬</h4>
 <p>RAG(Retrieval-Augmented Generation)λŠ” λŒ€κ·œλͺ¨ μ–Έμ–΄ λͺ¨λΈ(LLM)에 μ™ΈλΆ€ 지식을 μ œκ³΅ν•˜μ—¬ 더 μ •ν™•ν•˜κ³  μ΅œμ‹  정보λ₯Ό λ°”νƒ•μœΌλ‘œ 응닡을 μƒμ„±ν•˜λŠ” κΈ°μˆ μž…λ‹ˆλ‹€.</p>
 <p>λ³Έ 챗봇은 λ¬Έμ„œ 검색과 LLM 생성을 κ²°ν•©ν•˜μ—¬ μ‚¬μš©μž μ§ˆλ¬Έμ— λŒ€ν•œ λ§₯락 기반 응닡을 μ œκ³΅ν•©λ‹ˆλ‹€.</p>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
 </div>
<footer class="bg-dark text-white text-center py-3 mt-5">
 <div class="container">
 <p class="mb-0">RAG 챗봇 ν΄λΌμ΄μ–ΈνŠΈ &copy; 2025</p>
 </div>
 </footer>
<!-- Bootstrap JS Bundle with Popper -->
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>