Thoughts

Lately, I've been using Typescript in all of my projects and let me tell you, it's been a game-changer. With its type checking and improved error handling, I'm able to spot problems earlier in the development process and write better code. Plus, using interfaces and type definitions makes my projects much more manageable, especially as they get bigger and more complex. I never thought I'd enjoy working with a statically typed language, but Typescript has totally won me over.

Going back to plain old JavaScript feels like such a drag now. Without the helpful type information and increased risk of runtime errors, I feel like I'm coding with one hand tied behind my back. Trust me, using Typescript makes me way more productive and my code is just better overall. I highly recommend giving it a try – you might just be surprised at how much you love it, like I have!

During my React.js learning process, I discovered some default functionality that I don't want in a lot of my web applications. One of which is an oddity in scroll location between pages. If you switch routes after scrolling down on your current page, the page you navigate to will be scrolled that exact same amount. In some cases, this can cause some pretty annoying UI if the user constantly has to scroll to the top of new pages they navigate to.

For this reason, I use the <ScrollToTop /> component in almost all of my web apps:

const ScrollToTop = () => {
const { pathname } = useLocation()
useEffect(() => {
document.querySelector('.app-container).scrollTo(0, 0)
}, [pathname])
return null
}

In this project .app-container contains all of the app content. The useEffect scrolled the client to the top of the page every time the pathname is changed, i.e. every time a user navigates to a new page. The final step is to render <ScrollToTop /> in a component such as <App /> or <Layout /> so that it will exist on every web page:

const App = () => {
return <Router>
<ScrollToTop />
<Routes> ... </Routes>
</Router>
}

And there you have it, your application will always show pages scrolled to the top on navigation!

I'm happy to finally announce the Beta of a new project I have been working on. Three months ago I decided to take a break from redux prison and make a super simple personal recipe list website. "This should take a week max," I thought to myself as I ran 'npx create-react-app' in my terminal. "Weeelllllll... user authentication would be a nice feature, and then it sure would be nice to save recipes to a list, and rating and reviews would be an interesting feature to add..."

And three months later I completed the beta. Although Prepify took way longer than expected, I have become incredibly thankful for the learning journey it has brought me through. From learning Mongodb, to creating and manipulating database queries, to creating a simple UI for searching and filtering results, this project has greatly increased many practical skills that I'm sure will help me in the future.

Prepify is something I will be using often in my personal life, I'm truly proud of what I've created. If you are interested in meal preping, easily finding cheap recipies, or having non-cluttered, ad-free recipe UI, I recommend checking it out :)

Here begins the documentation of my thoughts, ideas, interests, and weird experiences throughout my software development journey. I hope you can find them at the very least mildly interesting, helpful, or amusing.