My Portfolio

This is my personal portfolio website built using Next.js, Framer Motion, Tailwind CSS, EmailJS, and MongoDB with Mongoose. This portfolio showcases my projects, skills, and provides a way for visitors to contact me.

Table of Contents

• Features
• Tech Stack
• Installation
• Usage
• Deployment
• Screenshot

Features

• Next.js: Server-side rendering, static site generation, and dynamic routing.
• Framer Motion: Smooth animations and interactions.
• Tailwind CSS: Utility-first CSS framework for rapid UI development.
• EmailJS: Email integration for contact forms without a backend.
• MongoDB & Mongoose: Database and ODM for storing and managing data.

Tech Stack

• Framework: Next.js
• Animations: Framer Motion
• Styling: Tailwind CSS
• Email Service: EmailJS
• Database: MongoDB and Mongoose

Installation

To run this project locally, follow these steps:

1. Clone the repository:

   git clone https://github.com/Avijit07x/portfolio.git
   
   cd portfolio

2. Install dependencies:

   npm install
   
   or
   
   bun install

3. Set up environment variables: Create a .env.local file in the root directory and add your environment variables:

   NEXT_PUBLIC_BASE_URL = ""
   
   MONGODB_URL = "YOUR_MONGODB_URL"
   
   NEXT_PUBLIC_EMAILJS_SERVICE_ID = "EMAILJS_SERVICE_ID"
   
   NEXT_PUBLIC_EMAILJS_TEMPLATE_ID = "EMAILJS_TEMPLATE_ID"
   
   NEXT_PUBLIC_EMAILJS_PUBLIC_KEY = "EMAILJS_PUBLIC_KEY"
   
   NEXTAUTH_URL = ""
   
   NEXTAUTH_SECRET = ""
   
   NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME = "CLOUDINARY_CLOUD_NAME"
   
   NEXT_PUBLIC_CLOUDINARY_API_KEY = "CLOUDINARY_API_KEY"
   
   NEXT_PUBLIC_CLOUDINARY_API_SECRET = "CLOUDINARY_API_SECRET"
   
   NEXT_PUBLIC_CLOUDINARY_UPLOAD_PRESET = "CLOUDINARY_UPLOAD_PRESET"

4. Run the development server:

   npm run dev
   
   or 
   
   bun dev

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

Usage

• Hero Section: Overview of your portfolio with a brief introduction.
• Projects Section: Detailed information about your projects with links to GitHub repositories and live demos.
• Skills Section: List of your technical skills and proficiencies.
• Contact Section: Contact form to send you messages directly via EmailJS.

Deployment

The portfolio is deployed and can be accessed here.

Screenshot