Ishmamur Rahman — Portfolio

Personal portfolio showcasing my professional experience, technical skills, and selected projects.

Live site: ishmamur-rahman.netlify.app

Tech stack

• React 18 and TypeScript
• Vite
• Mantine UI and Tabler Icons
• React Router
• Vitest, Biome, and Husky
• EmailJS integration (currently disabled in the UI)

The interface supports light and dark color schemes. It follows the device preference by default and persists manual selections through Mantine.

Page components live in src/Pages, reusable UI lives in src/Shared, content lives in src/Data, and navigation helpers live in src/utils.

Component-specific styles and types are colocated as ComponentName.module.css and ComponentName.types.ts. Shared content contracts live in src/Data/content.types.ts.

Imports that cross module directories use the @/ alias for src/. Colocated files continue to use relative imports.

Local development

Requirements:

• Node.js 22.13 or newer (the repository .nvmrc selects Node 22)
• npm

Install dependencies and start the development server:

npm install
npm run dev

Vite prints the local development URL after startup.

Available scripts

npm run dev        # Start the Vite development server
npm run typecheck  # Check TypeScript types
npm run lint       # Run Biome's lint rules
npm run lint:fix   # Apply safe Biome lint fixes
npm run format     # Format supported files with Biome
npm test           # Run the Vitest suite once
npm run test:watch # Run Vitest in watch mode
npm run build      # Type-check and create a production build
npm run preview    # Preview the production build locally

Husky runs lint, tests, and the production build before every commit.

Contact form configuration

The contact form uses EmailJS and expects these variables in a local .env file:

VITE_EMAILJS_SERVICE_ID=your_service_id
VITE_EMAILJS_TEMPLATE_ID=your_template_id
VITE_EMAILJS_PUBLIC_KEY=your_public_key

The fields and submit button are intentionally disabled while the form is under development. Environment files are ignored by Git.

Content updates

Portfolio content is split by responsibility:

• src/Data/profile.ts — contact details, social links, and resume URL
• src/Data/skills.ts — technology categories and skills
• src/Data/experience.ts — professional experience
• src/Data/academics.ts — education and publications
• src/Data/projects.ts — projects, screenshots, features, and external links
• src/Data/content.types.ts — shared content contracts

src/Data/content.ts is a compatibility barrel that re-exports these modules. Project screenshots and other static assets live in public/images.

Projects use stable slug-based detail routes, for example /projects/surreal-studio. Every project slug must be unique.

Deployment

Run the validation commands before deploying:

npm run typecheck
npm run lint
npm test
npm run build

The production output is written to dist. Netlify uses Node 22 from .nvmrc, and public/_redirects provides SPA fallback for direct project-route visits.