Part 1 - Server Side Rendering

Part 1 - Server-Side Rendering (SSR) is a technique that enables web applications to render web pages on the server-side before sending them to the client-side. This technique improves web application performance, increases search engine optimization, and improves the user experience. Both Remix and Next.js are popular web frameworks that support SSR.

Remix vs Next.js - Server Side Rendering (SSR)

I recently asked chatGPT to code me a snowstorm using javascript and this is the result.

ChatGPT Snowstorm

How we turned a photo into a structured recipe using AI

Imagine this - a user uploads a photo of a handwritten family recipe or a snapshot of their dinner plate. Within seconds, that image is transformed into a fully structured recipe—complete with ingredients, instructions, grocery categories, nutritional data, and suggested tags.

From Recipe Photo to Structured Data - AI Magic for Web Developers

In this post, I'll walk through a system I built that orchestrates various AI models to generate location-specific content with a focus on weather forecasts and local information.

Building a Multi-Modal AI System for Location-Based Content Generation

The rise of AI in app development has brought about a new way to interact with and generate content. One of the biggest challenges when building an AI-powered recipe app is ensuring consistent output.

Building a Recipe App with AI image Parsing - Why Markdown is Currently Better than JSON for Image Parsing Output

LLM Web Integration is the Future

Building web applications in 2025 is an exciting and rewarding experience. Developers today are empowered with a suite of incredible tools that streamline workflows, improve performance, and spark creativity. Technologies like React, Remix (React Router v7), Prisma, and Tailwind CSS provide a solid foundation for creating apps that are fast, efficient, and visually stunning.

Progressive Web App in 2025

In a world where we crave efficiency, simplicity is often seen as the ultimate goal. Whether it's designing a product, creating an app, or just trying to explain a concept, we constantly aim to make things simple. But the irony is, making things simple is anything but easy.

Why Making Things Simple is So Complex

The Geometry of Sine and Cosine

Creating visually stunning effects in computer graphics often involves leveraging mathematical concepts. One particularly mesmerizing effect is the tornado, which can be achieved by cleverly using the geometric properties of sine and cosine functions. In this article, we'll explore how to create a tornado effect and dive into the mathematical principles behind it.

How to Create a Tornado Effect

I have been working with large language models (LLMs) for the past year. During this time, I have built a couple of chatbots and most recently added a text generation feature to my personal weather application.

Creating a text feature for an existing web application using Large Language Models (LLMs)

I'm excited about the upcoming release of React Router v7. At first, I was concerned because I have become very fond of Remix and worried that the release of React Router v7 would mean the end of Remix. However, after the announcement, I now know that the features I've come to enjoy about Remix are moving to React Router v7.

React Router V7

Three simple concepts for ui engineers

As a designer and engineer, I've come to realize that there are three key concepts that every UI engineer should know to create a great user experience. These concepts are simple but can profoundly impact the usability and effectiveness of a user interface.

UX Bare Minimum

Part 4 - Static Site Generation

Part 4 - Static Site Generation (SSG) is a technique used to build websites where the content is generated ahead of time and stored as static files. The static files are then served to users when they visit the website. This approach differs from traditional dynamic website generation, where content is generated on the fly in response to user requests.

Remix vs Next.js - Static Site Generation (SSG)

Tree recursion is a technique used to traverse a tree-like data structure by recursively visiting each node and its children. This type of recursion is commonly used in computer science, particularly in algorithms related to graphs and trees.

Tree recursion in JavaScript and how to optimize

Part 3 - Data Management

Part 3 - Remix and Next.js are two popular frameworks for building modern web applications. Both frameworks provide powerful tools and features for managing data in your application, but they have some differences in how they approach data management.

Remix vs Next.js - Data Management

Part 2 - Routing

Part 2 - Remix.run and Next.js are two popular frameworks for building web applications, particularly for creating dynamic web pages. Both frameworks provide routing mechanisms to help developers manage the flow of information between different pages or views within a web application. In this comparison, we will explore the similarities and differences between the routing mechanisms of Remix.run and Next.js.

Remix vs Next.js - Routing

A great front-end engineer possesses a combination of technical and non-technical qualities. Here are some of the most important qualities

The qualities of a great front-end engineer.

JavaScript generators and iterators are powerful features that allow developers to control the flow of code execution in a more flexible and efficient manner. Here's an overview of both

All Notes

Remix vs Next.js - Server Side Rendering (SSR)

ChatGPT Snowstorm