🖼Portfolio built with Nuxt and Nuxt Content

Overview

Portfolio 2022

🖼 My new portfolio built with nuxt and @nuxt/content

Deployment License


⚒️ Tech stack

🍱 Adding content

Projects

Add a new .md file in /content/projects/ and follow the same patern as the other projects. Add images in /public/images/projects/.

Skills

Add a new item in /content/skills.yaml and an image in /public/images/skills/.

Running locally

# Installation (recommended for nuxt3)
pnpm i --shamefully-hoist

# Development server
pnpm dev

Add a .env file with the following content:

NUXT_PUBLIC_SPOTIFY_CLIENT_ID=...
NUXT_PUBLIC_SPOTIFY_CLIENT_SECRET=...
NUXT_PUBLIC_SPOTIFY_REFRESH_TOKEN=...

🎸 Get a new Spotify refresh token

Request user authorization

Go to the following url:

https://accounts.spotify.com/authorize?client_id=&response_type=code&redirect_uri=http://localhost:3000/&scope=user-read-currently-playing%20user-top-read

You will be redirected to localhost width a code in the url params.

Request access and refresh tokens

Encode the following in base64 using this website:

:

Then run the following in a terminal with the encoded string and the code:

" -d grant_type=authorization_code -d code= -d redirect_uri=http://localhost:3000/ https://accounts.spotify.com/api/token">
curl -H "Authorization: Basic " -d grant_type=authorization_code -d code=<code> -d redirect_uri=http://localhost:3000/ https://accounts.spotify.com/api/token

You will get a response with a refresh token. Save it in an environment variable. It will never expire.

📄 License

MIT © Colin Lienard

You might also like...
My personal website built with Nuxt.js, TypeScript and Tailwind CSS✨

My personal website built with Nuxt.js, TypeScript and Tailwind CSS✨

This is nuxt invoice app using nuxt.js and firebase
This is nuxt invoice app using nuxt.js and firebase

Nuxt Invoice App Build Setup # install dependencies $ npm install # serve with hot reload at localhost:3000 $ npm run dev # build for production and

nuxt-fullpage is a nuxt module for creating fullscreen page scroll fast and simple.

Nuxt fullpage Nuxt module for creating fullscreen page scroll fast and simple. Demo online Table of contents Installation Usage Options Contributing I

WordPress module for Nuxt.js with full support for SSR and Nuxt.js PWA module.

WordPress module for Nuxt.js with full support for SSR and Nuxt.js PWA module.

Check trending anime based on anitrendz.net site. Built using nuxt

animetrend Demo: here Build Setup # install dependencies $ npm install # serve with hot reload at localhost:3000 $ npm run dev # build for productio

A basic crud built with nuxt.

nuxt-app Build Setup # install dependencies $ yarn install # serve with hot reload at localhost:3000 $ yarn dev # build for production and launch se

To do list app built on nuxt.js

To do list app built on nuxt.js

Youtube UI clone website built with Nuxt.js, TailwindCSS
Youtube UI clone website built with Nuxt.js, TailwindCSS

Youtube clone with Tailwind CSS and Nuxt 3 Development process preview Youtube preview Setup Make sure to install the dependencies yarn install Develo

A modern self-hosted monitoring tool completely built on the new Nuxt 3 💚

A modern self-hosted monitoring tool completely built on the new Nuxt 3 💚

Owner
Colin Lienard
Student at the University of La Rochelle, wishing to become front end developper and webdesigner
Colin Lienard
A lightweight Nuxt template to build a Markdown driven website. Powered by Nuxt Content, TailwindCSS and Iconify.

A lightweight Nuxt template to build a Markdown driven website. Powered by Nuxt Content, TailwindCSS and Iconify.

Sébastien Chopin 470 Jan 2, 2023
A simple multipage and responsive Nuxt.js & TailwindCSS portfolio theme with dark mode.

Nuxt.js & TailwindCSS Portfolio - With Dark Mode A simple portfolio starter theme built with Nuxt.js and TailwindCSS. This is the Nuxt version of the

Nangialai Stoman 42 Dec 3, 2022
Example Jamstack app with Nuxt 3, Content, and Storyblok deployed to Vercel

Nuxt 3 Minimal Starter Look at the nuxt 3 documentation to learn more. Setup Make sure to install the dependencies: # yarn yarn install # npm npm ins

Jakub Andrzejewski 2 Nov 4, 2022
A serverless blog powered by Nuxt/Content + TailwindCSS by TFD

A serverless blog powered by Nuxt/Content + TailwindCSS by TFD Features This is a serverless blog powered by @nuxt/content and TailwindCSS with integr

tfd-ed 22 Nov 23, 2022
⚡ A portfolio for developers with a blog powered by Notion

nuxt-portfolio-dev a portfolio for developers w/ a blog powered by Notion Demo: https://aymaneMx.com Features ?? minimal and clean portfolio ?? the da

Aymane Mimouni 120 Dec 29, 2022
Website portfolio made by Matej Bačo

Portfolio by Matej Bačo Build Setup # install dependencies $ yarn install # serve with hot reload at localhost:3000 $ yarn dev # build for productio

Matej Bačo 3 Sep 19, 2022
Responsive ecommerce template built with Vue.js and Nuxt.js

Vuemmerce - Ecommerce Template Responsive ecommerce template built with Vue.js and Nuxt.js Installing # clone repository git clone https://github.com/

null 0 Nov 14, 2021
SkimpleComponents is my personal components library built on Bootstrap and designed to be used with Nuxt.

SkimpleComponents SkimpleComponents is my personal components library built on Bootstrap and designed to be used with Nuxt. Why this library ? Bootstr

Hugo Delaunay 0 Jul 26, 2022
Simplistic quote saving web app, built with Nuxt and Prisma

QuoteDB Started for use in a friend group, this project is both a very minimal quote DB and a nice PoC for Nuxt3 + Prisma with an API and JWT authenti

Reinier van der Leer 8 Sep 2, 2022
Nefa - Free landing page template built using nuxt and tailwindcss

NEFA Landing Page Free landing page template built using Nuxt 2 and Tailwindcss

Rafli Surya P 112 Dec 28, 2022