PageSpeed Insights Score

Live Preview

A multilingual personal website with a progressive web app that you can share your projects and latest activities, made with Nuxt 3 & WindiCSS. For further instructions about Nuxt, view docs.

Setup

1. Clone the repository

git clone https://github.com/MehmetAliKOCAL/PersonalWebsite

2. Install the dependencies

# Open the folder
cd PersonalWebsite

# yarn
yarn install

# npm
npm install

# pnpm
pnpm install

3. Create environment variables

To get the project up and running, you need to use environment variables. Create a .env file in the root directory of the project where app.vue is located, then add these variables inside the file:

STEAM_WEB_API_KEY='YOUR_STEAM_WEB_API_KEY (e.g. 7841933XB06XXX45XXX0F613XXXE3FF)'
STEAM_ID='YOUR_steamID64(DEC) (e.g. 76561185265169193)'
LASTFM_USERNAME='YOUR_LASTFM_USERNAME (e.g. JohnDoe)'
LASTFM_WEB_API_KEY='YOUR_LASTFM_WEB_API_KEY (e.g. 605d1317e47eb121d3bc6db1a320d187)'
GOOGLE_ANALYTICS_ID="YOUR_GOOGLE_ANALYTICS_ID (e.g. G-XXXXXXXXXX)"

To get your Steam Web API key, visit here.
To find your SteamID64 (DEC), visit here.
To get your LastFM API key, visit here.
If you don’t want Google Analytics, just don’t give it an ID to skip loading its scripts.

Run the Development Server

Start the development server on http://localhost:3000

npm run dev

Production

1. Build the application for production

npm run build

2. Locally preview production build

npm run preview

Check out the Nuxt deployment documentation for deployment instructions. Also don't forget to modify the content of nuxt.config.ts (meta tags, etc.) to your needs before deploying.