Real World Examples

See Projex in action on real portfolios. These examples demonstrate what's possible with the library's semantic HTML and flexible styling.

Featured Examples

Luke Manning's Portfolio

A personal portfolio showcasing open source projects, npm packages, and personal work.

• Live Site: lukemanning.ie
• Demonstrates: Mixed project types, custom styling, responsive grid layout, search
• Tech Stack: Next.js, React, TypeScript, Tailwind CSS

Submit Your Portfolio

Have you built a portfolio using Projex? We'd love to feature it!

Requirements:

• The portfolio is publicly accessible
• Uses Projex components
• Demonstrates interesting use of the library

To submit:

1. Open an issue or PR on the Projex GitHub repository
2. Include:
   • Portfolio URL
   • Brief description of what it demonstrates
   • Tech stack used
   • Any unique styling or implementation details

What These Examples Show

Design Patterns

• Grid layouts: Responsive card grids using ProjectGrid
• List views: Compact project lists using ProjectList
• Featured projects: Hero sections using FeaturedProject
• Detail pages: Project detail views using ProjectView

Project Types

• GitHub repositories: Open source projects with stars, forks, commits
• npm packages: Published packages with downloads and version
• Manual projects: Personal work with custom descriptions, tags, and links
• Hybrid projects: Projects with both GitHub and npm data

Styling Approaches

• Minimal design: Clean, minimal card layouts
• Dark mode: Dark theme implementations
• Custom layouts: Unique grid and list arrangements
• Type-specific styling: Different styles for GitHub, npm, and manual cards

Looking for Inspiration?

These examples demonstrate:

1. No default styling: Each portfolio has a unique look
2. Full CSS control: Complete freedom over design
3. Semantic HTML: Accessible, well-structured markup
4. Responsive design: Works on all screen sizes
5. Type-specific data: Stats and links appropriate to each project type

Build Your Own

Ready to create your own portfolio? Check out the Styling Guide and Examples to get started.