Feed - Syntackle

Mac Setup For Developers [2024] 🔗

Setting up a new Mac for development can be a daunting task, especially if you are new to MacOS or don't know where to start. In this guide, I'll tell [...]

Better - An AI powered Code Reviewer 🔗

Code reviews have always been crucial in maintaining a standard and emphasizing on the best practices of code in a project. This is not a post about h [...]

Server Sent Events 101 🔗

Server Sent Events (SSE), as the name suggests, are a way to communicate with the client by keeping a persistent connection in which the server sends [...]

"this" Keyword in Arrow Functions 🔗

The this keyword in javascript is probably one of the most misunderstood concepts of javascript. There are already some brilliant resources out there [...]

5 Newsletters Every Developer Should Read 🔗

Newsletters can be hard to follow along, especially when you subscribe to too many of them. That's why, today you will get to know about five newslett [...]

I tried "window.ai" in Chrome 🔗

I never got chrome's built-in AI model working on Chrome's Canary release (maybe because I am on v128), so I tried Chrome's Dev Channel - thanks @theo [...]

Create a Node Server using Hono under 10 Lines of Code 🔗

Hono, as per the docs, was originally built for Cloudflare Workers. It's an application framework designed to work the best for cloudflare pages and w [...]

Integrate Pagefind's Search with Astro: A Complete Setup Guide 🔗

Pagefind's take on search is quite simple - index your site at build time and host it alongside your static site. The search index sits right alongsid [...]

Running PostgreSQL using Docker 🔗

Running PostgreSQL via Docker is one of the things you can do to quickly try postgresql without installing or configuring it locally. It's one of the [...]

Creating My First Web Component: The <back-to-top> Button 🔗

I came across the concept of web components, when I saw the word "WebC" in one of the Zach Leatherman's blog posts. Then, I came to know that: WebC is [...]

React 19 - A Brief Look At Form Handling 🔗

React 19 is finally here with it's stable release and it brings with it the support for custom elements (yayy! 🎉), better form handling with some new [...]

Static Sites Are Good 🔗

Gone are the days when you had to wait for quite a long time to fetch a server rendered HTML page. Single page applications (SPA) try to solve this pr [...]

Quokka in VS Code — JavaScript Debugging Made Simpler 🔗

Quokka.js is an awesome tool for prototyping your javascript code with the power of an instant inline output. It lets you code and see the output as y [...]

Issue With Watching File Changes in Docker 🔗

Days ago, I was struggling to get live reloading/hot reloading (HMR) working for the code mounted in a docker volume on Windows. Volumes in docker ser [...]

Chrome 121 Broke My CSS By Adopting New Scrollbar Properties 🔗

Recently, in version 121, Chrome started supporting standardized CSS scrollbar properties scrollbar-color and scrollbar-width mentioned in the CSS spe [...]

rssed — An RSS Feed Reader And Blogroll - Built Using Astro 🔗

RSS a.k.a Really Simple Syndication is a great technology to subscribe to website content. You can get the latest updates published on a website by pa [...]

Advent Of Code 2023 - Day Four Solution 🔗

It felt easier than the previous one to be honest, especially the first part. The puzzle is quite simple. For a given number of scratchcards, there ar [...]

Web Components & Custom Elements 🔗

Those familiar with React or any other javascript framework, are already aware of the component based architecture. You break the UI into re-usable pi [...]

Advent Of Code 2023 - Day Two Solution 🔗

Just wrapped up solving advent of code's day two challenge. This was a tricky one in terms of the language used to describe the puzzle. I had to take [...]

Completed Advent Of Code: Day One 🔗

Advent of Code 2023 is here and I just completed its day-one challenge. Overall, it was fun to play with strings and numbers in javascript. Without an [...]

App Defaults 2023 — What I use 🔗

The other day, I stumbled upon a post by @robb which in turn led me to this post about app defaults. Following the spree, here's my list of all the ap [...]

Elegant Console Logs With Consola 🔗

Console logs are not always well structured and eye-pleasing. Unpleasant and messy console takes away from the bliss of a developer. I recently came a [...]

Sharing Localhost From VS Code - Port Forwarding 🔗

Showing off what you built locally has never been easy. Sending localhost:3000 as a URL is like declaring a war. Hey, I built a website! [...]

Docker — Containerizing a Nextjs Application 🔗

Containerization in it's entirety is an incredibly useful concept. From being able to execute applications in isolation, to being able to port them ea [...]

WebSockets 101 🔗

WebSockets implement a full-duplex, bi-directional, TCP-based protocol, denoted by ws(s)://, which enables a persistent connection between the client [...]

Builder.io's Partytown with 11ty 🔗

Third party analytics scripts are generally included in the head section of HTML. It poses a performance threat because of render blocking nature of t [...]

Why I love Markdown 🔗

Markdown is one of those languages to which I was introduced when I started using github for hosting my projects. The famous README.md file got me int [...]

What is DOM diffing? 🔗

DOM, also known as the Document Object Model, is a programmatic representation of the contents of a web page. In other words, the content of a web pag [...]

Using Fontsource With 11ty 🔗

Dealing with fonts can get quite overwhelming. For quite some time, I was searching for a way to self host google fonts because the google fonts API's [...]

Creating Git Hooks Using Husky 🔗

Hooks in git are nothing but some code which can be executed at specific points during git execution process. They are used to verify everything is as [...]

Setting Background Color of Body Dynamically in React 🔗

In a single page application, you only have one body element and although you can specify the background color of body in a global stylesheet, it's no [...]

Minify JavaScript Using Terser 🔗

Terser is a javascript compressor and mangler supporting ES6+ specification. In this tutorial, you will get to know how to use terser to minify or com [...]

Deploying React App to Netlify 🔗

A react app is a single page application which means that there's only one document i.e. index.html file which is updated using javascript as per the [...]

Adding Custom Anchors to Headings in Markdown - Eleventy 🔗

Anchors are nothing but id attributes applied to an element to link to it using href attribute internally on the same page. By default, 11ty uses mark [...]

How to vendor prefix and minify CSS? 🔗

Writing CSS from scratch along with adding vendor prefixes can be a daunting task if done manually. Vendor prefixes can be easily added using the auto [...]

Eleventy - Shortcode for Embedding Codepen 🔗

Don't know what eleventy is? Before you read further, check out this amazing series of articles by Tatiana Mac to know more about eleventy and static [...]

5 Most Useful Visual Studio Code Extensions 🔗

Here are the five most useful Visual Studio Code extensions to improve your workflow as well as developer productivity! Error Lens CSS Peek GitLens Im [...]

Create and Deploy an Express.js App to Vercel 🔗

Vercel is a platform to host frontend applications and static sites but you can also host an express app using serverless functions. Supported framewo [...]

Optional Chaining in JavaScript 🔗

Optional Chaining in JavaScript is used to return undefined for accessing an object property that doesn't exist and whose parent property is nullish ( [...]

How to compile SASS into CSS and watch for changes? 🔗

SASS extends CSS which means that you can have all the features of CSS plus the features of SASS just like a cherry on top of a cake! Browsers don't u [...]

IIFE in JavaScript 🔗

You might be familiar with functions in JavaScript. An IIFE (Immediately Invoked Function Expression) is a special type of function which is invoked i [...]

Syntackle