Personal Portfolio - locsmandisz.hu

This project is a modern personal portfolio website (locsmandisz.hu) designed to showcase my skills in web development, consulting, and photography. It serves as a central hub for potential clients and collaborators to learn about my services and easily get in touch. The site features dedicated sections for each service area, a personal introduction, and clear contact information.

Key Features

  • Responsive Design: Ensures optimal viewing across all devices.
  • Intuitive Navigation: Clear header navigation with an animated mobile menu and a “hide on scroll” feature.
  • Service-Oriented Sections: Distinctly styled sections for web development, consulting, and photography.
  • Consistent Content Styling: Managed by a dedicated component for readability.
  • Performance & Analytics: Integrated Vercel Analytics, Speed Insights, and Google Tag Manager.

Technical Implementation & Stack

Built with modern web technologies for a great developer and user experience.

Framework: Next.js (React Framework)

  • Utilizing Server-Side Rendering (SSR) and Static Site Generation (SSG) for performance and SEO.
  • Leverages Next.js’s routing, image optimization, and font management.

Styling: Tailwind CSS

  • A utility-first CSS framework with a custom theme (colors, typography like Quicksand and Ubuntu Mono) for a unique brand identity.
  • Uses the @tailwindcss/typography plugin for rich text styling.

Component-Based Architecture: React

  • UI built with reusable React components (e.g., Header, Footer, HomeSection).
  • classnames utility for conditional class rendering.

Analytics & Tracking:

  • Vercel Analytics & Speed Insights.
  • Google Tag Manager (GTM): Self-hosted for advanced tracking, with client-side page view events.

User Experience Enhancements:

  • Dynamic header that responds to scroll direction.
  • Smooth transitions for interactive elements.
  • Sticky section titles for improved context on larger screens.

This project showcases proficiency in building full-stack Next.js applications, crafting UIs with Tailwind CSS, and integrating analytics. The focus was on creating a fast, accessible, and visually appealing site.

URL’s

Date: 2024. 11. 10.