Abdullah Muhammad - Portfolio Website

A modern, responsive personal portfolio website showcasing the work and skills of me, Abdullah Muhammad.

About

This is the personal portfolio website of Abdullah Muhammad, a Software Engineering graduate from McMaster University. The site serves as a comprehensive showcase of professional experience, technical skills, personal projects, and interests.

Live Website: kingabdullah.codes

Features

🏠 Home Page

• Quick navigation to key sections
• Direct links to mock resume and GitHub profile

👨‍💻 About Section

• Educational background and journey
• Personal story and career development
• University experience at McMaster

🛠️ Skills Showcase

• Programming Languages: JavaScript, TypeScript, Python, Java, and more
• Full Stack Technologies: React, Next.js, Node.js, Express, MongoDB, PostgreSQL
• Cloud Platforms: AWS Certified, Azure Certified
• Development Tools: Git, Docker, VS Code, and various testing frameworks
• Web3 Development: Blockchain technologies and decentralized applications

💼 Portfolio

• Featured projects with site and GitHub links
• Complete portfolio with 50+ technical articles on Medium
• Full-stack web applications and cloud solutions
• Project technology stacks and descriptions

🎯 Leisure Activities

• Programming personal projects and continuous learning
• Hockey
• Chess

♟️ LiChess Integration

• Live chess profile statistics via Lichess API

📄 Mock Resume

• Professional resume available for download
• Direct access to career highlights and achievements

Technology Stack

This website is built using modern web technologies:

• Frontend: React 18, Next.js 15+ (App Router)
• Styling: Tailwind CSS with custom glassmorphism effects
• UI Components: Radix UI primitives with custom styling
• Icons: Lucide React
• Deployment: Static site generation with Next.js
• APIs: Lichess API integration for chess data
• TypeScript: Full type safety throughout the application

Key Technical Features

• SEO Optimized with comprehensive metadata for all pages
• Responsive Design optimized for all device sizes
• Performance Optimized with Next.js Image optimization
• Accessibility features and semantic HTML
• Modern UI/UX with glassmorphism design patterns
• API Integration with external chess data services

Getting Started

Prerequisites

• Node.js 18+
• npm or yarn package manager

If you want to fork this repository to create your own personalized portfolio site, feel free to do so.

Installation

1. Clone the repository:

git clone https://github.com/CodingAbdullah/abdullah_95.git
cd abdullah_95

2. Install dependencies:

npm install

3. Run the development server:

npm run dev

4. Open http://localhost:3000 in your browser.

Build for Production

npm run build
npm start

Project Structure

src/
├── app/                   # Next.js App Router pages
│   ├── about/             # About page
│   ├── skills/            # Skills showcase
│   ├── portfolio/         # Portfolio projects
│   ├── leisure/           # Personal interests
│   ├── lichess/           # Chess profile
│   └── api/               # API routes
├── components/            # Reusable React components
│   ├── ui/                # UI component library
└── utils/                 # Utilities and constants
    ├── constants/         # Data constants
    └── types/             # TypeScript type definitions

Links

• Website: kingabdullah.codes
• GitHub: CodingAbdullah
• Medium: @abdullah_95
• Lichess: Lichess API Documentation

---

Built with ❤️ using Next.js and React.