/website

Personal website, or intended glorify archive. Confusing stuff that I put together ๐Ÿง

Primary LanguageTypeScript

Banner

vankythien.dev, an attempt at web dev, and realized I sucks.
Using Next.js 13, enhanced with Tailwind, powered by TypeScript, and seamlessly deployed via Vercel.

CodeFactor

Preview โ˜๏ธ

Banner

Getting Started ๐ŸŽฒ

Set up the environment variables file with the following variables.

  # https://api.lanyard.rest/v1/users/user_id
  BASE_URL=http://localhost:3000

  NEXT_PUBLIC_DISCORD_ID=
  NEXT_PUBLIC_EMAIL=

  GITHUB_ID=Iv1.
  GITHUB_SECRET=

  GOOGLE_CLIENT_ID=
  GOOGLE_CLIENT_SECRET=

  DATABASE_URL=

  NEXTAUTH_URL_INTERNAL=http://10.240.8.16
  NEXTAUTH_URL=http://localhost:3000
  NEXTAUTH_SECRET=
  • Get GITHUB_ID and GITHUB_SECRET from Github OAuth

  • Get GOOGLE_CLIENT_ID and GOOGLE_CLIENT_SECRET from Google OAuth

  • GET NEXTAUTH_SECRET from NextAuth

    • OR runt the command openssl rand -base64 32 in the CLI
    • OR access to this website NextAuth

Next, run in the CLI (root folder) โ˜ข๏ธ

  # install dependencies
  npm install

  # run prisma CLI
  npm prisma run

  # run the development server
  npm run dev
  # or
  yarn dev
  # or
  pnpm dev

Open http://localhost:3000 with your browser to see the result.

Features โœ’๏ธ

  • Discord Presence
  • Google OAuth
  • Github OAuth
  • Lanyard API
  • Guestbook
  • Kbar
  • useSound
  • Blog (TBD)
  • Reponsive (breh)

Project Folder Structure ๐Ÿ’€

Welcome to the project's folder structure! Below is an organized representation of the directories and subdirectories:

## prisma 
โ”œโ”€โ”€ ๐Ÿ“„ schema.prisma

## public
โ”œโ”€โ”€ ๐Ÿ“‚ bg
โ”œโ”€โ”€ ๐Ÿ“‚ fonts
โ”œโ”€โ”€ ๐Ÿ“‚ icons
โ”œโ”€โ”€ ๐Ÿ“‚ icons-json
โ”œโ”€โ”€ ๐Ÿ“‚ images
โ”œโ”€โ”€ ๐Ÿ“‚ mouse
โ”œโ”€โ”€ ๐Ÿ“‚ rpg
โ””โ”€โ”€ ๐Ÿ“‚ sounds

## src code
โ”œโ”€โ”€ ๐Ÿ“ app
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ about
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ api
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ dashboard
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ contact
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ guestbook
โ”‚   โ””โ”€โ”€ ๐Ÿ“ projects
โ”œโ”€โ”€ ๐Ÿ“ components
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ about-me
โ”‚   โ”‚   โ””โ”€โ”€ ๐Ÿ“ qa
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ common
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ dashboard
โ”‚   โ”‚   โ””โ”€โ”€ ๐Ÿ“ ...
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ about-me
โ”‚   โ”‚   โ””โ”€โ”€ ๐Ÿ“ ...
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ footer
โ”‚   โ”‚   โ””โ”€โ”€ ๐Ÿ“ ...
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ guestbook
โ”‚   โ”‚   โ””โ”€โ”€ ๐Ÿ“ ...
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ home
โ”‚   โ”‚   โ””โ”€โ”€ ๐Ÿ“ lanyard
โ”‚   โ”œโ”€โ”€ ๐Ÿ“ navbar
โ”‚   โ””โ”€โ”€ ๐Ÿ“ purojekuto
โ”‚       โ”œโ”€โ”€ ๐Ÿ“ (render)
โ”‚       โ”‚   โ”œโ”€โ”€ ๐Ÿ“ many
โ”‚       โ”‚   โ””โ”€โ”€ ๐Ÿ“ one
โ”‚       โ””โ”€โ”€ ๐Ÿ“ (timeline)
โ”œโ”€โ”€ ๐Ÿ“ ui
โ”‚   โ””โ”€โ”€ ๐Ÿ“ ...
โ”œโ”€โ”€ ๐Ÿ“ hooks
โ”‚   โ””โ”€โ”€ ๐Ÿ“ lanyard
โ””โ”€โ”€ ๐Ÿ“ lib
    โ”œโ”€โ”€ ๐Ÿ“ nextauth
    โ””โ”€โ”€ ๐Ÿ“ util

## css
โ”œโ”€โ”€ ๐Ÿ“ styles
โ”‚   โ”œโ”€โ”€ ๐Ÿ“„ global.css
โ”‚   โ”œโ”€โ”€ ๐Ÿ“„ carousal.css
โ”‚   โ”œโ”€โ”€ ๐Ÿ“„ kbar.css
โ”‚   โ”œโ”€โ”€ ๐Ÿ“„ navbar.css
โ”‚   โ”œโ”€โ”€ ๐Ÿ“„ hi.css
โ”‚   โ”œโ”€โ”€ ๐Ÿ“„ timeline.css
โ”‚   โ””โ”€โ”€ ๐Ÿ“„ activity.css
โ”‚   โ””โ”€โ”€ ๐Ÿ“„ solar.css
โ”‚   โ””โ”€โ”€ ๐Ÿ“„ equalizer.css

Tech Stack

๐Ÿ“ˆ Statistic

Alt

Issues ๐Ÿงป

The repo currently facing two known bugs from Next.js

Aight ๐Ÿง

  • Probably not the only one
  • At least I think at some point it was an intended portfolio, until it doens't
  • it turns out, aight.

๐Ÿ“ License & Forking/Cloning

All code in this repository is licensed under the GNU Affero General Public License v3โ€”see the LICENSE file for more information. Please remove all of my personal information and related stuff. If you want to use this repo. This is source-available. Feels free to do so and give it a star.