A modern, full-stack portfolio website built with SvelteKit, featuring a blog system, contact management, CDN file hosting, link shortening, and an admin panel.
- Responsive design optimized for mobile and desktop
- Project showcase with live demo and repository links
- Skills and expertise sections
- Contact form with auto-reply functionality
- Blog with markdown support
- Custom target cursor
- Oneko cat animation
- Webring integration (pagering)
- Hidden admin access (click copyright symbol 5 times)
- Secure authentication with password protection
- Blog post management (create, edit, delete, publish/draft)
- Contact management system with email threading
- Markdown support for email replies with live preview
- SMTP integration for sending emails
- IMAP integration for receiving replies
- Contact numbering system for tracking conversations
- Status tracking (new, replied, closed)
- Link shortener management (create, edit, delete, copy short URLs)
- CDN file management backed by Cloudflare R2 (upload, browse folders, delete, copy URLs)
- MongoDB for data storage
- Email system with markdown-to-HTML conversion
- Automatic reply on form submission
- Email thread matching by contact number
- Duplicate prevention and cleanup tools
- Cloudflare R2 object storage for CDN file hosting
- Link shortener integration with short.dwait.dev
- Plausible analytics
- Auto-generated XML sitemaps (sitemap.xml, sitemap-pages.xml, sitemap-news.xml)
- Mobile-responsive throughout
- Framework: SvelteKit
- Styling: Tailwind CSS
- Database: MongoDB
- Email: Nodemailer (SMTP), IMAP
- Storage: Cloudflare R2 (via AWS S3 SDK)
- Analytics: Plausible
- Markdown: Marked, html-to-text
- Language: TypeScript
- Node.js 18+
- MongoDB database (MongoDB Atlas recommended)
- Email account with SMTP/IMAP access (Gmail recommended)
- Clone the repository:
git clone https://github.com/gamerwaves/website.git
cd website
- Install dependencies:
pnpm install
- Configure environment variables:
Create a
.envfile in the root directory:
ADMIN_PASSWORD=your-secure-password
MONGODB_URI=******cluster.mongodb.net/portfolio
SMTP_HOST=smtp.gmail.com
SMTP_PORT=587
[email protected]
SMTP_PASS=your-app-password
IMAP_HOST=imap.gmail.com
IMAP_PORT=993
[email protected]
IMAP_PASS=your-app-password
# Cloudflare R2 (optional, required for CDN features)
R2_ACCOUNT_ID=your-cloudflare-account-id
R2_ACCESS_KEY_ID=your-r2-access-key-id
R2_SECRET_ACCESS_KEY=your-r2-secret-access-key
R2_PUBLIC_URL=https://your-r2-public-domain.com
For Gmail, generate an App Password at https://myaccount.google.com/apppasswords For Cloudflare R2, create an API token with R2 read/write permissions at https://dash.cloudflare.com/profile/api-tokens
pnpm run dev
pnpm run build
pnpm run preview
Access the admin panel at /admin or click the copyright symbol in the footer 5 times.
- Blog Management: Create and edit blog posts with markdown
- Contact Management: View messages, reply with markdown formatting, track conversation threads
- Link Shortener: Create, edit, and delete short links with custom paths and tags
- CDN Management: Upload files to Cloudflare R2, browse folders, delete files, and copy public URLs
- Email Sync: Manually sync replies from IMAP
- Cleanup Tools: Remove duplicates and convert HTML emails to text
src/
├── lib/
│ ├── TargetCursor.svelte # Custom cursor component
│ ├── server/
│ │ ├── db.ts # MongoDB connection
│ │ └── email.ts # Email utilities
│ └── stores/
│ └── blog.ts # Blog types
├── routes/
│ ├── admin/
│ │ ├── +page.server.ts # Admin server logic
│ │ └── +page.svelte # Admin dashboard (blog, contacts, links, CDN tabs)
│ ├── api/
│ │ ├── cdn/ # Cloudflare R2 CDN API (list, upload, delete)
│ │ ├── contact/ # Contact form API
│ │ ├── sync-replies/ # Email sync API
│ │ ├── cleanup-contacts/ # Cleanup API
│ │ └── test-email/ # SMTP connection test API
│ ├── blog/
│ │ ├── [slug]/ # Individual blog posts
│ │ └── +page.svelte # Blog listing
│ ├── sitemap.xml/ # XML sitemap index
│ ├── sitemap-pages.xml/ # Pages sitemap
│ ├── sitemap-news.xml/ # News sitemap
│ └── +page.svelte # Homepage
└── app.css # Global styles
Dwait Pandhi
- Website: https://gamerwaves.hackclub.app
- GitHub: https://github.com/gamerwaves
- Email: [email protected]