Website Day 1

So yesterday I took on the challenge to actually get started on my own personal portfolio website. I got started with the design and decided that I will add the content later on when all the heavy lifting has been done. So I went to Dribble to look for some design themes.
And the one I finalised is Neobrutalism. I am very trashy at design and know just about enough for it to pass. But this time I wanted to make the website look actually half decent. Neobrutalism follows the design of having sharp edges, bright colours, and bold strokes, which is quite different from what we see on modern websites today.
I then came across a website called dodonut.com whose colour palette I really liked, so I took out the most used colours and got to work.
I added a header, a basic introduction, my socials, and an about section all following the same pattern. I then realised that having a scroll progress on the header would be good so I looked up some code to do it and put it in.

const [completion, setCompletion] = useState(0)

    useEffect(() => {
        const updateScroll = () => {
            const progress = window.scrollY
            const scrollHeight = document.body.scrollHeight - window.innerHeight
            if (scrollHeight){
                setCompletion(
                    Number((progress / scrollHeight).toFixed(2)) * 100
                )
            }
        }
        window.addEventListener('scroll', updateScroll)
        return () => window.removeEventListener('scroll', updateScroll)
    }, [])

    return completion

This completion variable is a value between 0 and 100 depending on where you are on the page, now putting a transform property on an empty div adds a nice effect to show scroll progress.

<div
    style={{ transform: `scaleX(${completion / 100})` }}
    className={styles.progress} />

I then pushed these changes to the GitHub repo and despite how little you can see, this took a substantial amount of time.

The reason people code is still a mystery. To put oneself through so much pain to achieve so little goes against human intuitiveness. Yet so many of us do it on a daily basis and reap happiness out of it. Humans are truly a weird race - Abeer Rao 2023