• Spotify Playlists Search App
  • [pt-BR]
  • Funcionalidades
    • Tema escuro
    • Filtros de Pesquisa de Playlists
    • Pesquisa de Playlists
  • Instruções para instalação
    • Ambiente de Desenvolvimento
    • Instalando as dependências do projeto
    • Como executar o projeto
  • Sobre as decisões tomadas
  • [en-US]
  • Features
    • Dark Theme
    • Playlists Filters
    • Playlists Search
  • Installation instructions
    • Development env
    • Installing the dependencies
    • How to start the project
  • About the decisions taken

Um App React Native para listar e pesquisar playlists na Web API do Spotify

O componente <ThemeToggler /> é exibido na tela de Login e tem a responsabilidade de alternar entre o tema escuro e claro.

Nota: Por padrão o app abrirá com o tema escuro

Pesquisa por gêneros

Pesquise as playlists criadas de seu artista favorito.

Por gentileza, siga as intruções descritas na documentação oficial do Expo para preparar seu ambiente de desenvolvimento.

Atenção: O projeto foi configurado utilizando o Yarn (v1.22.18) e as versões dependências estão fixas no arquivo yarn.lock.

Para instalar as dependências utilize o comando:

yarn

Android

Após abrir o emulador do AVD ou Genymotion, ou conectar seu dispositivo Android via USB (com modo de depuração ativado), execute o seguinte comando no terminal:

yarn android

iOS

Execute o seguinte comando no terminal:

yarn ios

Porque usar Redux em um projeto tão pequeno?

Por se tratar de um projeto de avaliação, decidi implementar Redux e Redux Sagas para demonstrar a abordagem que eu escolheria caso estivésse criando uma aplicação do mundo real.

Sinto que devo citar que em projetos menores, a própria Context API supriria basicamente todas as necessidades de compartilhamento de estado, inclusive nesse projeto.

Por que utilizar o Native Base ao invés de criar os componentes com styled-components ou StyleSheet.create?

Como o principal desafio do projeto era estudar e implementar a Web API do Spotify, decidi implementar o Native Base para agilizar o desenvolvimento das telas.

A React Native App that allows you to list and search Spotify Playlists using Spotify's Web API

The component <ThemeToggler /> shown on Login screen is responsable for toggling between the dark and light themes.

Note: The app will open with dark theme by default.

Search by genre.

Search created playlists from your favorite artists.

Please follow the instructions on the Official Expo Documentation for preparing your dev env.

WARNING: This project was configured using Yarn (v1.22.18) and the deps versions are locked on yarn.lock file.

Run the following command to install the dependencies:

yarn

Android

After installing the AVD emulator or Genymotion or even connecting your Android device via USB (with debugging mode enabled), execute the following command on your terminal:

yarn android

iOS

Run the following command on your terminal:

yarn ios

Why to use Redux in such a small project?

Since this is a test project, I have decided to implement Redux and Redux Sagas to demonstrate how I would aproach if this was a real world app.

It's worth mentioning that Context API would be enough to cover all use cases in smallers projects (including this one).

Why to use Native Base instead of styled-components or StyleSheet.create?

Since the biggest challenge with this project was to understand and implement Spotify's Web API, I have decided to use Native Base for a faster development.