Skip to content

marta-probierz/spotify

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

53 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Spotify MORE

spotify

Autorka:

Cel projektu

Celem projektu było dostarczenie aplikacji „Spotify MORE” pozwalającej użytkownikom na słuchanie oraz wyszukiwanie muzyki za pośrednictwem konta na Spotify.

Działanie aplikacji

Strona główna

Na głównej stronie znajduje się kilka elementów: pasek narzędzi, część do logowania oraz karuzela.

Zrzut ekranu 2022-07-29 o 12 24 28

- Pasek narzędzi

Zawiera on dwie funkcje: przełączanie na dark bądź light mode oraz zmiana języka. Języki dostępne na stronie to angielski oraz polski.

Zrzut ekranu 2022-07-29 o 12 26 53

- Logowanie

Z lewej strony użytkownik może znaleźć przycisk LOGIN, dzięki któremu zostanie zalogowany do swojego konta za pośrednictwem Spotify.

- Karuzela

Z prawej strony znajduje się karuzela, która zawiera krótką instrukcję, dotyczącą działania strony.

Player

Po pomyślnym zalogowaniu się, użytkownik zostaje przeniesiony na stronę Player.

Zrzut ekranu 2022-07-29 o 12 28 26

Znajduje się tu pasek, umożliwiający wpisanie szukanej piosenki, miejsce, w którym pojawią się pasujące wyniki oraz odtwarzacz.

Zrzut ekranu 2022-07-29 o 12 28 47

Po kliknięciu na daną piosenkę, zostanie ona odtworzona, a także pojawi się jej tekst.

Zrzut ekranu 2022-07-29 o 12 29 19

Responsywność

W projekcie została zrealizowana responsywność stron.


API

Spotify Web API Node

Dodatkowe informacje

Została również użyta biblioteka Prettier, służąca do formatowania kodu. Niniejsza biblioteka jest świetnym narzędziem, który wyłapuje błędy składni, automatycznie poprawia linie kodu według zdefiniowanej konfiguracji.

Technologie użyte w projekcie:

  1. JSX
  2. React
  3. Sass
  4. Axios
  5. i18next
  6. Infinite React Carousel
  7. React Spotify Web Playback
  8. React Switch
  9. Express.js

Narzędzia pomocnicze

  1. Visual Studio Code
  2. Yarn

Instalacja

Uruchomienie projektu:

Aby uruchomić aplikację na lokalnej maszynie, wykonaj następujące kroki:

  1. Sklonuj repozytorium.
  2. Otwórz je w ulubionym edytorze.
  3. Zainstaluj zależności za pomocą komendy: yarn.
  4. Wystartuj serwer za pomocą komendy: yarn start.

Aplikacja będzie dostępna pod adresem: http://localhost:3000/

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published