The first version of thiagoafonso.com hosted with Firebase and built with React

Hello!

The purpose of this project is to introduce myself into development and test some of the things I learned about React + html/css/js + programming in general.

This was my first fully commited attempt to create a website from start to finish.

This process took about 2-3 months with a lot of different conflicting design ideas but i'm happy with what I built!

There's a lot to do still but I'm satisfied enough to start a new project.

I intend to keep updating this project or make new versions with different frameworks and libraries.

this website uses a ton of cool open-source projects and other tools:

• React - front-end JavaScript library for building user interfaces based on UI components.
• Phosphor icons - flexible icon family, super easy to work with!
• Vite - hmr + easy build process, made everything easier
• Spotify for developers - easy to use and awesome to build creative tools with
• + a lot more

Spotify's API

import { CLIENT_ID, REFRESH_TOKEN } from './API_KEYS';

const headers = {
	headers: {
		'Content-Type': 'application/x-www-form-urlencoded',
		Authorization: 'Basic ' + CLIENT_ID,
	},
};
const data = {
	grant_type: 'refresh_token',
	refresh_token: REFRESH_TOKEN,
};

let res = axios
	.post('https://accounts.spotify.com/api/token', qs.stringify(data), headers)
	.then((res) => res.data.access_token);

const NEW_ACCESS_TOKEN = 'Bearer ' + (await res);

const resSpotify = await axios.get(
	'https://api.spotify.com/v1/me/player/recently-played',
	{
		params: {
			limit: '1',
		},
		headers: {
			Accept: 'application/json',
			'Content-Type': 'application/json',
			Authorization: NEW_ACCESS_TOKEN,
		},
	}
);