Alex's Personal Site

Hii, continuing with my rather slow progress, today I created component for displaying slideshows that automatically scroll and bounce back when it reaches the end. You can also manually scroll it if you needed to with the arrows.

I’m really proud of how it turned out because the bouncing back and forth is really satisfying to watch.

My biggest struggle was figuring out how to correctly size the cards, especially across differently sized devices. Initially, I had the slideshow as a flex box, as well as the individual cards. The idea for this was to have dynamically sized cards that could have long descriptions. However, neither of these worked. Firstly, the cards would look strange with long descriptions, so I decided to have a set aspect ratio to prevent big empty spaces and/or super long cards that extend the slideshow to an awkward height. Secondly, the slideshow being a flexbox meant that I couldn’t easily cut off the excess to create a scrolling effect, as each card would just become smaller to fit or wrap to the next line.
The solution that ended up working was to have each card as an inline block with a fixed aspect ratio, and cut off super long descriptions (these should be quick summaries anyways) with ellipses. Additionally “whitespace: no-wrap + overflow: scroll” was what I was looking for in terms of keeping cards in a single line.
I learned that there are often many ways there are to approach a problem, and sometimes the solution is in a completely different ballpark, so you just have to keep looking.

Ayy, made some animations and started writing the about me section. I know it’s all just looks so far but this is really cool and what makes web dev so fun imo.

Another thing I did was just fix a bunch of the tailwind classes. While it is so easy to make components with Tailwind, it can get kind of annoying to rewrite entire class names (avoiding use of @apply as much as I can).

Lastly, I started working on a slideshow and blog style posts for my projects, but I only have templates right now so there’s not much of a visual…

Made a footer with contact/“find me” info! I spent way to long deciding on how it should look lol.

Hi just started with setting up the Astro project! Got a minimal homepage and navbar that I think look cool, but there’s no content yet :)