Mahmudul Alam – Portfolio

Modern portfolio powered by a SvelteKit 2 + Tailwind CSS 4 frontend and a Rust/Actix-Web API backed by PostgreSQL. The UI fetches live portfolio data from the API so content updates do not require rebuilding the site.

Live site: https://mahmudul.com.bd

Contents

• Stack
• Architecture
• Features
• Quick start
• Environment
• Project structure
• Scripts
• API
• Deployment
• Contact

Stack

• Frontend: SvelteKit 2, Vite, TypeScript, Tailwind CSS 4, Iconify
• Backend: Rust, Actix-Web, SQLx, Tokio, PostgreSQL
• Tooling: npm, Cargo, dotenvy, Tailwind/PostCSS

Architecture (bird's-eye)

• SvelteKit app runs as an SPA (SSR/prerender disabled) built with @sveltejs/adapter-static and served with an SPA fallback.
• All page content is requested at runtime from GET /api/portfolio exposed by the Rust API.
• API connects to PostgreSQL; on startup it auto-creates tables and seeds default data if empty.
• PUBLIC_API_BASE_URL controls which API host the frontend calls (defaults to http://localhost:8089).

Features

• Responsive, theme-toggleable UI (light/dark) with smooth scroll/animation helpers.
• Data-driven sections: Hero, Stats, Services, Professional Works, Hobby Projects, Resume, Skills, Contact.
• Single source of content in the database; seeds include sample portfolio data.
• Downloadable résumé and outbound social/contact links.

Quick start

Prerequisites: Node 20+, npm, Rust (stable), Cargo, and a running PostgreSQL instance.

1. Clone & enter the project

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

2. Environment

cp .env.example .env
# If you run the backend from its folder, also copy it there
cp .env backend/.env

Adjust DATABASE_URL, PORT, and PUBLIC_API_BASE_URL as needed.

3. Database Create the database referenced by DATABASE_URL (default postgres://postgres:postgres@localhost:5432/portfolio). Example:

createdb portfolio

4. Start the backend (API)

cd backend
cargo run

The server listens on PORT (default 8089) and seeds data on first run.

5. Start the frontend

npm install
npm run dev      # defaults to http://localhost:5173
# or expose on your LAN
npm run dev:host

Environment

Variable	Default	Used by	Purpose
PUBLIC_API_BASE_URL	http://localhost:8089	frontend	Base URL for API calls
DATABASE_URL	postgres://postgres:postgres@localhost:5432/portfolio	backend	PostgreSQL connection string
PORT	8089	backend	Port for the Actix server

Project structure

.
├─ src/                 # SvelteKit app
│  ├─ routes/           # +page.svelte/+layout and load logic
│  └─ lib/              # Components, stores, actions, types, API client
├─ static/              # Public assets (images, resume)
├─ backend/             # Rust API service
│  ├─ src/              # actix-web handlers, models, DB bootstrap & seeding
│  └─ Cargo.toml
├─ .env.example         # Shared env defaults
└─ package.json         # Frontend scripts

Scripts

• Frontend: npm run dev, npm run dev:host, npm run build, npm run preview, npm run check
• Backend: cargo run (dev), cargo build --release, cargo test

API

• GET /health → returns ok for liveness checks.
• GET /api/portfolio → returns the full portfolio payload consumed by the SvelteKit app.

Deployment

Frontend

• Build static assets: npm run build (output in build/). Serve with any static host that supports SPA fallbacks.
• Set PUBLIC_API_BASE_URL to your deployed API origin at build time.

Backend

• Build: cargo build --release
• Provide DATABASE_URL and PORT in the runtime environment.
• Deploy to any container host (Fly.io, Render, Railway, etc.) and allow CORS for the frontend origin (currently permissive in code).

Contact

• Portfolio: https://mahmudul.com.bd
• Email: mahbd17@hotmail.com
• Facebook: https://facebook.com/maha48bd20thb
• LinkedIn: https://www.linkedin.com/in/mah20t/
• GitHub: https://github.com/mahbd
• Codeforces: https://codeforces.com/profile/mahbd