Portfolio built using Next.js, TailwindCSS, and Firebase
MIT License
Next Portfolio is built using Next.js and Tailwind CSS for a modern design and rapid development. TypeScript is utilized for code clarity and safety. Additionally, Firebase is being integrated for backend services such as realtime-database. The result is a dynamic and functional portfolio website that showcases the developer's skills and experience.
Here are the steps to run the portfolio locally.
Fork this repository.
Clone your forked copy of the repo
git clone https://github.com/<your-github-username>/next-portfolio.git
Install dependencies
npm i
Create a Firebase project and select the web app
Create an .env.local
file in the root directory, and add the following variables with your firebase config:
SENDGRID_API_KEY=XXXXXXXX
NEXT_PUBLIC_FIREBASE_DATABASE_URL=XXXXXXXXXX
MAIL_FROM=YOUR_MAIL_ID
MAIL_TO=YOUR_MAIL_ID
Note:
SENDGRID_API_KEY
- Create an API key from "Settings" -> "API Keys" with "Restricted Access" to only "Mail Send"
Update the sample data.json provided, with your data or directly import the same and edit using firebase later. (For storing images you can use Cloudinary or Firebase Storage)
Import json data
Run the project
npm run dev
Create a Vercel account and select "Import Project"
Select the forked repository and deploy
Add the following environment variables in the Vercel dashboard:
SENDGRID_API_KEY=XXXXXXXX
NEXT_PUBLIC_FIREBASE_DATABASE_URL=XXXXXXXXXX
MAIL_FROM=YOUR_MAIL_ID
MAIL_TO=YOUR_MAIL_ID
Hurray! You successfully deployed the portfolio🥳
This project is licensed under the MIT License - see the LICENSE.md