Разработка веб-приложения социальной сети Friends&Family

1.

Разработка веб-приложения
социальной сети Friends&Family
Дипломный проект
Студент: Алахов Богдан Олегович | Группа: П-42
Гомельский торгово-экономический колледж Белкоопсоюза | 2026

2.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Актуальность темы
Массовые социальные сети не подходят для
Необходимость контролируемого доступа и
приватного общения в узких кругах
защиты персональных данных
Соответствие законодательству РБ о
Потребность в закрытых платформах для семьи,
персональных данных (Закон № 99-З)
друзей и учебных групп
Закрытый доступ
Friends&Family — Дипломный проект
Инвайт-система
Соответствие закону РБ
Приватное общение
2 / 14

3.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Цель и задачи
Цель: Спроектировать и реализовать полнофункциональную веб-социальную сеть с закрытой регистрацией
Задачи:
1
Анализ аналогов и формирование требований
4
Лента публикаций, профили, поиск, сообщения
2
Проектирование архитектуры клиент–сервер
5
Административная панель
3
Модуль аутентификации с инвайт-системой
6
Политика конфиденциальности (Закон Р Б № 99-З)
Этапы работы:
Анализ
Friends&Family — Дипломный проект
Проектирование
Разработка
Тестирование
Защита
3 / 14

4.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Объ ект, предмет и методы исследования
Объ ект исследования
Предмет исследования
Методы
Процесс разработки веб-приложения
Методы и средства создания
Анализ существующих решений,
социальной сети
закрытой социальной сети с
проектирование системы,
контролируемым доступом
программирование, тестирование
Методол огия разработки
Анал из
Проектирование
Программирование
Тестирование
Изучение аналогов и формирование
Архитектура клиент–сервер и
Реализация на React + REST API
Проверка функционала и
требований
компоненты
Friends&Family — Дипломный проект
безопасности
4 / 14

5.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Анал из аналогов
Критерий
VK
Instagram
Telegram
Friends&Family
Закрытый доступ
Нет
Нет
Частично
Да
Инвайт-система
Нет
Нет
Нет
Да
Админ-панель
Нет
Нет
Нет
Да
Соответствие закону Р Б
Нет
Нет
Нет
Да
Вывод: Friends&Family — единственное решение среди рассмотренных аналогов, которое сочетает закрытую регистрацию
по инвайтам, административ ную панель и полное соответств ие законодательству РБ о персональных данных.
Friends&Family — Дипломный проект
5 / 14

6.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Требования к системе
Функциональные требования
• Аутентификация с инвайт-кодами
• Лента публикаций с медиа
• Профили пользователей
• Поиск по критериям
Нефункциональные требования
Б езопасность
Хеширование паролей, HTTPS, JWT
Производител ьность
Адаптивный дизайн, быстрая загрузка
• Личные сообщения
• Система уведомлений
• Административная панель
Локал изация
Поддержка русского и английского языков
Соответств ие законодател ьству
Политика конфиденциальности по Закону РБ № 99-З
Friends&Family — Дипломный проект
6 / 14

7.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Архитектура системы
PostgreSQL (Neon)
Хранение пользователей, публикаций,
сообщений, уведомлений
Клиент (Browser)
REST API
React SPA
Backend сервер
Развёрнут на Vercel
Обработка запросов
Vercel Blob Storage
Хранение медиафайлов: фото, GIF, видео (до
4,5 МБ)
Компоненты системы:
Auth
Feed
Friends&Family — Дипломный проект
Profile
Search
Chat
Notifications
Admin
7 / 14

8.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Технологический стек
React (SPA)
REST API
Neon PostgreSQL
SPA с быстрым рендерингом и адаптивным
Backend-интерфейс для обмена данными
Облачная реляционная база данных с
дизайном
между клиентом и сервером
автоматическим масштабированием
Vercel Blob
Безопасность
Локализация RU/EN
Облачное хранилище для медиафайлов:
HTTPS, хеширование паролей,
Поддержка двух языков интерфейса с
фото, GIF, видео до 4,5 МБ
JWT/localStorage для авторизации
возможностью переключения
Friends&Family — Дипломный проект
8 / 14

9.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Демонстрация интерф ейса — Лента и проф иль
Страница входа в систему
Форма регистрации с инвайт-кодом
Реал изовано: Лента публикаций с фото/GIF /видео (до 4,5 МБ), комментарии, отметки, фильтры по подпискам и дате. Профиль: аватар, имя, описание,
дата рождения, счётчики подписчиков/подписок/публикаций, сетка постов.
Friends&Family — Дипломный проект
9 / 14

10.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Демонстрация интерф ейса — Сообщения, поиск, админка
Личные сообщения
Поиск пользователей
Административ ная панель
• Список диалогов
• По имени и фамилии
• Создание инвайт-кодов
• Переписка 1 на 1
• По стране и городу
• Управление пользователями
• Запуск чата из профиля
• По диапазону дат рождения
• Модерация публикаций
• Мгновенная доставка
• Переход в профиль из результатов
• Удаление контента
Рекомендация
Рекомендуется вставить скриншоты с демо-версии приложения:
https://client-zeta-azure.vercel.app
Для получения скриншотов ленты, профилей, чатов и админ-панели необходимо авторизоваться в системе.
Friends&Family — Дипломный проект
10 / 14

11.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Безопасность и защита данных
Хеширование и HTTPS
Закрытая регистрация
Пароли и секретные слова хешируются. Все соединения
Доступ только по одноразовым инвайт-кодам, генерируемым
защищены протоколом HTTPS.
администратором.
Политика конфиденциальности
Трансграничная передача
Разработана в соответствии с Законом РБ № 99-З о защите
Данные хранятся на Vercel/Neon с согласия пользователя на
персональных данных.
трансграничную передачу.
Закон РБ № 99-З
Политика конфиденциальности включает: цели обработки персональных данных, права субъектов, сроки хранения, меры защиты, порядок
трансграничной передачи. Пользователи дают согласие при регистрации через специальный чекбокс.
Friends&Family — Дипломный проект
11 / 14

12.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Результаты работы
Работающее веб-приложение, развёрнутое в облаке (Vercel)
Система личных сообщений и уведомлений
Полный цикл: регистрация → публикации → общение → админ
Админ-панель для управления пользователями и контентом
Аутентификация с инвайт-системой и восстановлением пароля
Документ о защите персональных данных
Лента публикаций с медиа, комментариями и отметками
Адаптивный дизайн и локализация (RU/EN)
Приложение разв ёрнуто и дост упно онл айн
https://client-zeta-azure.vercel.app
Статус: Работает | Платформа: Vercel
Friends&Family — Дипломный проект
12 / 14

13.

Введение
Анализ
Архитектура
Демо
Безопасность
Результаты
Перспективы развития
Push-уведомления
Групповые чаты
Мгновенные push-уведомления в браузере о новых сообщениях,
Возможность создания групповых чатов для коллективного общения
подписчиках, комментариях и отметках — без необходимости
семьи, друзей или учебных групп с администрированием.
обновлять страницу.
Мобильное приложение
Расширенная модерация
Нативные приложения для iOS и Android с полным функционалом
Автоматическая модерация контента с использованием ИИ,
социальной сети, оптимизированные для мобильных устройств.
фильтрация нежелательных материалов и расширенные
инструменты администратора.
Friends&Family — Дипломный проект
13 / 14

14.

Спасибо за в нимание!
Готов ответить на вопросы
Friends&Family Social Network
client-zeta-azure.vercel.app