Узнайте, как создать полнофункциональное веб-приложение для визуализации персонализированных данных Spotify с помощью Node.js, React, Styled Components и Spotify Web API.
Вам когда-нибудь было интересно посмотреть, как выглядят ваши данные Spotify? Как каждый год составляется сводка о ваших привычках ? Или даже хотели посмотреть метаданные любимых треков? К счастью, Spotify предоставляет массу интересных данных, подобных этим, доступной через Spotify API.
Почему этот курс
Если вы заинтересованы в доступе к персонализированным данным Spotify, как мы упоминали выше, Spotify требует, чтобы ваше приложение было авторизовано. А чтобы получить авторизацию, вам нужно реализовать что-то под названием OAuth. Этот курс кратко и легко проведет вас через каждый этап процесса OAuth. В отличие от руководств YouTube, которые охватывают только несколько концепций и оставляют вас с недоделанными репозиториями GitHub, мы рассмотрим все, от объяснения того, что такое REST API, до реализации потока OAuth Spotify и получения данных из Spotify API в хуках React. Разделенный на семь модулей, каждый урок включает ясные, подробные объяснения и полные примеры кода. К концу курса у вас будет приложение, развернутое в Интернете, которым вы сможете поделиться с друзьями и добавить в свое портфолио.
Что мы построим
Во внешнем интерфейсе мы создадим профессиональный, отзывчивый пользовательский интерфейс с помощью React, React Hooks и популярной библиотеки CSS-in-JS, Styled Components. Мы будем извлекать данные из Spotify API, используя современные методы async / await ES6, и отображать эти данные в привлекательной форме.
На backend стороне мы изучим основы REST API, HTTP-запросов и OAuth. Мы приподнимем завесу о том, как авторизовать приложение с помощью Spotify, а затем создадим сервер Node с платформой Express для обработки наших запросов на аутентификацию. Наконец, мы развернем наше приложение в Интернете с помощью Heroku.