Musabhassan.com
My personal portfolio and all its assets. As seen on Awwwards.
Overview
The source code for MusabHassan's personal portfolio website, musabhassan.com, is a showcase of his development skills and includes information on the technologies used to build the site. The website is built with SvelteKit as the frontend framework, incorporating scroll effects with Slickscroll, animations with Anime, 3D effects with Three.js, and hosting on Firebase. The source code for this version, which is 2+, is available in the repository, with version 1.0 built with jQuery stored in a separate branch called v1.
Features
- SvelteKit: Used as the frontend framework for building the website.
- Slickscroll: Implements scroll effects to enhance user experience.
- Anime: Includes animations to create a visually appealing design.
- Three.js: Integrates 3D effects to add depth and interactivity.
- Firebase: Hosts the website for seamless deployment.
- Version Control: Offers multiple versions in different branches for tracking changes.
- Svelte
Svelte is a modern front-end framework that compiles your code at build time, resulting in smaller and faster applications. It uses a reactive approach to update the DOM, allowing for high performance and a smoother user experience.
- Vite
Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects
- SCSS
SCSS is a preprocessor scripting language that extends the capabilities of CSS by adding features such as variables, nesting, and mixins. It allows developers to write more efficient and maintainable CSS code, and helps to streamline the development process by reducing repetition and increasing reusability.
- Personal
A personal website is an online platform that showcases an individual's work, interests, and personality. It can include a range of content, such as a bio, resume, portfolio, blog, and contact information, and is often used to promote one's personal brand or professional services.
- Portfolio
A portfolio website is a type of website that showcases an individual's or a company's work, skills, and accomplishments. It typically includes a gallery of images or videos, case studies, and client testimonials to provide potential clients or employers with a comprehensive overview of their experience and expertise.
- Typescript
TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.
