Technical note
Introducing Schemd: a small text-to-SVG compiler for circuits and UML
I like diagrams that live close to the code they explain. An exported image is easy to forget, difficult to review, and usually out of date after a few changes.
Tag
webdev
Crafting digital experiences through code and design
10 articles
Technical note
Integrating Stripe with SvelteKit: Dynamic pricing and Payment Security
Integrating Stripe into a SvelteKit application, especially when dealing with dynamic product pricing and robust webhook validation, can be challenging. While building a client's business application using SvelteKit and…
Technical note
How to Build a Dual-LLM Chat Application with Next.js, Python, and WebSocket Streaming
In the age of rapid AI advancement, software engineers are frequently tasked with building sophisticated chatbots. This article provides a practical guide to developing a real-time, response-streaming chatbot from…
Technical note
Building an AI-powered Financial Behavior Analyzer with NodeJS, Python, SvelteKit, and TailwindCSS - Part 5: Dashboard
In this part, we'll integrate the finance dashboard we bootstrapped and the improved analyzer model into our application. Specifically, we will integrate the WebSocket-backed server with our SvelteKit frontend.
Technical note
Building a financial dashboard with HTML5, TailwindCSS v4 and Vanilla JavaScript
While developing the Financial data analyzer series, a dashboard became necessary for presenting the analyzed data intuitively and visually appealingly. Although I'm not a UI/UX designer, I appreciate well-designed…
Technical note
Building an AI-powered Financial Behavior Analyzer with NodeJS, Python, SvelteKit, and TailwindCSS - Part 3: Transactions
This series's previous article saw us build an OAuth authentication flow via GitHub. In this article, we'll continue adding APIs to the backend and specifically, implementing all the APIs related to transaction…
Technical note
Building an AI-powered Financial Behavior Analyzer with NodeJS, Python, SvelteKit, and TailwindCSS - Part 2: GitHub OAuth
With the AI service completed, we now focus on setting up the base backend service. As outlined in the system's architecture, our main backend will be powered by Node.js with Express.js, using MongoDB as the database.
Technical note
TailwindCSS v4.0: Upgrading from v3 with some plugins
Recently, while building a personal blog started with Tailwind CSS v3.4, I was faced with the need to upgrade to the latest version of the utility-first library. Though this migration guide was helpful, I couldn't find…
Technical note
Building Slack UI with pure HTML5, CSS3 and JavaScript: The power of CSS grids and flexbox
Sometime last year, around October, I came across this post about Slack's biggest redesign. It looked quite appealing to me and I tasked myself to make a clone of this page