Sean Shmulevich Windows98 personal website

This repository contains my personal website. I took on this project as a way to learn about frontend development and frontend frameworks. I spent over 400 hours on this project and I am very proud of the result. This project taught me about the importance and benefits of a component driven frontend design. I feel inspired by the possibilities that come from combining classic retro design principals with the convince and abstraction provided by today's frontend frameworks.I first started this project as an assignment in my programming for the humanities course, the initial version of the site was rejected as a submission for the project cause it was way too cool and the teacher couldn't handle it.

Why svelte?

I chose svelte as my first frontend framework because of its ease of use and parallels with traditional html/css/js web development. I am also motivated by building lightweight web application that are fast/efficient/accessible and responsive. Svelte is a great choice for this because it compiles to vanilla js and has a much smaller footprint compared to other frontend frameworks. This also makes it very easy to deploy anywhere. I love the svelte approach to state, any keyword that is defined with the "let" keyword is a piece of reactive state. React has a big learning curve because of the fine grained control that the user has over state and re-rendering, this can be beneficial but can also lead to costly logic errors especially for less experienced programmers.

Why are some 'windows' on the site, modern mac OS windows

• In order to practice my CSS skills, I wanted to recreate my instance of VS code within the browser, in a pixel perfect format. I have since switched to VIM. but this "VS code" window recreation likely the most in depth piece of CSS code i have ever written.

CMS integration

• In order to make the site more maintainable and add self written content about myself. I decided to integrate a headless CMS. I chose sanity.io because of its ease of use and flexibility. I am very happy with the result.

Why

• I wanted to create a personal website that was unique and reflected my personality.
• The Swiss mountains represent my love for winter sports and my family, who live in Switzerland.
• The purple color scheme is my favorite color and the usages of the color purple I think are very cohesive.

What I learned

• Svelte SPA
• Lazy loading JavaScript to reduce package size
• Integrating with headless CMS
• CSS key-frames: Over 30 hours spent on the minimize animation.
• Svelte global stores.
• Svelte transitions
• Keeping a site simple and using api's to avoid security concerns.
• Pixel perfect eye for detail
• Impenetrable intolerance for bugs.
• Adapting a non traditional website interface to be work perfectly on mobile devices.
• Combining aspects of design that inspires me, colors and images which I love.
• Figuring out how to do all of the graphic design needed.

What I would do differently

• Planning: I would have spent more time planning the site before starting to code. I would have created a wireframe and a design system to follow. While i was creating version one of the website I was able to write down many grand ideas for the site. I also spent a lot of time exploring websites with a similar "desktop" user interface. This research gave me tons of ideas for my Website. At this point in between version one and version two I should have stuck to a design plan and not deviated from it until after some minimum functionality was achieved. The minimize animation in particular was very difficult to implement and had many many bugs, this caused quite the headache, a more concise plan and component structure would have mitigated all of this time spent debugging the animation.