Project to try out the Spotify API and help users see where their true interests lie. It shows a user's Spotify stats in a bunch of neat ways.
A lot of interesting things to figure out with this project. Hand designed in Figma and styled from the ground up with Styled Components solely because I felt like I didn't need a whole heavy css framework for something so relatively simple, y'know? Plus with design, if you don't use it you lose it (that's probably not actually true) and I saw it as a neat opportunity to brush off the skills.
The main things I used in this project are:
- Styled Components
- Spotify API
- Serverless Functions
As mentioned above I used React to build out the UI/functionality, and more specifically:
- Context API for state management
- Fetch API to grab user data from Spotify
- React Router for navigation/routing
There's also a custom hook in there. Neat.
One of the more interesting things was having to rewrite the node.js server I'd initially used for Spotify authorization as a few serverless functions instead, and I even used the Netlify CLI for development which was surprisingly handy and makes me much more willing to use it in the future.
Finally, I deployed the app directly from Github with Netlify.
You can see the app at https://statlify.netlify.app.
Design, Front-end Development, Back-end Development
VSCode, Figma, Spotify API, Netlify CLI
React, Typescript, Styled Components, Serverless Functions, Netlify View Github Repo