Сегодня у нас вышел первый официальный пост о прогрессе в разработке уже на самом сайте

Продолжу рассказывать о развитии Капибары, опенсорсном проекте, цели которого воспроизвести лучшее что было на пикабу и не наступить на их же "грабли". Первая часть здесь: https://habr.com/ru/articles/759598/. Первый официальный пост о прогрессе в разработке на новом сайте здесь: https://www.kapi.bar/post/dnevnik-razrabotki-kapibary-ot-10-xi-2023. Но обо всем по порядку.

Пару недель назад у нас стартанул полу-закрытый альфа-тест. Сейчас выдаём ранний доступ на сайт kapi.bar отважным авторам-альфатестировщикам и активным комментаторам взамен просим слать нам багрепорты и пока быть самим себе модераторами. Функционал для создания постов, комментариев и выставления оценок для них есть. Ленты "Новое", "Тренды", "Топ", "Обсуждаемое" и поиск по тегам уже работают и доступны для чтения всем желающим.

Теперь об обновлениях за последние пару недель:

???? Изображения

Теперь на сайте Капибары пользователи могут загружать изображения в посты и комментарии! Так же доступна загрузка изображений в формате apng, gif размером до 5мегабайт. Каждое загруженное изображение конвертируется на стороне бэкенда в формат webp для оптимального отображения и снижения нагрузки на инфраструктуру.

Расширенная интеграция с CDN. Мы внедрили систему автоматической выгрузки ваших изображений в CDN (Content Delivery Network).

Добавлена проверка размера изображений. Мы реализовали автоматическую проверку размера загружаемых изображений чтоб не перегружать пока ещё очень молодую и малобюджетную платформу излишним объёмом данных, что могло бы привести к замедлению работы сайта.

Внедрение плейсхолдеров для недоступных изображений. В случаях, когда изображение по каким-то причинам не загружается, мы обеспечили отображение специального плейсхолдера. Этот элемент интерфейса является визуальным индикатором того, что здесь должно быть изображение, но оно временно недоступно. Это может быть связано с различными факторами, такими как проблемы с подключением к интернету или временные неполадки на сервере. Плейсхолдеры помогают сохранить визуальную целостность поста или комментария, даже если основное содержимое в данный момент недоступно (например у вас отвалилось подключение к интернету или один из серверов CDN в данный момент не отвечает).

Репозиторий фронтенда: https://gitlab.com/vortex185330/frontend/vortex-frontend

???? Бот для Верификации через Telegram.

Внедрён специализированный бот для упрощения процесса верификации профилей через Telegram. Этот бот позволяет пользователям верифицировать свои аккаунты всего в три клика.

Интеграция создания Docker-образов в GitLab-CI. Для бота верификации добавлена поддержка создания Docker-образов в среде GitLab-CI. Это означает, что процесс развертывания и обновления бота теперь может быть полностью автоматизирован с использованием Docker-контейнеров. Внедрение GitLab-CI обеспечивает непрерывную интеграцию и доставку (CI/CD).

Репозиторий микросервиса авторизации: https://gitlab.com/vortex185330/backend/ms_auth_vortex/-/tree/main/bot?ref_type=heads

???? Комментарии

Дерево Комментариев. Мы реализовали систему управления вложенностью комментариев. Когда глубина дерева комментариев достигает 4 (для мобильных устройств) или 9 (для десктопов) уровней (в зависимости от размера экрана), мы прекращаем дополнительное смещение комментариев. Вместо этого выводится гиперссылка на родительский комментарий рядом с ником пользователя. Это предотвращает чрезмерную фрагментацию дискуссии и улучшает визуальное восприятие длинных веток обсуждения.

Заложен фундамент для противодействия ботам. Внедрили ограничение на комментирование, голосование и создание постов для пользователей, не прошедших верификацию через Telegram. Это усиление мер безопасности несколько усложнит жизнь ботоводам, ведь завести 100500 почт намного легче чем 100500 телеграм-аккаунтов. От того, что они у нас массово зарегистрируются, вреда не будет, а вот от того, что они будут клепать «нужные» посты, бурстить / топить «нужные» комментарии / посты — вред очевиден(если этого не сделать будет как на пикабу сейчас).

Человекочитаемые сообщения об ошибках. Для живых, пока еще неверифицированных пользователей, мы реализовали интуитивно понятные сообщения об ошибках при попытках комментирования, голосования или создания постов. Это улучшает пользовательский опыт, предоставляя чёткие инструкции о необходимости верификации для полного доступа к функционалу платформы.

Индикация новых и непрочитанных комментариев. Работаем над системой визуальной индикации, которая будет выделять новые и непрочитанные комментарии в ленте ответов. Это значительно упростит отслеживание активности в дискуссиях и поможет пользователям не упустить важные моменты обсуждения.

Ограничение количества медиа в комментариях. Введено ограничение на количество медиафайлов в комментариях до двух изображений. При попытке добавить третью картинку система автоматически предложит создать отдельный пост, что способствует более организованному представлению информации.

????️ Теги

Фильтрация по тегам. Разработали ленту постов с поиском по одному или нескольким тегам. В нее можно перейти как с бокового меню(вкладка "Теги"), так и напрямую из поста кликнув по тегу. В открывшейся вкладке вы можете добавить дополнительные теги по которым будет осуществляться поиск постов.

Пока только на бэкенде, но уже сделали API отдающее список популярных тегов для быстрого выбора тегов на странице поиска по тегам.
Установили лимит в 10 тегов на пост, исключая специальные теги, такие как "Своё", "Авторское" и "Телеграм". Это предотвращает перегрузку постов избыточным количеством тегов и способствует более точной категоризации контента.
Специализированные Теги "Своё" и "Авторское". Ведётся разработка нового блока в интерфейсе создания поста для выбора этих специальных тегов, включая подсказки, которые объясняют их значение. Тег "Своё" предназначен для контента, созданного пользователем лично или имеющего к нему прямое отношение. Тег "Авторское" применяется к контенту, в который пользователь вложил своё время, старания и творческие усилия.

????️ Лента "Просмотренное"

На бэкенде реализован API для управления и вывода просмотренных постов. Это означает, что теперь у нас есть бэкенд-структура, которая способна обрабатывать и передавать данные о просмотренных пользователями постах. Однако, эта функциональность пока что не интегрирована в пользовательский интерфейс и доступна только на уровне сервера.
Скрытие просмотренных постов. На бэкенде начата разработка функционала, который позволит в будущем скрывать уже просмотренные посты. Пока что этот функционал находится в стадии разработки и не доступна для пользователей.

Репозиторий монолита: https://gitlab.com/vortex185330/backend/Vortex

???? Лента "Тренды"

Сделали ленту Тренды, в которую попадают положительно оценённые пользователями посты. В данный момент алгоритм выходы в Треныд следующий: рейтинг поста больше 25 и процент положительных оценок более 80%. Сортировка в ленте "Тренды" осуществляется на основе двух ключевых параметров: процента положительных оценок и времени публикации поста.

Хотя лента "Тренды"(как и "Новое" и "Топ") визуально кажется бесконечной, посты на самом деле подгружаются постранично (пагинация). Это означает, что контент из бэкенда на фронтенд отдаётся не одновременно, а порциями. Введено ограничение в 20 постов на страницу для лент. Это решение позволяет ускорить загрузку контента и снизить нагрузку на базу данных. Казалось бы очевидное решение, но баланс между плавностью переходов и количеством постов на странице подобрали не сразу.

Существующий алгоритм сортировки в ленте "Тренды" не является конечным, и мы планируем продолжить экспериментировать для определения наиболее оптимальных критериев сортировки. Как минимум следующим шагом добавим влияние наличия тегов "Своё" и "Авторское" на упрошения выхода поста в Тренды и, после того как реализуем функционал скрытия просмотренных постов, будем проверять другие варианты сортировок.

Добавлена история сохранения постов, каждое изменение будет сохранено в отдельную версию, таким образом при содействии администрации можно откатить нежелательные правки. Даже при удалении поста, его можно будет восстановить какое-то время. В данном случае речь о самой технической возможности и о безопасности работы в кабинете модерации а не сигнал для регулярного использования этого функционала пользователями.

Кстати об "Авторском": вот эти посты https://www.kapi.bar/tags?selectedTags=[Авторское] (с положительным рейтингом) в скором времени переедут в ленту "Авторское"

????️ Редактор Постов

Лимитирование заголовка поста. Внедрено ограничение по количеству символов в заголовках постов на сайте капибары. Это необходимо для сохранения читаемости URL-адресов и предотвращения разрыва визуальной структуры ленты. Оптимизированные заголовки обеспечивают более эффективную индексацию и удобство восприятия информации.

Возможность Добавления Видео. Расширен функционал редактора за счёт возможности добавления видео. На текущий момент поддерживаются видео с платформ YouTube и Coube, добавляемые через вставку ссылок.
Прямая загрузка видеофайлов пользователями пока осложнена со стороны бюджета проекта, т. к. расчёт стоимости хранения и обработки зависит ещё и от количества просмотров.В планах — расширение функционала для поддержки других видеоплатформ, включая VK.

???? Профиль Пользователя

Аватар. Реализована функция, позволяющая пользователям загружать собственные аватарки для своих профилей.
Функция «О Себе» в профиле. Добавлена новая возможность для пользователей написать о себе в профиле. На данный момент функция сохранения информации находится в стадии доработки из-за выявленного бага, который активно исследуется командой разработчиков.

Устранение Бага с Ошибкой 404. Исправлена ошибка 404, которая возникала при попытке доступа к страницам профилей пользователей.
Проверка Уникальности Имени Пользователя. Введена проверка на уникальность имени пользователя, игнорирующая регистр букв. Это означает, что имена типа "kapibar" и "KaPiBaR" теперь считаются идентичными с точки зрения системы.

???? Прочие Улучшения

Вёрстка. Исправлена вёрстка для обеспечения корректного отображения сайта на экранах с шириной 800 пикселей.
Безопасность. Внедрено ограничение на количество запросов на логин, сброс пароля и регистрацию на уровне API. Эта мера безопасности направлена на борьбу с DDoS-атаками и другими видами злоупотреблений.

Автоматическое определение темы. Реализована функция автоматического переключения темы сайта в соответствии с настройками устройства пользователя. Это улучшение предоставляет более персонализированный и комфортный пользовательский опыт
Проведена работа по исправлению ошибок в русском языке на различных страницах сайта.
Исправление багов. Устранено более 150 мелких и значительных ошибок, обнаруженных отважными авторам-альфа-тестировщиками и сообщенных через систему репортов.

???? Баги(куда же без них).

Первых авторов мы решили немного научить в тестирование и выдать им инструмент для отправки багрепортов. Реализовали через телеграм-бота, который принимает сообщение+медиа, валидирует и отправляет их в сервисный телеграм-канал. Первые пользователи его освоили, помогали друг другу с формулированием багрепортов. На прошлой неделе мы прикрутили интеграцию телеграм бота с кликапом(используемый нами таск-трекер), теперь багрепорт от пользователя преобразуется сразу в таску в специальном разделе, откуда в дальнейшем их сортируем и обрабатываем.

И так же есть понимание что пользователи хотят видеть обратную связь со стороны разработчиков что их баги приняты, взяты в обработку или исправлены. Первое время решали это через ручную пересылку в топик "Пофикшенные баги".

Часто мелкие баги быстрее исправить «налету», чем добавлять в таски, описывать, пересылать и уведомлять. И поэтому сейчас мы работаем над автоматизацией, чтобы каждый найденный вами баг не остался без обратной связи от команды.

И прямо сейчас работаем над обратным процессом. Т. е., когда задача отмечается как выполненная, будет отправляться уведомление обратно в Телеграм с обновлённым статусом.Также есть баг-репорты, которые не являются багами. Например, когда проблема не на сайте, а в куках пользователя. В таких случаях разработчик будет писать комментарий к задаче с инструкцией, что нужно сделать, чтобы проблема прошла, а бот будет отправлять этот комментарий пользователю.

???? Огромная Благодарность нашим Авторам-Альфа-Тестировщикам!

Мы не можем упустить возможность выразить нашу глубокую благодарность всем альфа-тестировщикам, которые помогли нам обнаружить и устранить баги на нашей платформе. Ваша обратная связь была неоценимой, и мы благодарны за каждый отправленный вами баг-репорт!

???? Особая Благодарность Десяти Самым Активным Тестировщикам:

NoAdO – 66 баг-репортов
Wtagn25 – 38 баг-репортов
DrMegabyte – 29 баг-репортов
vita – 28 баг-репортов
vervolph – 24 баг-репортов
Sergej_Serov – 22 баг-репортов
mik_s1d – 19 баг-репортов
Archi – 18 баг-репортов
jewellerpotato – 17 баг-репортов
Eisenporn – 16 баг-репортов

???? Благодарим всех остальных альфа-тестировщиков отправивших нам репорты об обнаруженных багах:

Blood, Yarilo23, Rofs, UglyElf, gambitushka, userfortest, ZenitTTLMir1B, Xrenotik, LinDess, Marta, Lazolvo, olvik, Innokenti4, uk_kate24, Dnocompany, Unionsquare, L0z4, Kvasnik, Xena, rammdarkfunny, Tiamin, Jugabut, Dr.Hannibal, BulkaSmaslow, Kyrillbeisel, KonstantyPL, findeler, aice4, gulyashbezpiva, appossumoid, FreeDaSw, Wesker, alexvektor, Dildiy, Cloud, oriaraniar, BabudaiAga, VODKA5665, WandWanderer, PaulHirsch, Hokum62, Nojnichki, Bespiril, indie_dev_01, Beer3erk, BeerFather, dones, stormspeller, prmn, ITMan96, Custom_KseniEv, loonyloon, Darti163, nameless.second, Shady311, Pilirom, veterinar, lenanexman, socialware, zzaec, kritbis, kusokcheloveka, statusspb, Bowjob, ctulhu31, SergeyRY, R.Melvin, Kitsu-NeshKaa, Rilwing, Ahremkin, ibraman, Marb.Ivanna, SexFox, camelos, HugReed, Hippopocat, Chaika312, hunterpo, Exfaded, SIGILLITE, chief, tanur_orican, gelevaya, ally_me, Natt, Hegny, shaehl, EpicMorg, Vojdelenec, margent, timur_bv, CircusBirdEli, Aragorn, Phyros, HARDiNA, Kisati, SarcasticImp, Akyndro, V27S, ivanisenko, LeSpectateur, lostseaman, No_Name, Bertolucci, vladonlink, OldKatso, Vanok, derBeobachter, Born_Sesh.

Записаться на альфа-тест: https://t.me/new_old_pikabu/548368/548369

Помочь в разработке проекта: https://t.me/new_old_pikabu/2680/631553

Репозиторий проекта: https://gitlab.com/vortex185330/

Основной сайт: https://www.kapi.bar/

Еще много всего предстоит сделать, но уже есть что посмотреть и пощупать