mohamedamirmamoon/game-portfolio

Purpose and Runtime

This repository is a single-page personal portfolio/resume site built with Next.js and TypeScript. It uses the App Router, React components, CSS modules-by-convention via colocated .css files, and Next’s development/production server runtime. No backend, API routes, database, authentication, or third-party service integrations are present.

Key application entry points:

• src/app/layout.tsx — root document layout and global application shell.

• src/app/page.tsx — / route composition point.

• src/app/globals.css — global styling baseline.

Application Shell and Shared Navigation

The root page is framed by reusable site-level navigation and footer components:

• src/app/components/navbar/page.tsx

• src/app/components/navbar/navbar.css

• src/app/components/footer/page.tsx

These components establish persistent site chrome and likely provide anchors or navigation into the portfolio sections. Their boundary is presentation-only: they do not connect to server APIs or shared application state.

Intro / Primary Interaction Surface

The intro card is the main content-selection and routing surface within the landing page:

• src/app/components/introCard/page.tsx

• src/app/components/introCard/cardNav/CardNav.tsx

• src/app/components/introCard/routeContent/RouteContent.tsx

Control flow is local to this component subtree: CardNav selects a content area, and RouteContent renders the corresponding view. This is client-side UI state rather than Next.js URL routing; only the root / page route is represented in source.

Portfolio Content Stages

The intro-card content system exposes portfolio-oriented sections, each isolated as a renderable component:

• src/app/components/me/page.tsx

• src/app/components/projectDisplay/page.tsx

• src/app/components/resume/page.tsx

The “me” and resume sections provide static personal/professional content. The project display acts as the portfolio listing/container stage and owns its own presentation stylesheet at src/app/components/projectDisplay/project.css.

Project Presentation Layer

Individual project cards are separated from the project-list/container component:

• src/app/components/projectDisplay/projectCard/ProjectDisplay.tsx

• src/app/components/projectDisplay/projectCard/projcard.css

This boundary supports repeated project entries without coupling card rendering to navigation or page-shell logic. Project content appears to be statically embedded in React components rather than loaded from a CMS or remote endpoint.

Contact and Specialty Content

Additional content panels are integrated into the intro-card selection flow:

• src/app/components/introCard/contact/Contact.tsx

• src/app/components/barber/page.tsx

• src/app/components/introCard/contact/contact.css

The contact component is a UI section, with no evidence of a server action, API endpoint, email provider, or form-processing infrastructure. The barber component is another portfolio/content view and remains isolated from application-shell concerns.

Assets and Deployment Boundary

Static assets are served directly by Next.js:

• public/fonts/minecraftbold.otf

• public/images

• public/minecraftia.zip

next.config.ts is the framework configuration boundary, while package.json defines Node/Next.js scripts and dependencies. The project is deployable to a standard Next.js host, including Vercel, with generated artifacts under .next/ representing build output rather than source architecture.