Skip to main content

​
Portfolio Website

A comprehensive, feature-rich portfolio website with an admin dashboard for complete content management. Built for developers, designers, and creators who want full control over their online presence.

​
Why This Portfolio?

No Coding Required

Manage all content through an intuitive admin panel

Fully Customizable

Change fonts, colors, and layouts without touching code

Production Ready

Optimized for performance, SEO, and accessibility

​
Tech Stack

TechnologyPurposeWhy Chosen
React 18Frontend frameworkComponent-based, large ecosystem
Vite 5Build tool & dev serverLightning fast HMR, optimized builds
Tailwind CSS 3StylingUtility-first, highly customizable
AppwriteBackend, database & storageOpen-source, self-hostable, generous free tier
Lucide ReactIconsConsistent, lightweight, 1000+ icons

​
Key Features

Blog System

Full-featured blog with categories, multiple authors, rich text editing, and SEO-friendly URLs

Project Gallery

Showcase projects with custom URLs, image galleries, and detailed descriptions

Shortlink System

URL shortener with click analytics, geographic tracking, and custom domain support

Shop & Orders

E-commerce with PayPal integration, order tracking, coupons, and secure file delivery

Font Management

70+ Google Fonts plus custom font uploads with full Bangla language support

Rich Text Editor

Advanced editor with embeds, photo grids, tables, and complete formatting options

​
What’s Included

​
Public Pages

  • Homepage - Hero section, featured content, about preview
  • Blog - List view, single post, category filtering
  • Projects - Gallery view, detailed project pages
  • Shop - Product catalog, cart, checkout
  • Contact - Contact form with validation

​
Admin Dashboard

  • Content Management - Header, about, experience, FAQ
  • Blog Management - Posts, categories, authors
  • Project Management - Projects, categories, galleries
  • Shop Management - Products, orders, coupons
  • Shortlinks - URL shortener, analytics, custom domains
  • Settings - Fonts, menu, social links

​
Project Structure

portfolio/
├── src/
│   ├── components/      # Reusable UI components
│   │   ├── Header/
│   │   ├── Footer/
│   │   ├── RichTextEditor/
│   │   └── ...
│   ├── pages/
│   │   ├── Admin/       # Admin dashboard (protected)
│   │   ├── HomePage.jsx
│   │   ├── BlogPage.jsx
│   │   └── ...
│   ├── lib/             # Appwrite services
│   ├── utils/           # Helper functions
│   └── context/         # React context providers
├── public/              # Static assets
├── docs/                # Documentation
└── .env                 # Environment variables

Quick Start

Get up and running in 10 minutes

Appwrite Setup

Configure your backend services

Deployment

Deploy to Vercel or other platforms

Troubleshooting

Common issues and solutions

​
Requirements

Before you begin, ensure you have:
Appwrite Cloud offers a generous free tier that’s sufficient for most portfolio sites. You can also self-host Appwrite if preferred.