DotNet-WebAPI-Vue-Portfolio
DotNet-WebAPI-Vue-Portfolio copied to clipboard
⚡ A portfolio website built using ASP.NET Core Web API and Vue JS
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 🚀
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.