---
title: "Реальні приклади"
description: "Документація реальних додатків на базі платформи Ring"
locale: "uk"
---
# Реальні приклади

Повноцінні приклади додатків, побудованих на платформі Ring, що демонструють комплексні рішення для різних галузей та випадків використання.

## 🏥 Платформа медичної мережі

### Повноцінна мережа медичних працівників

// app/healthcare/page.tsx

{`'use client'

import { useState, useEffect } from 'react'
import { useSession } from 'next-auth/react'
import { ProtectedRoute } from '@/components/ProtectedRoute'
import { BrandProvider } from '@/components/BrandProvider'

interface HealthcareProfessional {
  id: string
  name: string
  specialty: string
  license: string
  hospital: string
  verified: boolean
  rating: number
  consultationFee: number
  availability: string[]
}

interface MedicalOpportunity {
  id: string
  title: string
  type: 'consultation' | 'collaboration' | 'research' | 'locum'
  specialty: string
  urgency: 'low' | 'medium' | 'high' | 'emergency'
  location: string
  compensation: string
  description: string
  requirements: string[]
  postedBy: string
  deadline: string
}

export default function HealthcareNetwork() {
  const { data: session } = useSession()
  const [professionals, setProfessionals] = useState<HealthcareProfessional[]>([])
  const [opportunities, setOpportunities] = useState<MedicalOpportunity[]>([])
  const [activeTab, setActiveTab] = useState<'directory' | 'opportunities' | 'consultations'>('directory')
  const [loading, setLoading] = useState(true)

  useEffect(() => {
    loadData()
  }, [])

  const loadData = async () => {
    try {
      const [professionalsRes, opportunitiesRes] = await Promise.all([
        fetch('/api/healthcare/professionals'),
        fetch('/api/healthcare/opportunities')
      ])

      const professionalsData = await professionalsRes.json()
      const opportunitiesData = await opportunitiesRes.json()

      setProfessionals(professionalsData.professionals || [])
      setOpportunities(opportunitiesData.opportunities || [])
    } catch (error) {
      console.error('Не вдалося завантажити медичні дані:', error)
    } finally {
      setLoading(false)
    }
  }

  const getUrgencyColor = (urgency: string) => {
    const colors = {
      low: 'bg-green-100 text-green-800',
      medium: 'bg-yellow-100 text-yellow-800',
      high: 'bg-orange-100 text-orange-800',
      emergency: 'bg-red-100 text-red-800'
    }
    return colors[urgency as keyof typeof colors] || 'bg-gray-100 text-gray-800'
  }

  const requestConsultation = async (professionalId: string) => {
    try {
      const response = await fetch('/api/healthcare/consultations/request', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({
          professionalId,
          patientId: session?.user?.id,
          type: 'video',
          urgency: 'medium'
        })
      })

      if (response.ok) {
        alert('Запит на консультацію надіслано успішно!')
      }
    } catch (error) {
      console.error('Не вдалося надіслати запит на консультацію:', error)
      alert('Не вдалося надіслати запит на консультацію')
    }
  }

  if (loading) {
    return Завантаження медичної мережі...
  }

  return (
    
      
        
          {/* Заголовок */}
          
            
              
                
                  МедЗв'язок
                  Мережа медичних працівників
                
                
                  
                    Вітаємо, д-р {session?.user?.name}
                  
                  
                    
                      {session?.user?.name?.charAt(0)}
                    
                  
                
              
            
          

          {/* Навігаційні вкладки */}
          
            
              
                {[
                  { key: 'directory', label: 'Каталог спеціалістів', icon: '👨‍⚕️' },
                  { key: 'opportunities', label: 'Медичні можливості', icon: '🏥' },
                  { key: 'consultations', label: 'Консультації', icon: '💬' }
                ].map((tab) => (
                   setActiveTab(tab.key as any)}
                    className={`py-4 px-1 border-b-2 font-medium text-sm ${
                      activeTab === tab.key
                        ? 'border-green-500 text-green-600'
                        : 'border-transparent text-gray-500 hover:text-gray-700'
                    }`}
                  >
                    {tab.icon}
                    {tab.label}
                  
                ))}
              
            
          

          {/* Контент */}
          
            {activeTab === 'directory' && (
              
                Медичні працівники
                
                  {professionals.map((professional) => (
                    
                      
                        
                          
                            Д-р {professional.name}
                          
                          {professional.specialty}
                          {professional.hospital}
                        
                        {professional.verified && (
                          
                            Верифіковано
                          
                        )}
                      

                      
                        
                          {[...Array(5)].map((_, i) => (
                            
                              ★
                            
                          ))}
                        
                        
                          ({professional.rating}/5)
                        
                      

                      
                        
                          Вартість консультації: ${professional.consultationFee}
                        
                        
                          Ліцензія: {professional.license}
                        
                      

                       requestConsultation(professional.id)}
                        className="w-full bg-green-600 text-white py-2 px-4 rounded-md hover:bg-green-700"
                      >
                        Запросити консультацію
                      
                    
                  ))}
                
              
            )}

            {activeTab === 'opportunities' && (
              
                Медичні можливості
                
                  {opportunities.map((opportunity) => (
                    
                      
                        
                          
                            {opportunity.title}
                          
                          
                            {opportunity.specialty} • {opportunity.location}
                          
                        
                        
                          
                            {opportunity.urgency === 'low' ? 'НИЗЬКА' : 
                             opportunity.urgency === 'medium' ? 'СЕРЕДНЯ' :
                             opportunity.urgency === 'high' ? 'ВИСОКА' : 'ЕКСТРЕНА'}
                          
                          
                            {opportunity.type === 'consultation' ? 'КОНСУЛЬТАЦІЯ' :
                             opportunity.type === 'collaboration' ? 'СПІВПРАЦЯ' :
                             opportunity.type === 'research' ? 'ДОСЛІДЖЕННЯ' : 'ЗАМІЩЕННЯ'}
                          
                        
                      

                      {opportunity.description}

                      
                        Вимоги:
                        
                          {opportunity.requirements.map((req, index) => (
                            {req}
                          ))}
                        
                      

                      
                        
                          Винагорода: {opportunity.compensation}
                          Дедлайн: 
                            {new Date(opportunity.deadline).toLocaleDateString()}
                          
                        
                        
                          Подати заявку
                        
                      
                    
                  ))}
                
              
            )}

            {activeTab === 'consultations' && (
              
                Мої консультації
                
                  
                    
                      📅
                      Немає запланованих консультацій
                      Запросіть консультацію з Каталогу спеціалістів
                    
                  
                
              
            )}
          
        
      
    
  )
}`}

## 💼 Технологічний стартап-акселератор

### Платформа стартап-акселератора

// app/accelerator/page.tsx

{`'use client'

import { useState, useEffect } from 'react'
import { useSession } from 'next-auth/react'

interface Startup {
  id: string
  name: string
  description: string
  stage: 'idea' | 'mvp' | 'growth' | 'scale'
  industry: string
  fundingRaised: number
  teamSize: number
  logo: string
  founders: string[]
  metrics: {
    revenue: number
    users: number
    growth: number
  }
}

interface Mentor {
  id: string
  name: string
  title: string
  company: string
  expertise: string[]
  rating: number
  sessionsCompleted: number
  hourlyRate: number
  avatar: string
}

interface InvestmentOpportunity {
  id: string
  startupId: string
  startupName: string
  round: 'pre-seed' | 'seed' | 'series-a' | 'series-b'
  targetAmount: number
  raisedAmount: number
  valuation: number
  minimumInvestment: number
  deadline: string
  highlights: string[]
}

export default function StartupAccelerator() {
  const { data: session } = useSession()
  const [activeTab, setActiveTab] = useState<'startups' | 'mentors' | 'investments' | 'events'>('startups')
  const [startups, setStartups] = useState<Startup[]>([])
  const [mentors, setMentors] = useState<Mentor[]>([])
  const [investments, setInvestments] = useState<InvestmentOpportunity[]>([])
  const [loading, setLoading] = useState(true)

  useEffect(() => {
    loadAcceleratorData()
  }, [])

  const loadAcceleratorData = async () => {
    try {
      const [startupsRes, mentorsRes, investmentsRes] = await Promise.all([
        fetch('/api/accelerator/startups'),
        fetch('/api/accelerator/mentors'),
        fetch('/api/accelerator/investments')
      ])

      const [startupsData, mentorsData, investmentsData] = await Promise.all([
        startupsRes.json(),
        mentorsRes.json(),
        investmentsRes.json()
      ])

      setStartups(startupsData.startups || [])
      setMentors(mentorsData.mentors || [])
      setInvestments(investmentsData.investments || [])
    } catch (error) {
      console.error('Не вдалося завантажити дані акселератора:', error)
    } finally {
      setLoading(false)
    }
  }

  const getStageColor = (stage: string) => {
    const colors = {
      idea: 'bg-gray-100 text-gray-800',
      mvp: 'bg-blue-100 text-blue-800',
      growth: 'bg-green-100 text-green-800',
      scale: 'bg-purple-100 text-purple-800'
    }
    return colors[stage as keyof typeof colors] || 'bg-gray-100 text-gray-800'
  }

  const formatCurrency = (amount: number) => {
    if (amount >= 1000000) {
      return `$${(amount / 1000000).toFixed(1)}M`
    } else if (amount >= 1000) {
      return `$${(amount / 1000).toFixed(0)}K`
    }
    return `$${amount}`
  }

  const bookMentorSession = async (mentorId: string) => {
    try {
      const response = await fetch('/api/accelerator/mentors/book', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({
          mentorId,
          startupId: session?.user?.entityId,
          duration: 60,
          type: 'strategy'
        })
      })

      if (response.ok) {
        alert('Сесію з ментором успішно заброньовано!')
      }
    } catch (error) {
      console.error('Не вдалося забронювати сесію з ментором:', error)
      alert('Не вдалося забронювати сесію з ментором')
    }
  }

  const expressInterest = async (investmentId: string, amount: number) => {
    try {
      const response = await fetch('/api/accelerator/investments/interest', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({
          investmentId,
          investorId: session?.user?.id,
          amount
        })
      })

      if (response.ok) {
        alert('Зацікавленість в інвестуванні успішно подано!')
      }
    } catch (error) {
      console.error('Не вдалося подати зацікавленість в інвестуванні:', error)
      alert('Не вдалося подати зацікавленість в інвестуванні')
    }
  }

  if (loading) {
    return Завантаження платформи акселератора...
  }

  return (
    
      {/* Header */}
      
        
          TechConnect Акселератор
          
            Об'єднуємо стартапи, менторів та інвесторів в технологічній екосистемі
          
        
      

      {/* Navigation */}
      
        
          
            {[
              { key: 'startups', label: 'Стартапи', icon: '🚀' },
              { key: 'mentors', label: 'Ментори', icon: '👨‍🏫' },
              { key: 'investments', label: 'Інвестиції', icon: '💰' },
              { key: 'events', label: 'Події', icon: '📅' }
            ].map((tab) => (
               setActiveTab(tab.key as any)}
                className={`py-4 px-1 border-b-2 font-medium text-sm ${
                  activeTab === tab.key
                    ? 'border-blue-500 text-blue-600'
                    : 'border-transparent text-gray-500 hover:text-gray-700'
                }`}
              >
                {tab.icon}
                {tab.label}
              
            ))}
          
        
      

      {/* Content */}
      
        {activeTab === 'startups' && (
          
            
              Рекомендовані стартапи
              
                Подати свій стартап
              
            

            
              {startups.map((startup) => (
                
                  
                    
                      
                      
                        {startup.name}
                        {startup.industry}
                      
                    

                    {startup.description}

                    
                      
                        {startup.stage.toUpperCase()}
                      
                      
                        {startup.teamSize} учасників команди
                      
                    

                    
                      
                        
                          {formatCurrency(startup.metrics.revenue)}
                        
                        Дохід
                      
                      
                        
                          {startup.metrics.users.toLocaleString()}
                        
                        Користувачі
                      
                      
                        
                          +{startup.metrics.growth}%
                        
                        Зростання
                      
                    

                    
                      
                        Переглянути деталі
                      
                      
                        Зв'язатися
                      
                    
                  
                
              ))}
            
          
        )}

        {activeTab === 'mentors' && (
          
            Експертні ментори
            
              {mentors.map((mentor) => (
                
                  
                    
                    
                      {mentor.name}
                      {mentor.title}
                      {mentor.company}
                    
                    
                      
                        ${mentor.hourlyRate}/год
                      
                      
                        ★
                        {mentor.rating}
                      
                    
                  

                  
                    Експертиза:
                    
                      {mentor.expertise.map((skill, index) => (
                        
                          {skill}
                        
                      ))}
                    
                  

                  
                    
                      {mentor.sessionsCompleted} сесій проведено
                    
                  

                   bookMentorSession(mentor.id)}
                    className="w-full bg-green-600 text-white py-2 px-4 rounded-md hover:bg-green-700"
                  >
                    Забронювати сесію
                  
                
              ))}
            
          
        )}

        {activeTab === 'investments' && (
          
            Інвестиційні можливості
            
              {investments.map((investment) => (
                
                  
                    
                      
                        {investment.startupName}
                      
                      
                        Раунд {investment.round.replace('-', ' ').toUpperCase()}
                      
                    
                    
                      
                        {formatCurrency(investment.valuation)}
                      
                      Оцінка
                    
                  

                  
                    
                      
                        {formatCurrency(investment.targetAmount)}
                      
                      Ціль
                    
                    
                      
                        {formatCurrency(investment.raisedAmount)}
                      
                      Зібрано
                    
                    
                      
                        {formatCurrency(investment.minimumInvestment)}
                      
                      Мін. інвестиція
                    
                    
                      
                        {Math.round((investment.raisedAmount / investment.targetAmount) * 100)}%
                      
                      Завершено
                    
                  

                  
                    
                      
                    
                  

                  
                    Переваги інвестування:
                    
                      {investment.highlights.map((highlight, index) => (
                        {highlight}
                      ))}
                    
                  

                  
                    
                      Дедлайн: {new Date(investment.deadline).toLocaleDateString()}
                    
                     {
                        const amount = prompt(`Введіть суму інвестиції (мін. ${formatCurrency(investment.minimumInvestment)}):`)
                        if (amount && parseInt(amount) >= investment.minimumInvestment) {
                          expressInterest(investment.id, parseInt(amount))
                        }
                      }}
                      className="bg-purple-600 text-white py-2 px-6 rounded-md hover:bg-purple-700"
                    >
                      Виявити зацікавленість
                    
                  
                
              ))}
            
          
        )}

        {activeTab === 'events' && (
          
            Майбутні події
            
              
                
                  📅
                  Немає запланованих подій
                  Перевіряйте пізніше для майбутніх подій акселератора
                
              
            
          
        )}
      
    
  )
}`}

## 🎓 Мережа освітніх закладів

### Мережа випускників та студентів університету

// app/university/page.tsx

{`'use client'

import { useState, useEffect } from 'react'
import { useSession } from 'next-auth/react'

interface AlumniProfile {
  id: string
  name: string
  graduationYear: number
  degree: string
  major: string
  currentRole: string
  company: string
  location: string
  industry: string
  mentoring: boolean
  avatar: string
  achievements: string[]
}

interface StudentOpportunity {
  id: string
  title: string
  type: 'internship' | 'job' | 'research' | 'mentorship' | 'project'
  company: string
  location: string
  duration: string
  requirements: string[]
  description: string
  applicationDeadline: string
  postedBy: string
}

export default function UniversityNetwork() {
  const { data: session } = useSession()
  const [activeTab, setActiveTab] = useState<'alumni' | 'opportunities' | 'mentorship' | 'events'>('alumni')
  const [alumni, setAlumni] = useState<AlumniProfile[]>([])
  const [opportunities, setOpportunities] = useState<StudentOpportunity[]>([])
  const [loading, setLoading] = useState(true)

  useEffect(() => {
    loadUniversityData()
  }, [])

  const loadUniversityData = async () => {
    try {
      const [alumniRes, opportunitiesRes] = await Promise.all([
        fetch('/api/university/alumni'),
        fetch('/api/university/opportunities')
      ])

      const [alumniData, opportunitiesData] = await Promise.all([
        alumniRes.json(),
        opportunitiesRes.json()
      ])

      setAlumni(alumniData.alumni || [])
      setOpportunities(opportunitiesData.opportunities || [])
    } catch (error) {
      console.error('Не вдалося завантажити дані університету:', error)
    } finally {
      setLoading(false)
    }
  }

  const requestMentorship = async (alumniId: string) => {
    try {
      const response = await fetch('/api/university/mentorship/request', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({
          mentorId: alumniId,
          studentId: session?.user?.id,
          message: 'Я хотів би попросити наставництво для розвитку моєї кар\'єри.'
        })
      })

      if (response.ok) {
        alert('Запит на наставництво успішно надіслано!')
      }
    } catch (error) {
      console.error('Не вдалося надіслати запит на наставництво:', error)
      alert('Не вдалося надіслати запит на наставництво')
    }
  }

  const applyToOpportunity = async (opportunityId: string) => {
    try {
      const response = await fetch('/api/university/opportunities/apply', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({
          opportunityId,
          studentId: session?.user?.id,
          resume: 'path/to/resume.pdf' // У реальному додатку це буде завантажено
        })
      })

      if (response.ok) {
        alert('Заявку успішно подано!')
      }
    } catch (error) {
      console.error('Не вдалося подати заявку на можливість:', error)
      alert('Не вдалося подати заявку')
    }
  }

  const getOpportunityTypeColor = (type: string) => {
    const colors = {
      internship: 'bg-blue-100 text-blue-800',
      job: 'bg-green-100 text-green-800',
      research: 'bg-purple-100 text-purple-800',
      mentorship: 'bg-yellow-100 text-yellow-800',
      project: 'bg-pink-100 text-pink-800'
    }
    return colors[type as keyof typeof colors] || 'bg-gray-100 text-gray-800'
  }

  if (loading) {
    return Завантаження університетської мережі...
  }

  return (
    
      {/* Заголовок */}
      
        
          Мережа випускників університету
          
            Об'єднуємо студентів, випускників та можливості для навчання впродовж життя
          
        
      

      {/* Навігація */}
      
        
          
            {[
              { key: 'alumni', label: 'Каталог випускників', icon: '🎓' },
              { key: 'opportunities', label: 'Можливості', icon: '💼' },
              { key: 'mentorship', label: 'Наставництво', icon: '👨‍🏫' },
              { key: 'events', label: 'Події', icon: '📅' }
            ].map((tab) => (
               setActiveTab(tab.key as any)}
                className={`py-4 px-1 border-b-2 font-medium text-sm ${
                  activeTab === tab.key
                    ? 'border-indigo-500 text-indigo-600'
                    : 'border-transparent text-gray-500 hover:text-gray-700'
                }`}
              >
                {tab.icon}
                {tab.label}
              
            ))}
          
        
      

      {/* Контент */}
      
        {activeTab === 'alumni' && (
          
            Каталог випускників
            
              {alumni.map((alumnus) => (
                
                  
                    
                    
                      {alumnus.name}
                      {alumnus.currentRole}
                      {alumnus.company}
                    
                  

                  
                    
                      Випуск {alumnus.graduationYear}
                    
                    
                      {alumnus.degree} з {alumnus.major}
                    
                    
                      {alumnus.location} • {alumnus.industry}
                    
                  

                  {alumnus.achievements.length > 0 && (
                    
                      Останні досягнення:
                      
                        {alumnus.achievements.slice(0, 2).map((achievement, index) => (
                          {achievement}
                        ))}
                      
                    
                  )}

                  
                    
                      Зв'язатися
                    
                    {alumnus.mentoring && (
                       requestMentorship(alumnus.id)}
                        className="flex-1 border border-indigo-600 text-indigo-600 py-2 px-4 rounded-md hover:bg-indigo-50 text-sm"
                      >
                        Запросити наставництво
                      
                    )}
                  
                
              ))}
            
          
        )}

        {activeTab === 'opportunities' && (
          
            Можливості для студентів
            
              {opportunities.map((opportunity) => (
                
                  
                    
                      {opportunity.title}
                      
                        {opportunity.company} • {opportunity.location}
                      
                    
                    
                      {opportunity.type.toUpperCase()}
                    
                  

                  {opportunity.description}

                  
                    Вимоги:
                    
                      {opportunity.requirements.map((req, index) => (
                        {req}
                      ))}
                    
                  

                  
                    
                      Тривалість: {opportunity.duration}
                      Дедлайн: 
                        {new Date(opportunity.applicationDeadline).toLocaleDateString()}
                      
                    
                     applyToOpportunity(opportunity.id)}
                      className="bg-green-600 text-white py-2 px-6 rounded-md hover:bg-green-700"
                    >
                      Подати заявку
                    
                  
                
              ))}
            
          
        )}

        {activeTab === 'mentorship' && (
          
            Програма наставництва
            
              
                
                  👨‍🏫
                  Знайдіть свого наставника
                  
                    Зв'яжіться з випускниками, які доступні для наставництва в Каталозі випускників
                  
                   setActiveTab('alumni')}
                    className="bg-indigo-600 text-white px-6 py-2 rounded-md hover:bg-indigo-700"
                  >
                    Переглянути випускників
                  
                
              
            
          
        )}

        {activeTab === 'events' && (
          
            Майбутні події
            
              
                
                  📅
                  Немає запланованих подій
                  Перевіряйте пізніше для майбутніх подій випускників
                
              
            
          
        )}
      
    
  )
}`}

---

*Ці реальні приклади демонструють повноцінні, готові до продакшену додатки, побудовані на платформі Ring. Кожен приклад включає автентифікацію, рольовий доступ, функції реального часу та галузеву функціональність.*

*Готові створити власний? Почніть з наших [Швидких прикладів](/uk/docs/examples/quick-start) або дослідіть [Інтеграцію API](/uk/docs/examples/api-integration).*
