Разработали сайт подкаста и RSS Feed на GatsbyJS

Разработали сайт для подкаста на GatsbyJS. Задача была создать быстро загружающийся минималистичный сайт с фокусом на выпуски. Каждый эпизод получил отдельную страницу, удобный плеер и текстовую расшифровку.
podcast_episode
podcast_app

Основой сайта стал архив всех выпусков. Мы выстроили понятную структуру, в которой пользователь может быстро просматривать прошлые эпизоды, открывать нужный выпуск и переходить между страницами без ощущения, что он покидает пространство подкаста.

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

Отдельно мы добавили расшифровки выпусков в текст. Для этого был настроен процесс транскрибации через AI Whisper: аудиофайлы автоматически преобразуются в читаемый текст, который затем можно публиковать на странице выпуска. Это делает подкаст доступнее, улучшает SEO и позволяет пользователю знакомиться с содержанием даже без прослушивания аудио.

Также был реализован podcast feed, чтобы проект работал не только как сайт, но и как полноценный источник подкаста для внешних платформ таких как Spotify, Apple Podcasts, CastBox итд. Структура рассчитана на дальнейшее масштабирование и регулярное добавление новых выпусков.

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

Update cookies preferences
WhatsApp Получить консультацию