Skip to content

Project Overview: panualaluusua.github.io

This project is a personal portfolio website for Panu Alaluusua, Data Engineer. The site showcases professional experience, technical skills, and selected projects. It is designed to be visually modern, responsive, and easy to maintain.

Core Parts of the Project

  • index.html: The main HTML file containing the structure of the website, including sections for hero, projects, skills, and contact.
  • styles.css: Custom CSS for all visual styles, layout, color palette, dark mode, and responsive design.
  • script.js: Handles interactive features, such as the contact form and possibly dynamic content loading.
  • github-activity.js: Displays recent GitHub activity, enabling the site to show what the user is currently working on.
  • docs/: Contains documentation and idea/TODO lists for the project.
  • Panu_Alaluusua_CV.md: Downloadable CV in Markdown format.
  • Assets: Includes favicons and manifest files for cross-platform compatibility.

Technologies Used

  • HTML5: For semantic structure and content.
  • CSS3: For styling, including custom properties (variables), flexbox/grid layouts, and dark mode support.
  • JavaScript (Vanilla): For interactivity, such as the contact form and dynamic GitHub activity integration.
  • Font Awesome: For icons (used in skills, contact, and social links).
  • Web Manifest: For PWA-like features and mobile integration.
  • GitHub Pages: For hosting the static site with a custom domain (see CNAME).

Notable Features

  • Responsive Design: The layout adapts to all screen sizes (desktop, tablet, mobile).
  • Dark Mode: Fully supported via CSS custom properties and class toggling.
  • Skills & Projects Sections: Clearly highlight technical and domain expertise, with visually distinct cards and icons.
  • GitHub Integration: Shows latest GitHub commits and activity.
  • Downloadable CV: Easy access to a Markdown-formatted resume.
  • Custom Domain: The site is accessible at panualaluusua.fi.

Project Structure

├── index.html
├── styles.css
├── script.js
├── github-activity.js
├── docs/
│   ├── TODO.md
│   ├── ideas.md
│   └── project-overview.md  # ← This file
├── Panu_Alaluusua_CV.md
├── CNAME
├── favicon.ico, .png, .webmanifest

How to Extend or Maintain

  • Edit index.html to add or update content sections.
  • Adjust styles.css for visual changes or to update the color palette.
  • Add new scripts or modify script.js for additional interactivity.
  • Update github-activity.js to change how GitHub activity is displayed.
  • Use the docs/ folder for ideas, plans, and documentation.

Last updated: 2025-05-31