🌟 Antim Maurya - Personal Blog & Portfolio

A modern, responsive personal website featuring an interactive AI-powered blog post generator using Google's Gemini API.

✨ Features

• 📱 Responsive Design - Works perfectly on all devices
• 🎨 Glass Morphism UI - Modern translucent design elements
• 🤖 AI Blog Generator - Powered by Google Gemini API
• 📝 Portfolio Showcase - Web development and AI projects
• 📧 Contact Form - Integrated with Formspree
• 🎯 Project Filtering - Filter by Web Dev, AI, and Design categories

🚀 Live Demo

Visit the live website: [Your Vercel URL here]

🛠️ Tech Stack

• Frontend: HTML5, CSS3, JavaScript (Vanilla)
• Styling: Tailwind CSS, Custom CSS
• Backend: Vercel Serverless Functions
• AI Integration: Google Gemini API
• Deployment: Vercel
• Form Handling: Formspree

📁 Project Structure

Blog Website/
├── 📄 index.html          # Main website
├── 🎨 style.css           # Custom styles
├── ⚡ script.js           # JavaScript functionality
├── 📁 api/
│   └── 🤖 gemini.js       # Vercel serverless function for AI
├── ⚙️ vercel.json         # Vercel configuration
├── 🔒 .env.example        # Environment variables template
├── 🚫 .gitignore          # Git ignore file
└── 📖 README.md           # This file

🔧 Local Development

1. Clone the repository

   git clone https://github.com/Antim21/Blog-Website.git
   cd Blog-Website

2. Set up environment variables

   # Create .env file
   cp .env.example .env
   
   # Add your Gemini API key
   GEMINI_API_KEY=your_actual_api_key_here

3. Get Gemini API Key 🔑

   • Visit Google AI Studio
   • Create a new API key
   • Copy and paste it in your .env file

4. Run locally

   # Install Vercel CLI (if not installed)
   npm i -g vercel
   
   # Start development server
   vercel dev

🚀 Deployment on Vercel

1. Push to GitHub 📤

   git add .
   git commit -m "Initial commit"
   git push origin main

2. Deploy on Vercel ☁️

   • Go to vercel.com
   • Import your GitHub repository
   • Add environment variable:
     • Name: GEMINI_API_KEY
     • Value: Your actual Gemini API key

3. Deploy! 🎉

🎯 Features Breakdown

🤖 AI Playground

• Blog Post Generator: Enter a topic and get 5 creative blog post titles
• Powered by Gemini: Uses Google's latest AI model
• Real-time Processing: Instant results with loading animation

📱 Responsive Sections

• Hero Section: Animated background with call-to-action
• About: Personal introduction and skills
• Blog: Featured Medium articles
• Projects: Filterable portfolio showcase
• Contact: Working contact form

🎨 Design Elements

• Glass Morphism: Translucent cards with backdrop blur
• Custom Fonts: Handwriting and cursive typography
• Smooth Animations: Hover effects and transitions
• Background Images: High-quality visuals for each section

🔒 Environment Variables

Variable	Description	Required
GEMINI_API_KEY	Google Gemini API key for AI features	✅ Yes

📝 API Endpoints

POST /api/gemini

Generates blog post ideas using Gemini AI.

Request Body:

{
  "prompt": "Your topic here"
}

Response:

{
  "text": "Generated blog post titles..."
}

🤝 Contributing

1. Fork the repository
2. Create your feature branch (git checkout -b feature/AmazingFeature)
3. Commit your changes (git commit -m 'Add some AmazingFeature')
4. Push to the branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

📄 License

This project is open source and available under the MIT License.

👨‍💻 Author

Antim Maurya

• 🌐 Website: [Your Website URL]
• 📧 Email: [Your Email]
• 💼 LinkedIn: [Your LinkedIn]
• 🐙 GitHub: @Antim21

🙏 Acknowledgments

• 🎨 Design inspiration from modern web trends
• 🤖 Google Gemini API for AI capabilities
• 📷 Unsplash & Pexels for beautiful images
• ☁️ Vercel for seamless deployment

---

⭐ Star this repository if you found it helpful! ⭐