Personal Portfolio Website ⚡

A portfolio website with admin panel. The backend is built with ASP.NET Core Web API, the frontend with Vue JS, and the database with PostgreSQL.

This is a learning project and it showcases the implementation of several software development practices such as clean architecture, design patterns and test-driven development.

In a real-world scenario, these practices should be chosen based on the specific requirements of each project.

Demo 🚀

➥ Live Demo

Home page

Admin panel

Admin Panel Sections

• Profile
• Experiences
• Educations
• Social links
• Messages
• Login
• Change password

Screenshots of Admin Panel 📸

Tech Stack 🛠️

• Back End

  • ASP.NET Core Web API
  • .NET -v7
  • Entity Framework Core -v7
  • Mapster -v7 for object mapping
  • JWT (JSON Web Token)
  • Clean Architecture
  • Repository Service Pattern
  • Unit of Work Pattern
  • TDD (Test-Driven Development)
  • FakeItEasy for mocking & fake data generating
  • xUnit for unit and integration testing
  • Testcontainers for integration testing
  • Fluent Assertions

• Front End

  • Vue JS -v3 (Vite-based)
  • Bootstrap -v5 for admin panel UI
  • Axios for API calls
  • Vuelidate for client-side validation
  • Vue-toastification for notifications
  • Skeleton for home page UI
  • HTML -v5
  • CSS -v3

• Database

  • PostgreSQL -v15
  • Database built via Entity framework migrations (code-first approach)

• IDE

  • Visual Studio 2022 -v17 for back end development
  • Visual Studio Code for front end development

Assets 🗃️

To download the project's UI/UX design file click here. Adobe XD software is required for viewing.

To download the project's database design file click here.

Contributions 🤝

Contributions are appreciated. If you identify areas for improvement, please feel free to create an issue or submit a pull request. For any questions or suggestions, please create an issue.