Live preview: npkhang.id.vn

---

Table of Contents 📜

• Sections
• Demo
• Installation
• Getting Started
• Usage
• Deployment
• Packages Used

---

Sections 🔖

• Hero Section
• About Me
• Experience
• Tech Stacks (Skills)
• Projects
• Education
• Certifications
• GitHub Contributions
• Contacts

---

Installation ⬇️

You will need to download Node to run this project

node --version

Getting Started 🎯

Clone the repo

To Clone the repo, use this command, or just simply press the DownloadZIP button inside the Code menu in the Code section of the repository

git clone https://github.com/JavaKhangNguyen/next-portfolio.git

cd developer-portfolio

Install packages from the root directory

npm install
# or
yarn install

Then, run the development server:

npm run dev
# or
yarn dev

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

---

Then, Customize data in the utils/data folder.

Eg:

export const personalData = {
  name: "Khang Nguyen",
  profile: '/profile.webp',
  description: "Hi! I am Khang Nguyen.",
  email: '[email protected]',
  phone: '+84913324868',
  address: 'Ho Chi Minh City, VN',
  github: 'JavaKhangNguyen',
  linkedIn: 'ngpkhang',
  resume: "https://drive.google.com/file/d/1c995VKOZevEF-ljHFgIYArpMvBQel7H2/view?usp=drive_link",
  langs: ["VN", "GB"], // For the langs key, make sure to check available keys from react-flagkit when inputting data here
  hirable: 'true',
  currentEmployment: 'Available',
  exp: 'Fresher',
  fieldsOfInterest: ['Frontend','Backend','Fullstack','AI', 'DA', 'Game Dev']
}

---

Deployment 🚀

It is highly recommended to deploy the app to platforms like Vercel or Netlify. This repository will guide you to deploy the app on Vercel.

Deploying to Vercel:

1. Sign up or log in to Vercel.
2. Once logged in, click on "New Project".
3. Select your GitHub repo (the one that contains your forked project) and click Import.
4. Click on Deploy. Vercel will automatically detect your Next.js app and build it.
5. Once the deployment is complete, you can visit your live website!

Updating After Deployment

Whenever you push changes to your GitHub repo, Vercel will automatically redeploy the app, keeping your portfolio up-to-date.

---

Packages Used 📦

Package Name
Font Awesome Libraries
@fortawesome/fontawesome-svg-core
@fortawesome/free-brands-svg-icons
@fortawesome/free-regular-svg-icons
@fortawesome/free-solid-svg-icons
@fortawesome/react-fontawesome
UI & Animation
lottie-react
framer-motion
swiper
react-fast-marquee
react-flagkit
react-github-calendar
react-typed
Core Frameworks
next
react
react-dom
Styling & Utilities
tailwindcss
tailwind-merge
tailwind-scrollbar
sass
clsx
autoprefixer
postcss
Code Quality & Formatting
eslint
eslint-config-next
prettier
prettier-plugin-tailwindcss