https://snatchbot.me/assets/tutorial-detail-C61DTHMt.js

1import{E as z,i as Q,k as W,r as c,j as e,a as i,f as r,L as x,B as n,P as Y,b as l,d as o,C as V}from"./index-PGn8vSJz.js";import{P as b}from"./PublicHeaderNew-DMOn6y2r.js";import{P as w}from"./PublicFooter-RDzJx29i.js";import{B as N}from"./badge-DgMfKNNj.js";import{T as $,a as G,b as p,c as h}from"./tabs-fETLmcaz.js";import{C as y}from"./circle-alert-G5E-kTci.js";import{A as C}from"./arrow-left-DvMCNSbs.js";import{U as H}from"./user-iRF0ZP2V.js";import{C as X}from"./clock-DL6pu9dl.js";import{E as Z}from"./eye-DqjYc5iZ.js";import{T as _}from"./thumbs-up-Cm4cxo9i.js";import{C as J}from"./calendar-DFkVocny.js";import{C as g}from"./circle-check-big-8cqxL_Th.js";import{A as k}from"./award-CjeUkShV.js";import{C as T}from"./code-xe5_2pb0.js";import{C as K}from"./check-tfZ-z4PG.js";import{C as ee}from"./copy-DW84pl2h.js";import{I as se}from"./info-BBKImPKX.js";import{M as S}from"./monitor-sJOCKk7M.js";import{F as A}from"./file-text-BKAVqRrA.js";import{D as B}from"./download-C24UwTHV.js";import{B as te}from"./bookmark-plus-D5r4zMLf.js";import{S as ae}from"./share-2-C1xFosZp.js";import"./avatar-BwPcbJoG.js";import"./SnatchBot logo-BuDrPWu8.js";import"./globe-hR3HqlVj.js";import"./shield-DH8DEIQQ.js";

1import"./mail-dRsiP3NX.js";import"./headphones-Ch5eVbBD.js";import"./chevron-down-Bda4cwrZ.js";import"./settings-DVEXgbjg.js";import"./log-out-BRmHexue.js";import"./arrow-right-D1f3AN57.js";import"./menu-DS_6Xhwm.js";import"./trending-up-V0T5p4Sk.js";import"./building-2-DNuIl6W_.js";import"./cpu-BzJX6jQJ.js";import"./users-DQSsydaP.js";import"./brain-oIlp6d3J.js";import"./mic-vwCxqOi4.js";import"./layers-QjNwzjaJ.js";import"./store-Cico_FX-.js";import"./chart-no-axes-column-increasing-X0RWudRM.js";import"./zap-BOVXkUjb.js";import"./book-open-Bekk8XVC.js";import"./circle-help-BDCi414k.js";import"./gauge-DsTMaXhE.js";import"./phone-kxyZQzp0.js";import"./building-CNRZ3Ms8.js";import"./briefcase-DQw8d9wL.js";import"./separator-cxFy5HNU.js";import"./input-BPacmp0P.js";import"./bot-B0PhMFyu.js";import"./message-square-pNgT67Sh.js";import"./facebook-YHJNqqqC.js";import"./twitter-Bz0Nx7qs.js";import"./linkedin-Cm4IB3xj.js";import"./index-WHqFZBSo.js";import"./index-DwN64C-p.js";import"./index-oa0B1jC8.js";const D=[{id:"quick-start-guide",title:"Quick Start: Build Your First AI Chatbot in 5 Minutes",description:"Complete beginner's guide to creating, training, and deploying your first AI-powered chatbot with SnatchBot's visual builder.",duration:"5 min",level:"Beginner",category:"getting-started",author:"Dr. Sarah Chen",authorAvatar:"SC",videoUrl:"https://www.youtube.com/embed/dQw4w9WgXcQ",videoThumbnail:"/api/placeholder/800/450",tags:["quick-start","beginner","visual-builder","no-code"],views:125420,likes:8932,lastUpdated:"2 days ago",estimatedTime:5,prerequisites:["SnatchBot account","Basic understanding of chatbots"],learningOutcomes:["Create your first chatbot from scratch","Understand the visual builder interface","Deploy to multiple channels","Test and debug your bot"],screenshots:[{title:"Dashboard Overview",url:"/api/placeholder/800/600",description:"Main dashboard showing all your bots"},{title:"Visual Builder",url:"/api/placeholder/800/600",description:"Drag-and-drop interface for building flows"},{title:"Testing Interface",url:"/api/placeholder/800/600",description:"Real-time bot testing environment"}],interactive:!0,certification:!0,content:`
2# Quick Start Guide: Build Your First AI Chatbot
3
4## Step 1: Create Your Account
51. Navigate to the signup page
62. Enter your business email
73. Verify your email address
84. Complete profile setup
9
10## Step 2: Access the Dashboard
11- Click "Create New Bot" button
12- Choose from 50+ industry templates
13- Or start with a blank canvas
14
15## Step 3: Design Your Conversation Flow
16- Drag and drop conversation blocks
17- Connect blocks to create flows
18- Add AI responses and intents
19
20## Step 4: Train Your Bot
21- Add training phrases
22- Define entities and variables
23- Test with sample conversations
24
25## Step 5: Deploy and Monitor
26- One-click deployment to channels
27- Monitor real-time analytics
28- Iterate based on user feedback
29    `},{id:"advanced-nlu-training",title:"Advanced NLU Training: Master Intent Recognition & Entity Extraction",description:"Deep dive into natural language understanding, training sophisticated intents, entities, and context management for enterprise-grade bots.",duration:"45 min",level:"Advanced",category:"bot-building",author:"Michael Rodriguez",authorAvatar:"MR",videoUrl:"https://www.youtube.com/embed/dQw4w9WgXcQ",tags:["NLU","machine-learning","intents","entities","advanced"],views:89234,likes:6421,lastUpdated:"1 week ago",estimatedTime:45,prerequisites:["Basic bot building","Understanding of NLU concepts"],learningOutcomes:["Master advanced intent classification","Implement complex entity extraction","Handle multi-turn conversations","Optimize NLU model performance"],codeExamples:[{language:"javascript",code:`// Custom entity extraction
30const extractEntities = (text) => {
31  const entities = [];
32  const patterns = {
33    email: /\\b[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\\.[A-Z|a-z]{2,}\\b/g,
34    phone: /\\b\\d{3}[-.]?\\d{3}[-.]?\\d{4}\\b/g,
35    date: /\\b\\d{1,2}\\/\\d{1,2}\\/\\d{4}\\b/g
36  };
37  
38  for (const [type, pattern] of Object.entries(patterns)) {
39    const matches = text.match(pattern);
40    if (matches) {
41      entities.push({ type, values: matches });
42    }
43  }
44  return entities;
45};`}],interactive:!0,certification:!0,content:`
46# Advanced NLU Training Guide
47
48## Understanding Intent Classification
49Intents represent what users want to accomplish. Advanced training involves:
50- Multi-intent detection
51- Contextual intent switching
52- Confidence threshold optimization
53
54## Entity Extraction Mastery
55Learn to extract complex information:
56- System entities (dates, numbers, locations)
57- Custom entities for your domain
58- Composite entities and relationships
59
60## Training Best Practices
611. Use diverse training examples (minimum 50 per intent)
622. Include edge cases and variations
633. Balance positive and negative examples
644. Regular model evaluation and retraining
65    `},{id:"enterprise-deployment",title:"Enterprise Deployment: Scale to Millions of Users",description:"Complete guide to deploying, scaling, and managing enterprise chatbots across multiple channels with high availability and security.",duration:"60 min",level:"Expert",category:"deployment",author:"Jennifer Park",authorAvatar:"JP",videoUrl:"https://www.youtube.com/embed/dQw4w9WgXcQ",tags:["enterprise","deployment","scaling","security","multi-channel"],views:67890,likes:5234,lastUpdated:"3 days ago",estimatedTime:60,prerequisites:["Advanced bot building","Basic DevOps knowledge","Enterprise account"],learningOutcomes:["Deploy to 20+ channels simultaneously","Implement enterprise security measures","Set up high availability infrastru

65cture","Configure auto-scaling and load balancing"],screenshots:[{title:"Deployment Pipeline",url:"/api/placeholder/800/600",description:"CI/CD pipeline for bot deployment"},{title:"Channel Configuration",url:"/api/placeholder/800/600",description:"Multi-channel deployment settings"},{title:"Security Dashboard",url:"/api/placeholder/800/600",description:"Enterprise security monitoring"}],interactive:!0,certification:!0,content:`
66# Enterprise Deployment Guide
67
68## Infrastructure Setup
69- Configure auto-scaling groups
70- Set up load balancers
71- Implement caching strategies
72- Database optimization
73
74## Security Implementation
75- End-to-end encryption
76- OAuth 2.0 authentication
77- Role-based access control (RBAC)
78- Audit logging and compliance
79
80## Multi-Channel Deployment
81Deploy simultaneously to:
82- Web chat widgets
83- Mobile apps (iOS/Android)
84- Facebook Messenger
85- WhatsApp Business
86- Slack
87- Microsoft Teams
88- Voice assistants
89    `}];function ms(){const j=z().id;Q();const{toast:m}=W(),[s,E]=c.useState(null),[f,U]=c.useState(0),[d,M]=c.useState(!1),[I,v]=c.useState(null);c.useState(0);const[u,P]=c.useState([]);c.useEffect(()=>{const t=D.find(a=>a.id===j);t&&E(t),window.scrollTo(0,0)},[j]);const L=t=>{switch(t){case"Beginner":return"bg-gradient-to-r from-green-500 to-emerald-500 text-white";case"Intermediate":return"bg-gradient-to-r from-yellow-500 to-orange-500 text-white";case"Advanced":return"bg-gradient-to-r from-red-500 to-pink-500 text-white";case"Expert":return"bg-gradient-to-r from-purple-500 to-indigo-500 text-white";default:return"bg-gray-100 text-gray-800"}},O=(t,a)=>{navigator.clipboard.writeText(t),v(a),m({title:"Code Copied",description:"Code snippet copied to clipboard"}),setTimeout(()=>v(null),2e3)},F=()=>{M(!d),m({title:d?"Bookmark Removed":"Tutorial Bookmarked",description:d?"Removed from your bookmarks":"Added to your bookmarks for quick access"})},R=()=>{const t=window.location.href;navigator.clipboard.writeText(t),m({title:"Link Copied",description:"Tutorial link copied to clipboard"})},q=t=>{if(!u.includes(t)){P([...u,t]);const a=(u.length+1)/5*100;U(a),m({title:"Section Completed",description:`${Math.round(a)}% of tutorial completed`})}};return s?e.jsxs("div",{className:"min-h-screen bg-gradient-to-br from-slate-50 via-white to-blue-50",children:[e.jsx(b,{}),e.jsx("section",{className:"relative py-16 px-4 sm:px-6 lg:px-8 bg-gradient-to-br from-slate-900 via-blue-900 to-indigo-900",children:e.jsxs("div",{className:"container mx-auto",children:[e.jsx(x,{href:"/tutorials",children:e.jsxs(n,{variant:"ghost",className:"text-white hover:bg-white/10 mb-4",children:[e.jsx(C,{className:"mr-2 h-4 w-4"}),"Back to Tutorials"]})}),e.jsxs("div",{className:"max-w-4xl",children:[e.jsx(N,{className:`${L(s.level)} mb-4`,children:s.level}),e.jsx("h1",{className:"text-4xl md:text-5xl font-bold text-white mb-4",children:s.title}),e.jsx("p",{className:"text-xl text-blue-100 mb-6",children:s.description}),e.jsxs("div",{className:"flex flex-wrap items-center gap-6 text-white/80",children:[e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(H,{className:"h-4 w-4"}),e.jsx("span",{children:s.author})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(X,{className:"h-4 w-4"}),e.jsx("span",{children:s.duration})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(Z,{className:"h-4 w-4"}),e.jsxs("span",{children:[s.views.toLocaleString()," views"]})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(_,{className:"h-4 w-4"}),e.jsxs("span",{children:[s.likes.toLocaleString()," likes"]})]}),e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(J,{className:"h-4 w-4"}),e.jsxs("span",{children:["Updated ",s.lastUpdated]})]})]}),e.jsx("div",{className:"flex flex-wrap gap-2 mt-6",children:s.tags.map((t,a)=>e.jsx(N,{variant:"secondary",className:"bg-white/10 text-white border-white/20",children:t},a))})]})]})}),e.jsx("div",{className:"container mx-auto px-4 py-12",children:e.jsxs("div",{className:"grid lg:grid-cols-3 gap-8",children:[e.jsxs("div",{className:"lg:col-span-2",children:[e.jsx(i,{className:"mb-6",children:e.jsxs(r,{className:"p-6",children:[e.jsxs("div",{className:"flex items-center justify-between mb-2",children:[e.jsx("span",{className:"text-sm font-medium",children:"Tutorial Progress"}),e.jsxs("span",{className:"text-sm text-gray-500",children:[Math.round(f),"% Complete"]})]}),e.jsx(Y,{value:f,className:"h-2"})]})}),e.jsxs($,{defaultValue:"overview",className:"space-y-6",children:[e.jsxs(G,{className:"grid grid-cols-4 w-full",children:[e.jsx(p,{value:"overview",children:"Overview"}),e.jsx(p,{value:"content",children:"Content"}),e.jsx(p,{value:"code",children:"Code"}),e.jsx(p,{value:"resources",children:"Resources"})]}),e.jsxs(h,{value:"overview",className:"space-y-6",children:[s.prerequisites&&s.prerequisites.length>0&&e.jsxs(i,{children:[e.jsx(l,{children:e.jsxs(o,{className:"flex items-center gap-2",children:[e.jsx(y,{className:"h-5 w-5"}),"Prerequisites"]})}),e.jsx(r,{children:e.jsx("ul",{className:"space-y-2",children:s.prerequisites.map((t,a)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(g,{className:"h-4 w-4 text-green-500 mt-0.5"}),e.jsx("span",{children:t})]},a))})})]}),s.learningOutcomes&&s.learningOutcomes.length>0&&e.jsxs(i,{children:[e.jsx(l,{children:e.jsxs(o,{className:"flex items-center gap-2",children:[e.jsx(k,{className:"h-5 w-5"}),"What You'll Learn"]})}),e.jsx(r,{children:e.jsx("ul",{className:"space-y-2",children:s.learningOutcomes.map((t,a)=>e.jsxs("li",{className:"flex items-start gap-2",children:[e.jsx(g,{className:"h-4 w-4 text-blue-500 mt-0.5"}),e.jsx("span",{children:t})]},a))})})]}),s.videoUrl&&e.jsxs(i,{children:[e.jsx(l,{children:e.jsxs(o,{className:"flex items-center gap-2",children:[e.jsx(V,{className:"h-5 w-5"}),"Video Tutorial"]})}),e.jsx(r,{children:e.jsx("div",{className:"aspect-video bg-gray-100 rounded-lg overflow-hidden",children:e.jsx("iframe",{src:s.videoUrl,title:s.title,className:"w-full h-full",allow:"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",allowFullScreen:!0})})})]})]}),e.jsx(h,{value:"content",className:"space-y-6",children:e.jsx(i,{children:e.jsxs(r,{className:"p-6",children:[e.jsx("div",{className:"prose max-w-none",children:e.jsx("div",{dangerouslySetInnerHTML:{__html:s.content.replace(/\n/g,"<br/>")}})}),e.jsx("div",{className:"mt-6 flex justify-end",children:e.jsxs(n,{onClick:()=>q(0),children:["Mark as Complete",e.jsx(g,{className:"ml-2 h-4 w-4"})]})})]})})}),e.jsx(h,{value:"code",className:"space-y-6",children:s.codeExamples&&s.codeExamples.length>0?s.codeExamples.map((t,a)=>e.jsxs(i,{children:[e.jsx(l,{children:e.jsxs(o,{className:"flex items-center justify-between",children:[e.jsxs("span",{className:"flex items-center gap-2",children:[e.jsx(T,{className:"h-5 w-5"}),t.language]}),e.jsx(n,{size:"sm",variant:"outline",onClick:()=>O(t.code,`code-${a}`),children:I===`code-${a}`?e.jsxs(e.Fragment,{children:[e.jsx(K,{className:"mr-2 h-3 w-3"}),"Copied"]}):e.jsxs(e.Fragment,{children:[e.jsx(ee,{className:"mr-2 h-3 w-3"}),"Copy"]})})]})}),e.jsx(r,{children:e.jsx("pre",{className:"bg-gray-900 text-gray-100 p-4 rounded-lg overflow-x-auto",children:e.jsx("code",{children:t.code})})})]},a)):e.jsx(i,{children:e.jsxs(r,{className:"p-8 text-center",children:[e.jsx(se,{className:"h-12 w-12 text-gray-400 mx-auto mb-4"}),e.jsx("p",{className:"text-gray-600",children:"No code examples available for this tutorial."})]})})}),e.jsxs(h,{value:"resources",className:"space-y-6",children:[s.screenshots&&s.screenshots.length>0&&e.jsxs(i,{children:[e.jsx(l,{children:e.jsxs(o,{className:"flex items-center gap-2",children:[e.jsx(S,{className:"h-5 w-5"}),"Screenshots"]})}),e.jsx(r,{children:e.jsx("div",{className:"grid gap-4",children:s.screenshots.map((t,a)=>e.jsxs("div",{className:"space-y-2",children:[e.jsx("h4",{className:"font-medium",children:t.title}),e.jsx("div",{className:"bg-gray-100 rounded-lg p-4 aspect-video flex items-center justify-center",children:e.jsx(A,{className:"h-12 w-12 text-gray-400"})}),e.jsx("p",{className:"text-sm text-gray-600",children:t.description})]},a))})})]}),e.jsxs(i,{children:[e.jsx(l,{children:e.jsxs(o,{className:"flex items-center gap-2",children:[e.jsx(B,{className:"h-5 w-5"}),"Downloads"]})}),e.jsx(r,{children:e.jsxs("div",{className:"space-y-2",children:[e.jsxs(n,{variant:"outline",className:"w-full justify-start",children:[e.jsx(A,{className:"mr-2 h-4 w-4"}),"Tutorial PDF Guide"]}),e.jsxs(n,{variant:"outline",className:"w-full justify-start",children:[e.jsx(T,{className:"mr-2 h-4 w-4"}),"Sample Code Files"]}),e.jsxs(n,{variant:"outline",className:"w-full justify-start",children:[e.jsx(S,{className:"mr-2 h-4 w-4"}),"Presentation Slides"]})]})})]})]})]})]}),e.jsxs("div",{className:"space-y-6",children:[e.jsx(i,{children:e.jsxs(r,{className:"p-4 space-y-2",children:[e.jsxs(n,{className:"w-full",onClick:F,variant:d?"secondary":"outline",children:[e.jsx(te,{className:"mr-2 h-4 w-4"}),d?"Bookmarked":"Bookmark"]}),e.jsxs(n,{variant:"outline",className:"w-full",onClick:R,children:[e.jsx(ae,{className:"mr-2 h-4 w-4"}),"Share"]}),e.jsxs(n,{variant:"outline",className:"w-full",children:[e.jsx(B,{className:"mr-2 h-4 w-4"}),"Download PDF"]})]})}),s.certification&&e.jsx(i,{className:"bg-gradient-to-br from-yellow-50 to-orange-50 border-yellow-200",children:e.jsxs(r,{className:"p-6 text-center",children:[e.jsx(k,{className:"h-12 w-12 text-yellow-600 mx-auto mb-3"}),e.jsx("h3",{className:"font-semibold mb-2",children:"Earn Certificate"}),e.jsx("p",{className:"text-sm text-gray-600 mb-4",children:"Complete this tutorial to earn your certificate"}),e.jsx(n,{className:"w-full bg-gradient-to-r from-yellow-500 to-orange-500 hover:from-yellow-600 hover:to-orange-600",children:"Start Certification"})]})}),e.jsxs(i,{children:[e.jsx(l,{children:e.jsx(o,{children:"About the Author"})}),e.jsx(r,{children:e.jsxs("div",{className:"flex items-center gap-3",children:[e.jsx("div",{className:"h-12 w-12 rounded-full bg-blue-600 flex items-center justify-center text-white font-medium",children:s.authorAvatar}),e.jsxs("div",{children:[e.jsx("p",{className:"font-medium",children:s.author}),e.jsx("p",{className:"text-sm text-gray-500",children:"AI & Chatbot Expert"})]})]})})]}),e.jsxs(i,{children:[e.jsx(l,{children:e.jsx(o,{children:"Related Tutorials"})}),e.jsx(r,{children:e.jsx("div",{className:"space-y-2",children:D.slice(0,3).map((t,a)=>e.jsx(x,{href:`/tutorials/${t.id}`,children:e.jsxs("div",{className:"p-2 hover:bg-gray-50 rounded-lg transition-colors cursor-pointer",children:[e.jsx("p",{className:"font-medium text-sm",children:t.title}),e.jsxs("p",{className:"text-xs text-gray-500",children:[t.duration," • ",t.level]})]})},a))})})]})]})]})}),e.jsx(w,{})]}):e.jsxs("div",{className:"min-h-screen bg-gradient-to-br from-slate-50 via-white to-blue-50",children:[e.jsx(b,{}),e.jsx("div",{className:"container mx-auto px-4 py-20",children:e.jsx(i,{className:"max-w-2xl mx-auto",children:e.jsxs(r,{className:"p-8 text-center",children:[e.jsx(y,{className:"h-12 w-12 text-yellow-500 mx-auto mb-4"}),e.jsx("h2",{className:"text-2xl font-bold mb-2",children:"Tutorial Not Found"}),e.jsx("p",{className:"text-gray-600 mb-4",children:"The tutorial you're looking for doesn't exist or has been moved."}),e.jsx(x,{href:"/tutorials",children:e.jsxs(n,{children:[e.jsx(C,{className:"mr-2 h-4 w-4"}),"Back to Tutorials"]})})]})})}),e.jsx(w,{})]})}

89export{ms as default};