mybibliography.ru – сайт для поиска источников для научных и учебных работ и оформления ссылок на источники по ГОСТ. Цель проекта — сделать поиск информации простым и эффективным, а работу с источниками — доступной и удобной.
- React Router – навигация в приложении. Routes релизованы в компоненте App.
- Formik, Yup – валидация всех форм на фронтэнде. Пример: форма заказа.
- Redux – создание конфигурации глобального состояния.
- Redux Toolkit Query – работа с запросами к API сайта. Конфигурация асинхронных запросов описана в apiSlice.
- Chart.js, react-chartjs-2 – создание диаграмм. Использованы в компоненте круговой диаграммы и компоненте столбчатой диаграммы.
- React Bootstrap. Использован при создании компонента модального окна, навигационной панели, компонента карусели.
- Docx, FileSaver.js – создание и загрузка .docx файлов. Использован при разработке хука загрузки документа
- react-helmet-async – формирование метатегов. Компонент SEO, использованный на всех страницах сайта.
- react-cookie – работа с Cookie.
- Django REST framework – создание API для взаимодействия фронтенда на React с бэкэндом на Django.
- django-remote-forms – сериализация форм Django для преобразования в JSON и предоставления доступа через API для рендеринга форм на клиенте.
- Jinja2 – шаблонизация схем библиографических описаний.
- yookassa – создание объекта платежа при формировании заказа списка литературы.
Через сайт можно оформлять ссылки на книги, статьи, сайты и другие источники. Все ссылки оформляются по ГОСТ Р 7.0.100–2018 «Библиографическая запись. Библиографическое описание. Общие требования и правила составления». Этот ГОСТ является обязательным к использованию при составлении списков литературы к курсовым работам, дипломам, докладам и другим работам.
Логика составления библиографических описаний описана в файле abstract_models.py.
Полный список типов документов, на которые можно оформить ссылку.
Оформленные пользователем ссылки добавляются в список литературы
Список можно скопировать, загрузить в формате .docx, дополнить новыми ссылками, а также сортировать ссылки в нем по алфавиту или времени добавления. Чтобы начать работу с новым списком, предыдущий нужно очистить. Все созданные списки можно посмотреть в личном кабинете.
Когда база данных оформленных ссылок превысила 100 000, в проект добавилась функция поиска по ней. Поиск проводится по ключевым словам запроса, исключая предлоги, союзы, междометия. Так как по некоторым запросам результатов может быть очень много, в целях оптимизации рендеринга найденные библиографические ссылки выводятся по 100 за раз с возможностью подгрузки оставшихся до тех пор, пока все результаты по поисковому запросу не будут загружены целиком.
Воспользоваться функцией поиска можно на главной странице сайта, либо на странице поиска
Для приема платежей реализована интеграция сайта с платёжным провайдером ЮKassa. Интеграция была проведена с использованием API ЮKassa. Для валидации данных формы заказа на стороне клиента использованы Formik и Yup.
Форма для ввода данных о заказе
Для аутентификации используются сессии Django. Данные сеанса пользователя хранятся на стороне сервера, а файлы cookie содержат session ID для авторизации на клиенте.
В Личном кабинете пользователь может посмотреть все созданные им списки литературы и скопировать их; посмотреть свои последние 50 поисковых запросов и вернуться к поиску по любому из них; посмотреть информацию о созданных им заказах – введенные данные, статус, срок выполнения.
На странице О сайте представлена статистика количества оформленных ссылок и поисковых запросов, реализованных через сайт, в реальном времени. Компоненты диаграмм созданы с помощью библиотеки Chart.js.
Все элементы сайта доступны через управление с клавиатуры. Используйте Tab для передвижения по элементам и Shift+Tab для обратного передвижения. В разработке сайта использована семантическая верстка.