This is the 2nd version of my portfolio build with Next.JS and hosted in Vercel.
Hi There!
This is the second instance of my Portfolio website (The 2nd version of my portfolio). This website is assembled successfully by grabbing inspiration from multiple elegant portfolio websites. Many components and animations of this website are built from inspired websites all around the internet.
If you find the project useful just give it a star ⭐️.
The major features of this portfolio website are:
- Elegant color selection.
- Smooth animations and transitions.
- Over 10+ Themes! Which are selected randomly whenever website is loaded.
- 6 Light + 6 Dark Themes.
- Blogging page 📝 in portfolio website itself.
- Integration with 📈 Google Analytics & Vercel Analytics 📊.
- Responsive for small-sized devices 📱.
- Contact form implemented using Firebase.
- Automated Email 📤 sending service that sends emails who contacts using this form ✉️.
- Many more hidden features.
- And many more to be implemented soon.
- Install packages! NOTE: This is auto generate configs for husky.
yarn install
-
Prepare the development environment
-
Create a new project in firebase and then create a new App.
-
Install the SDK and initialize Firebase. The exact steps could be found here.
-
Copy the firebase SDK configuration from the firebase console. Paste the JSON data into the constant named
firebaseConfig
infirebase/template.ts
file. -
Lastly, if you want to enable Google Analytics, Just follow along:
-
Go to the Google Analytics console and select the same project.
-
Copy the Google Analytics Tracking ID from the console (This is the same as the
measurementId
in firebase SDK). -
Paste the string in this file -
lib/gtag.js
-
-
-
Now it's time to spin up the live server.
yarn start
- If you want to use this code as your portfolio website. Go on! But remember you have to change details in many places including files in
constants
,firebase
,libs
,configs
, and more folders.
The live server is up and running at port 3000
. Here - http://localhost:3000
The easiest way to deploy your Next.js app is to use the Vercel Platform.
Check out Next.js deployment documentation for more details.