<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/">
    <channel>
        <title>Taran Bains Newsletter</title>
        <link>https://taranveerbains.kit.com/posts</link>
        <description>Latest updates from Taran Bains</description>
        <lastBuildDate>Thu, 02 Oct 2025 00:28:57 GMT</lastBuildDate>
        <docs>https://validator.w3.org/feed/docs/rss2.html</docs>
        <generator>https://github.com/jpmonette/feed</generator>
        <language>en</language>
        <copyright>Taran Bains</copyright>
        <item>
            <title><![CDATA[September 2025 - "tearing it up" Newsletter!]]></title>
            <link>https://taranveerbains.kit.com/posts/september-2025-tearing-it-up-newsletter</link>
            <guid isPermaLink="false">https://taranveerbains.kit.com/posts/september-2025-tearing-it-up-newsletter</guid>
            <pubDate>Thu, 02 Oct 2025 00:28:57 GMT</pubDate>
            <content:encoded><![CDATA[<table><tbody><tr><td><h2>Quote of the month</h2><div><div>Friends hold a mirror up to each other; through that mirror they can see each other in ways that would not otherwise be accessible to them, and it is this mirroring that helps them improve themselves as persons.</div><div><strong>​<br />Aristotle</strong></div></div><p>Holy hell, friends, this quote hit pretty hard this month! To be honest, and this might have been apparent from my last newsletter broadcast, but I was definitely working my way through a funk. But thanks to some very astute words from a pretty good friend of mine, I was able to improve myself as a person. </p><p>This friend held the mirror up to me and, through not so many words, described the kind of person that I had become. I am eternally grateful, or at least I'm grateful for now, to this friend for helping me see the faults that had not become apparent to me. </p><p>Friends hold up a mirror. This month, one of mine showed me truths I hadn’t seen in myself. It stung, but in a good way — like a reset. Habits slip slowly, and sometimes we need those pointed words to bring us back.</p><p>​</p><h2>What I learned this month</h2><p>I know it's light. Deal with it  😆.</p><ul><li><span>Sep 12, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-09-12-css-nth-tester" target="_blank">css nth tester</a>​</span><ul><li><span>TIL about this neat little tool that lets you test your CSS nth-child and nth-of-type selectors.</span></li></ul></li><li><span>Sep 17, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-09-17-user-valid-and-user-invalid" target="_blank">:user-valid and :user-invalid</a>​</span><ul><li><span>TIL about <code>:user-valid</code> and <code>:user-invalid</code> pseudo-class selectors! They function similarly to <code>:valid</code> and <code>:invalid</code> but <code>:user-valid</code> and <code>:user-invalid</code> are only applied only after a user has significantly interacted with the input. In the example below, you’ll notice that the first two inputs will not have any border styling applied until the user has interacted with the input. Conversely, the last two inputs will have border styling applied immediately 🫢.</span></li></ul></li><li><span>Sep 28, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-09-28-google-stitch" target="_blank">google stitch</a>​</span><ul><li><span>TIL about <code>Stitch</code>, an AI-powered tool that helps application developers (like me 😎) build pretty high-quality UIs that we can then export to Figma. I’m using it right now to help me build out a UI for a course platform for our jiu-jitsu school.</span></li></ul></li></ul><p>​</p><h2>Articles worth checking out... for the month</h2><ul><li><span>🔥 <a href="https://www.youtube.com/watch?v=9UZalK6jvP4" target="_blank">[video] - Frontend Fire; cracking the web dev interview</a> -- This podcast episode definitely left me more aware of the current state of the hiring practices in our industry. And yeah, I'm pretty shocked by how even after almost a decade of interviewing, the interview process is still as broken as ever 😭.</span></li><li><span>🥳 <a href="https://tanstack.com/blog/announcing-tanstack-start-v1" target="_blank">[article] - TanStack Start v1 is coming soon to a machine near you</a> -- I've always been a big supporter and fan of the TanStack libraries (ever since React Query) and their ecosystem as a whole, so I'm super excited to see their metaframework play almost hit v1. </span></li><li><span>🤔 <a href="https://www.reddit.com/r/nextjs/comments/1nueacb/vercel_controversy_ethics_backlash_and_a/" target="_blank">[politics] - Maybe don't take pictures with divisive world leaders?</a> -- Given how the <a href="https://x.com/boycatapp/status/1973056113546322279" target="_blank">current CEO of Vercel is cozying up with Netanyahu of Israel</a>, some people are definitely feeling a hankering to move off of Vercel and onto a platform that's a little bit more politically aligned with themselves. I swear, people, y'all should just listen to HR and remember, treat Politics and Religion as topics to avoid when you're at work 😅</span></li></ul><p>​</p><h2>Tooling</h2><table><tbody><tr><td><figure><div></div><figcaption>Google stitch</figcaption></figure></td></tr></tbody></table><p>I’m probably the last person to hype up AI or call something a “game changer,” but honestly, <a href="https://stitch.withgoogle.com/" target="_blank">Google Stitch</a> has been just that for me.</p><p>As an engineer, I’m overflowing with project ideas and applications I want to build, but one thing always slows me down: I have zero visual design skills 😂. I’d rather spend my time coding, not agonizing over layouts and mockups. At the same time, I don’t want to throw together a half-baked app with no thought behind the routes or pages. That friction often stops me from even starting.</p><p>This is where <a href="https://stitch.withgoogle.com/" target="_blank">Google Stitch </a>comes in. I just describe what I want — the routes, the pages, the flow — and it generates the designs. For example, I’m currently building a Brazilian Jiu-Jitsu course content platform. I explained my vision, fine-tuned the outputs a bit, and suddenly I had usable designs that let me focus on actually building.</p><p>For me, this solves two big problems: </p><ol><li><span>I don’t have to pay a designer upfront for a product that may or may not make money. </span></li><li><span>I still get something tangible to look at, which keeps me motivated and focused on the fun part — coding.</span></li></ol><p>If you’ve been sitting on an idea but lack design skills (like me), <a href="https://stitch.withgoogle.com/" target="_blank">Google Stitch</a> is worth trying. It just removes that initial barrier to entry.</p><p>​</p><h2>Snippet of the month</h2><div><pre>
<code><span>console</span><span>.</span><span>log</span><span>(</span><span>"Sorry y'all, I ain't got a snippet this time!"</span><span>)</span></code>
</pre></div><p>​</p></td></tr></tbody></table>]]></content:encoded>
            <enclosure url="https://embed.filekitcdn.com/e/bQpyDGpEtYyfrQXD3AqnZx/drbwoxcgGH4BJ13guZE6LP/email" length="0" type="image//e/bQpyDGpEtYyfrQXD3AqnZx/drbwoxcgGH4BJ13guZE6LP/email"/>
        </item>
        <item>
            <title><![CDATA[Reflect and Connect - "tearing it up" Newsletter!]]></title>
            <link>https://taranveerbains.kit.com/posts/reflect-and-connect-tearing-it-up-newsletter</link>
            <guid isPermaLink="false">https://taranveerbains.kit.com/posts/reflect-and-connect-tearing-it-up-newsletter</guid>
            <pubDate>Mon, 01 Sep 2025 00:03:14 GMT</pubDate>
            <content:encoded><![CDATA[<table><tbody><tr><td><h2>Quote of the month</h2><div><div>“I wish it need not have happened in my time," said Frodo.<br />"So do I," said Gandalf, "and so do all who live to see such times. But that is not for them to decide. All we have to decide is what to do with the time that is given us.”</div></div><p>Hey {{ subscriber.first_name }},</p><p>It’s been a few months since I’ve sent out a newsletter to all y’all fine folks, and some of you might be thinking, “It’s because he got lazy,” or “He just forgot about it.” But that’s not the case. Back in June, my family suffered a loss—my grandmother passed away.</p><p>What followed was a whirlwind: grieving, following through with the cultural traditions around loss, and reorienting myself to life without her. She was a big part of my everyday rhythm, someone I cared for and spent time with daily.</p><p>That’s why this exchange between Frodo and Gandalf feels so resonant. We don’t get to choose the times we live in or the challenges that come our way. But we do get to choose what we do with the time given to us.</p><p>For me, that meant slowing down. Allowing myself to feel the weight of everything. Permitting myself to stop grinding, stop pushing, and simply be fully present in the moment.</p><p>My friends, what I want to leave you with in this month’s quote is this: Allow yourself to be present, in whatever capacity you can. If you’re at 50%, then let yourself be at 50%. If you feel only 20% like yourself, that’s okay—be at 20%. You don’t always need to be at your best, and you don’t always need to be full throttle. Give yourself the space and the grace to embrace your own humanity in every season.</p><p>​</p><h2>What I learned this month</h2><p>My top pick of things I picked up this installment</p><ul><li><span>May 02, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-05-02-headless-ui" target="_blank">headless ui</a>​</span><ul><li><span>TIL about headless ui - a library from <code>tailwindlabs</code> that gives you access to unstyled ui components that integrate beautifully with <code>tailwind</code>. If you’re wondering how I found out about this, Wapplyzer revelead it to me 😆!</span></li></ul></li><li><span>May 05, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-05-05-show-your-react-router-routes" target="_blank">Show your react router routes</a>​</span><ul><li><span>too long for the newsletter… visit my site instead 😆</span></li></ul></li><li><span>May 05, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-05-05-ts-reset" target="_blank">ts-reset</a>​</span><ul><li><span>TIL about <code>ts-reset</code> - it’s like CSS resets but for TypeScript! Shout out to Matt Pocock (and the team) for this! Here’s an example of one of the rules: There are way more rules so I encourage you to give it a read and maybe incorporate it into your project!</span></li></ul></li><li><span>May 07, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-05-07-threadreader" target="_blank">threadreader</a>​</span><ul><li><span>TIL about <code>Threadreader</code>, a tool that helps you read Twitter threads way more easily. Oh sorry, it’s not Twitter anymore, it’s X. Whatever, Elon. Whatever the hell it’s called now, <code>Threadreader</code> will unroll the tweet storm into a single, cohesive, consumable chunk of content.</span></li></ul></li><li><span>May 09, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-05-09-so-much-raycast" target="_blank">So. Much. Raycast</a>​</span><ul><li><span>Okay, I know what you’re thinking. Another today I learned about Raycast 😅. But hear me out, this YouTube video that I’m about to link you to is bonkers. Like I said before, this is the tool that our Macs should have shipped with because finder just can’t compare! There are over a hundred cool things you can do with Raycast… and I’ve just scratched the surface because, oof, there’s so much cool stuff and so little time 😂. https://youtu.be/NuIpZoQwuVY</span></li></ul></li><li><span>May 19, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-05-19-supabase" target="_blank">supabase</a>​</span><ul><li><span>Today I learned about Supabase, an open source alternative to Firebase. It being open source also means I can self-host it, which I love ❤️. But anyways, I played around with it this weekend in an attempt to build out a proof of concept for a course platform I want to build out for my Brazilian Jujutsu business, and I have to say I’m quite impressed 🤯.</span></li></ul></li><li><span>May 28, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-05-28-clipboard-js" target="_blank">clipboard.js</a>​</span><ul><li><span>TIL about clipboard.js, a library that allows you to copy text to the clipboard. It’s pretty simple to use, it’s also pretty lightweight, and it’s declarative af.</span></li></ul></li><li><span>May 29, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-05-29-open-source-secrets-management" target="_blank">open source secrets management</a>​</span><ul><li><span>TIL about infisical, an open source secrets management platform. It allows you to easily store and manage your secrets across your team and tech stack. And oh, did I mention that you can self-host it too? 😎</span></li></ul></li><li><span>Jul 23, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-07-23-ai-resume-matcher" target="_blank">Ai Resume Matcher</a>​</span><ul><li><span>TIL about Resume Matcher, a full stack web app, that you have to run locally, that will reveal your resumes compatibility score and crucial keywords 😎. It’s still in active development, and to be honest, I had to do a little finagling to get it to work locally, but I’m really excited to see how it evolves. With the resumes I’ve used and job descriptions I’ve uploaded, I think the original scores that I got were pretty good but the updates the app suggested, like adding numerical data and percentages, definitely would have improved the overall appeal of my resume.</span></li></ul></li><li><span>Jul 28, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-07-28-tldr" target="_blank">tldr</a>​</span><ul><li><span>too long for the newsletter… visit my site instead 😆</span></li></ul></li><li><span>Aug 04, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-08-04-es-toolkit" target="_blank">es-toolkit</a>​</span><ul><li><span>TIL about <code>es-toolkit</code>, a modern alternative to <code>lodash</code> and <code>underscore</code>. It promises improved performance (potentially 2-3 times faster), smaller bundle size (~97% less than lodash), and even offers a compatibility layer to ease the transition for existing codebases from <code>lodash</code> to <code>es-toolkit</code>.</span></li></ul></li><li><span>Aug 14, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-08-14-dyad" target="_blank">dyad</a>​</span><ul><li><span>TIL about <code>dyad</code>, a free and open source alternative to things like V0, Lovable, and Bolt. If you don’t know what these tools are, they’re basically AI powered web app builders that allow people to create apps with natural language.</span></li></ul></li><li><span>Aug 27, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-08-27-ebooks-to-audiobooks" target="_blank">ebooks to audiobooks</a>​</span><ul><li><span>TIL that you can convert ebooks to audiobooks with <code>audiblez</code> 📚!</span></li></ul></li><li><span>Aug 31, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-08-31-beacon-api" target="_blank">Beacon API</a>​</span><ul><li><span>TIL about the <code>Beacon</code> API! It’s a way to send asynchronous and non-blocking requests to a web server. It’s useful for sending analytics data to a server before the page is unloaded!</span></li></ul></li></ul><p>​</p><h2>Articles worth checking out</h2><p>Le things that grabbed my attention this month!</p><ul><li><span>⚠️<a href="https://github.com/nrwl/nx/security/advisories/GHSA-cxm3-wv7p-598c" target="_blank">Nx had a security vulnerability! </a>- A malicious version of `nx` and supporting plugin packages were published to npm that scan the user's file system for credentials and posts them to a GitHub repo under the user's account. Scary stuff 🤨</span></li><li><span>🤔<a href="https://www.theregister.com/2025/08/21/aws_ceo_entry_level_jobs_opinion/" target="_blank"> AWS CEO thinks replacing junior staff is the dumbest thing he's ever heard</a> - If you don't know where I stand on AI replacing humans, I think the AWS CEO and I are on the same page -- we need humans in the loop and failing to train up the next generation because "AI is going to do everything" is one of the dumbest statements a person can make. </span></li><li><span>💪 <a href="https://aaronfrancis.com/2024/what-if-you-tried-hard-dac139a5" target="_blank">What if you tried hard</a> - This post by Aaron Francis reminded me that I needed to get back on the grind and start intentionally living my life again -- off autopilot. Great read! </span></li></ul><p>​</p><h2>Tooling</h2><table><tbody><tr><td><figure><div></div><figcaption>Cleanshot X</figcaption></figure></td></tr></tbody></table><p>Alright, my tool of the month is CleanShot. It is my preferred tool for taking screenshots on my Mac!<br />​<br />Why I love it:</p><ul><li><span>Blur sensitive content</span></li><li><span>Add annotations quickly and cleanly</span></li><li><span>Capture scrolling screenshots</span></li><li><span>Record GIFS and screen recordings easily</span></li></ul><p>The only downside? You might not be able to install it at your workplace (I'm not able to 😂) because we take enterprise security very seriously! But if you can install it, I highly encourage you to give it a spin. </p><p>​<a href="https://cleanshot.com/" target="_blank">https://cleanshot.com/</a>​</p><p>​</p><h2>Snippet of the month</h2><p>Sometimes the best “script” you can run is one that reminds you to chill. Run this in your browser.</p><div>
<pre>
<code><span>// Sometimes the best productivity hack is... no hack at all.</span>
<span>function</span> <span>relax</span><span>(</span><span>)</span> <span>{</span>
  console<span>.</span><span>log</span><span>(</span><span>"Take a deep breath. You're doing fine."</span><span>)</span><span>;</span>
  console<span>.</span><span>log</span><span>(</span><span>"Not every moment has to be optimized."</span><span>)</span><span>;</span>
  console<span>.</span><span>log</span><span>(</span><span>"Give yourself permission to just be."</span><span>)</span><span>;</span>
<span>}</span>

<span>relax</span><span>(</span><span>)</span><span>;</span></code>
</pre></div></td></tr></tbody></table>]]></content:encoded>
            <enclosure url="https://eshop.macsales.com/blog/wp-content/uploads/2023/03/image_001_CleanshotX_app_icon.png" length="0" type="image/png"/>
        </item>
        <item>
            <title><![CDATA[April 2025 - "tearing it up" Newsletter!]]></title>
            <link>https://taranveerbains.kit.com/posts/april-2025-tearing-it-up-newsletter</link>
            <guid isPermaLink="false">https://taranveerbains.kit.com/posts/april-2025-tearing-it-up-newsletter</guid>
            <pubDate>Thu, 01 May 2025 03:00:08 GMT</pubDate>
            <content:encoded><![CDATA[<table><tbody><tr><td><h2>Quote of the month</h2><div><div>“The wound is the place where the Light enters you.”<br /> — <em>Rumi</em></div></div><p>Hey {{ subscriber.first_name }}!</p><p>This quote hit especially hard for me this month. Even though it was my birthday, life didn’t cut me a break. I needed this reminder: pain, fear, and suffering aren’t just things to endure—they’re openings.</p><p>When we sit with our pain and learn from it, it can shape us into someone softer. Kinder. Because when you've been through it, you don’t want others to suffer the same. That’s where the light gets in—right through the wounds.</p><p>The wound hurts. But it’s also the doorway..</p><h2>What I learned this month</h2><p>Admittedly, this month was a little light! It was my birthday month, so grabbing new knowledge fell to the back burner 🥲!</p><ul><li><span>Apr 07, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-04-07-easy-stacking-in-css" target="_blank">easy stacking in css</a>​</span><ul><li><span>TIL, it’s pretty easy to stack elements in CSS, without having to use positioning! It’s a little bit more verbose to do it in tailwind, but it’s the same idea. <code>css  .parent { display: grid; }  .child { grid-area 1 / 1 } </code></span></li></ul></li><li><span>Apr 22, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-04-22-rbac-in-js" target="_blank">RBAC in JS</a>​</span><ul><li><span>TIL about a role based access control (RBAC) library in JavaScript. <a href="https://casl.js.org/v6/en/guide/intro" target="_blank"><code>CASL</code></a> is a library that allows us to declaratively restrict access to resources based on roles and permissions. </span></li></ul></li><li><span>Apr 25, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-04-25-c15t-consent-management" target="_blank">c15t (consent management)</a>​</span><ul><li><span>TIL about c15t, a new consent management framework with some awesome React support! You can even self-host it (which is a major win for nerds like me)</span></li></ul></li></ul><h2>Articles worth checking out... for the month</h2><p>Le things that grabbed my attention this month!</p><ul><li><span>🤖 <a href="https://www.epicai.pro/letting-ai-interface-with-your-app-with-mcps-talk" target="_blank">[video] - Letting AI interface with Your App with MCPS.</a> My boy, Kent C. Dodds, is shifting to educating us all on AI and how the model context protocol (MCP) is going to enable a "Jarvis" like future.</span></li><li><span>⚡ <a href="https://react.dev/blog/2025/04/21/react-compiler-rc" target="_blank">[article] - React Compiler Release Candidate!</a> We've been waiting for this bad boy to launch since 2021 and the announcement of a new release candidate means we're pretty damn near to a stable version. Pretty soon, we'll be able to optimize the heck out of our apps and hopefully see some sweet, sweet performance gains. </span></li><li><span>📝 <a href="https://2025.stateofai.dev/en-US/" target="_blank">[survey results] - The State of Web Dev AI</a>. The results will shock you. Well, maybe? </span></li></ul><h2>Tooling</h2><table><tbody><tr><td><figure><div></div></figure></td></tr></tbody></table><p>This month’s tool highlight is <strong>Superwhisper</strong>—and believe it or not, I’m using it to help write this very newsletter. If the tone feels a bit more conversational than usual, that’s why. Superwhisper is doing the heavy lifting.</p><p>I love having AI tools that not only help me write code but also make it easier to interface with my computer. With Superwhisper, I can quickly draft blog posts, respond to emails, and just generally get content out faster. I speak faster than I type, so using a tool like this is a no-brainer.</p><p>There are a few other players in this space—like <strong>Wispr Flow</strong>, which I used before—but I’ve really taken to Superwhisper. It’s free, supports local-first models, and runs directly on my MacBook Pro. For someone like me who loves self-hosting, that’s an all-around win.</p><h2>Snippet of the month</h2><div><pre>
<code><span>const</span> <span>NewFeature</span> <span>=</span> <span>(</span><span>)</span> <span>=&gt;</span> <span>{</span>
    <span>// fallback to the old experience if the new experience fails</span>
    <span>return</span> <span>(</span>
        <span>&lt;</span>ErrorBoundary fallback<span>=</span><span>{</span><span>&lt;</span>FeatureB <span>/</span><span>&gt;</span><span>}</span><span>&gt;</span>
            <span>&lt;</span>FeatureA <span>/</span><span>&gt;</span>
        <span>&lt;</span><span>/</span>ErrorBoundary<span>&gt;</span>
    <span>)</span>
<span>}</span></code>
</pre></div><p>This is one of those patterns that feels obvious in hindsight: if a new feature fails, just fall back to the old one. We’ve defaulted to generic error components during A/B tests, but… why? If a reliable version exists, use it. </p></td></tr></tbody></table>]]></content:encoded>
            <enclosure url="https://embed.filekitcdn.com/e/bQpyDGpEtYyfrQXD3AqnZx/2Psu7Y23ioNbHRqt1qu7kv/email" length="0" type="image//e/bQpyDGpEtYyfrQXD3AqnZx/2Psu7Y23ioNbHRqt1qu7kv/email"/>
        </item>
        <item>
            <title><![CDATA[March 2025 - "tearing it up" Newsletter!]]></title>
            <link>https://taranveerbains.kit.com/posts/march-2025-tearing-it-up-newsletter</link>
            <guid isPermaLink="false">https://taranveerbains.kit.com/posts/march-2025-tearing-it-up-newsletter</guid>
            <pubDate>Tue, 01 Apr 2025 01:21:49 GMT</pubDate>
            <content:encoded><![CDATA[<table><tbody><tr><td><h2>Quote of the month</h2><div><div>I dreamt and saw life was joy. I awoke and saw life was duty. I acted, and behold duty was joy. </div></div><p>To put it another way, fulfilling your responsibilities can surprisingly bring you happiness. Like most things in life, this is easier said than done. God knows I've been having a bit of a rough go fulfilling my duties at home, at work, and of course with a new business endeavor that I'm working on with my older brother (more on that later in the year 😆)! <br />​<br />Rather than getting all stressed out about all the things I have to do, I realized that yes, I do have obligations and responsibilities that I need to fulfill, but similar to Sisyphus pushing that boulder up that hill for eternity, me fulfilling my duties -- which honestly are never-ending -- <strong>can</strong> bring me joy. If Sisyphus himself found his joy and his happiness with pushing that damn boulder up that hill, I've got no reason to complain. </p><p>Dear reader, that's not to say that we shouldn't feel the full weight of our burdens, but rather that we should strive to do our best to fulfill the duties that are laid out in front of us and to have fun while doing it. Believe it or not, if you start pretending like something is fun and acting like it's fun, it sometimes can actually become fun. 🕺<br />​<br />So how bout it? Let's have some fun this upcoming April!</p><h2>What I learned this month</h2><p>I try to learn something new every day... hopefully, some of this is useful to you as well!</p><ul><li><span>Mar 03, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-03-03-system-font-stack" target="_blank">System Font Stack</a>​</span><ul><li><span>TIL about a growing movement on the web where people are choosing to use system fonts instead of loading custom fonts. Over the years, the default system fonts included with operating systems have become quite robust and visually appealing. If you’re concerned about performance or don’t require a fancy web font, this could be a great solution for you.</span></li></ul></li><li><span>Mar 04, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-03-04-tanstack-form" target="_blank">Tanstack Form</a>​</span><ul><li><span>TIL: Tanner Linsley, the creator of TanStack Query, Router, and Start, just dropped TanStack Form! True to form, <em>it’s framework-agnostic, headless, and has zero dependencies</em>. It also handles deeply nested objects out of the box, making it a powerful alternative to traditional form libraries.</span></li></ul></li><li><span>Mar 05, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-03-05-fontsource" target="_blank">Fontsource</a>​</span><ul><li><span>TIL about <code>Fontsource</code>, a free Vercel resource that provides you with information on how to easily install and <code>self-host</code> web fonts. They support all Google Fonts, as well as open-source ones!</span></li></ul></li><li><span>Mar 07, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-03-07-better-sleep" target="_blank">Better Sleep</a>​</span><ul><li><span>TIL about <code>Magnesium Glycinate</code>, a supplement that helps promote better sleep! I’ve been having a tough time falling asleep lately, especially after a tough Brazilian Jiu Jitsu practice, or an intense workout. One of my friends recommended <code>Magnesium Glycinate</code> as a way to help me sleep better. Let’s see how it works… I just ordered some today 😆!</span></li></ul></li><li><span>Mar 13, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-03-13-typescript-ported-to-go" target="_blank">Typescript Ported To Go</a>​</span><ul><li><span>TypeScript’s compiler is being reimagined. Currently at version 5.8, TypeScript is still written in TypeScript itself, but there are plans to port it to Go for version 7. This change promises to improve compilation times—by up to 10 times faster! True, the speed boost is something we probably won’t see for a few months or years, but I’m super excited to see <code>Go</code> get some much needed love and attention, since you know, it’s my secondary language of choice. https://www.youtube.com/watch?v=PQ2WjtaPfXU</span></li></ul></li><li><span>Mar 14, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-03-14-node-modules-inspector" target="_blank">Node Modules Inspector</a>​</span><ul><li><span>TIL about the <code>node-modules-inspector</code> – a package that allows you to visualize your node_modules folder, inspect your dependencies, and so much more 🤯! I’m a big fan of the visualizations, since I’m more of a visual kinda person. You can use it in your own project with this simple command: <code>npx node-modules-inspector</code>.</span></li></ul></li><li><span>Mar 21, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-03-21-optional-chaining" target="_blank">Optional chaining</a>​</span><ul><li><span>I learned this hard lesson today. <em>Optional chaining is for uncertain values — not uncertain existence.</em> If I’m not sure if a global object exists, I can’t rely on optional chaining to access it. I have to check for existence first. </span></li></ul></li><li><span>Mar 22, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-03-22-coolors-co" target="_blank">coolors.co</a>​</span><ul><li><span>TIL about <code>coolors.co</code> — a superfast color palette generator. If you’re anything like me, you’ll probably use it whenever you need to generate a color palette for your side projects, you know, those side projects that you’re totally working on and not abandoning for a while.</span></li></ul></li><li><span>Mar 24, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-03-24-rss-feed-generator" target="_blank">rss feed generator</a>​</span><ul><li><span>TIL about <code>feed</code>, an npm package that allows you to quickly generate an RSS feed for your website! I used it to generate an RSS feed for my blog and my TIL feeds! It’s pretty simple and super easy to plug into your existing project.</span></li></ul></li></ul><h2>Articles worth checking out</h2><p>Le things that grabbed my attention this month!</p><ul><li><span>⚔️ <a href="https://eduardoboucas.com/posts/2025-03-25-you-should-know-this-before-choosing-nextjs" target="_blank">A critique of the NextJs framework and its latest security vulnerability</a>. As if I needed more reasons to avoid NextJs 😆 (JK it's great but not the tool for me).</span></li><li><span>​<a href="https://www.youtube.com/watch?v=SDuvi5eUqp0&amp;t=2s" target="_blank">🚀 [video] - a live stream of epic web conference... I have so much fomo regarding this one particular event 🥲</a> </span></li><li><span>​<a href="https://www.reddit.com/r/reactjs/comments/1jlu01u/styledcomponents_entering_maintenance_mode/" target="_blank">💅 [reddit] - styled components enters maintenance mode!</a> Some claim it's bad for the environment and JS devs are responsible for deforestation. Wild. 🤯</span></li><li><span>​<a href="https://sergiodxa.com/tutorials/use-middleware-in-react-router" target="_blank">🚧 react router middleware is getting production ready</a>. Funny, because middleware is definitely in the hot seat this month. Hopefully, they get this right- we've been waiting for this feature for quite a while! </span></li></ul><h2>Tool time with Taran</h2><table><tbody><tr><td><figure><a href="https://ghostty.org/" target="_blank"></a><figcaption>ghostty - a feature-rich terminal emulator</figcaption></figure></td></tr></tbody></table><p>This month’s pick: a new terminal emulator for your toolbelt — <em>Ghostty</em>. I’ve been blown away by its performance on both my home and work machines.</p><p>iTerm2 has served me well, but Ghostty has been phenomenal. It’s fast, packed with features, and has thoughtful touches like a built-in theme picker and excellent font rendering.</p><p>If you’re in the mood to try something new, I highly recommend giving Ghostty a spin.</p><h2>Snippet of the month</h2><p>The below piece of code was the cause of a nasty little bug that we didn't catch until it was <em>almost</em> too late! It ties back to one of my TILs, but I'm curious: can you spot the issue? Hint: it only happens in the node runtime... Give up?</p><div><pre>
<code>window<span>?.</span>localStorage<span>.</span><span>setItem</span><span>(</span><span>'key'</span><span>,</span> <span>'value'</span><span>)</span></code>
</pre></div><p>At first glance, optional chaining makes this look safe. But it's not. In Node, `<code>window`</code> isn’t defined at all — referencing it throws a <code>ReferenceError </code><em>before</em> optional chaining can even kick in. And so now you see see why that TIL from March 21, 2025, exists... 😅. </p></td></tr></tbody></table>]]></content:encoded>
            <enclosure url="https://embed.filekitcdn.com/e/bQpyDGpEtYyfrQXD3AqnZx/8UA5rk5EjqFkckVRXjMwjV/email" length="0" type="image//e/bQpyDGpEtYyfrQXD3AqnZx/8UA5rk5EjqFkckVRXjMwjV/email"/>
        </item>
        <item>
            <title><![CDATA[February 2025 - "tearing it up" Newsletter!]]></title>
            <link>https://taranveerbains.kit.com/posts/february-2025-tearing-it-up-newsletter</link>
            <guid isPermaLink="false">https://taranveerbains.kit.com/posts/february-2025-tearing-it-up-newsletter</guid>
            <pubDate>Fri, 28 Feb 2025 18:29:03 GMT</pubDate>
            <content:encoded><![CDATA[<table><tbody><tr><td><h2>Quote of the month</h2><div><div>If you want to improve, be content to be thought foolish and stupid.</div><div>​</div><div><strong>Epictetus</strong></div></div><p>This is something I always try to keep in mind when approaching a new subject or topic. We get so used to being competent that we forget what it feels like to be a beginner—foolish and stupid. But real improvement only comes from engaging with others: asking those more competent than us, whether individuals or the larger community.</p><p>Sure, maybe the person you're asking isn’t the nicest and mutters to themselves, "Jeez, what an idiot." So what? If you're doing it right, you only need to be thought foolish once. You ask, you learn, you move on—hopefully without needing to ask the same question again! </p><p>​</p><h2>What I learned this month</h2><p>I try to learn something new every day... hopefully, some of this is useful to you as well!</p><ul><li><span>Feb 05, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-02-05-leave-comments" target="_blank">Leave.Comments.</a>​</span><ul><li><span>More of a public service announcement and a reminder to myself (especially for my personal projects), to leave comments on any funky things you’re doing in code. I wasted an hour battling a bug in my blog because I didn’t leave a comment regarding a <code>@ts-ignore</code> directive. Leave. Comments. Please.</span></li></ul></li><li><span>Feb 08, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-02-08-css-tidbits" target="_blank">CSS tidbits</a>​</span><ul><li><span>too long for the newsletter… visit my site instead 😆</span></li></ul></li><li><span>Feb 08, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-02-08-css-stacking-context-inspector" target="_blank">CSS stacking context inspector</a>​</span><ul><li><span>TIL about the stacking context inspector. It’s a tool that allows you to inspect the stacking context of an element.</span></li></ul></li><li><span>Feb 09, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-02-09-bolt-new" target="_blank">bolt.new</a>​</span><ul><li><span>TIL about <code>bolt.new, an </code>AI-powered web agent that lets you deploy apps via Stackblitz. It’s a pretty sick way to throw up a demo of a new app to illustrate a concept.</span></li></ul></li><li><span>Feb 14, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-02-14-sqoosh" target="_blank">sqoosh</a>​</span><ul><li><span>TIL about a local first tool for image compression called <code>sqoosh</code>. No more sending images to random servers just to compress them! 😆.</span></li></ul></li><li><span>Feb 16, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-02-16-web-extension-framework" target="_blank">web extension framework</a>​</span><ul><li><span>TIL about <a href="https://github.com/wxt-dev/wxt" target="_blank">wxt</a>! It’s like Nuxt but for web extensions.</span></li></ul></li><li><span>Feb 19, 2025: <a href="https://taranveerbains.ca/til?offset=Infinity#2025-02-19-data-attribute-state-management" target="_blank">Data attribute state management</a>​</span><ul><li><span>This one’s pretty sweet and I’ve been reaching for it a lot lately at work! Rather than having multiple <code>className</code> conditions, you can use a <code>data-attribute</code> to manage your state. This is not only a <em>great</em> way to keep your component clean but also allows you to target any state pertinent to your component without JavaScript! Mind you, I’m assuming you’re using something like <code>Tailwind</code> for your styling. <code>tsx // no reliance on utility functions like `twMerge` &lt;div data-state-can-scroll={canScroll} className="data-[state-can-scroll=false]:hidden" &gt; Hidden when canScroll is false! &lt;/div&gt;</code></span></li></ul></li></ul><p>​</p><h2>Articles worth checking out</h2><p>Le things that grabbed my attention this month!</p><ul><li><span>🔫 <a href="https://socket.dev/blog/typescript-types-running-doom" target="_blank">Doom... running on TypeScript types only! Crazy. </a>​</span></li><li><span>🏀 <a href="https://sergiodxa.com/articles/throwing-vs-returning-redirects-in-react-router?ck_subscriber_id=1970107864&amp;utm_source=convertkit&amp;utm_medium=email&amp;utm_campaign=%E2%9A%9B%EF%B8%8F%20This%20Week%20In%20React%20#223:%20TanStack,%20React%20Router,%20React-Scan,%20Bun,%20Next.js,%20INP,%20Storybook%20%7C%20State%20of%20RN,%20Nitro%20Views,%20Reanimated,%20Gesture%20Handler,%20Screens,%20AWS-LC,%20QuickPush,%20Metro%20%7C%20TC39,%20CSS,%20TypeScript,%20Observables...%20-%2016747884" target="_blank">Throwing vs. Returning redirects in react router</a>​</span></li><li><span>​<a href="https://www.youtube.com/watch?v=3EnathFYgz8" target="_blank">⚡[video] - Using React-Scan to improve your apps performance</a>​</span></li></ul><p>​</p><h2>Tooling</h2><p>This month, I've been really loving <a href="https://www.raycast.com/" target="_blank">Raycast</a>; it's been a game-changer for me, from managing Pomodoro sessions to quickly fetching emojis and even controlling Spotify. It's one of those tools you don't know you need—until you do. Hopefully, you’ll see why this tool is so useful. I honestly do not know how I worked without this thing before 😃. </p><p>​</p><h2>Snippet of the month</h2><p>This little typescript hack here has been a real godsend for me over at work. Being able to get IntelliSense from my editor while also having the flexibility to throw in a truly random string value is more useful than you initially think it's going to be! Great when you need type safety but still want flexibility. </p><div>
<pre>
<code><span>type</span> <span>color</span> <span>=</span> <span>'red'</span> <span>|</span> <span>'blue'</span> <span>|</span> <span>'green'</span> <span>|</span> <span>(</span><span>string</span> <span>&amp;</span> <span>{</span><span>}</span><span>)</span>

<span>function</span> <span>getColor</span><span>(</span>c<span>:</span> color<span>)</span> <span>{</span>
	<span>console</span><span>.</span><span>log</span><span>(</span>c<span>)</span>
<span>}</span>

<span>getColor</span><span>(</span><span>'red'</span><span>)</span> <span>// editor will code complete this for you</span>
<span>getColor</span><span>(</span><span>'yolo'</span><span>)</span> <span>// this works!</span></code>
</pre></div></td></tr></tbody></table>]]></content:encoded>
        </item>
    </channel>
</rss>