• Reactivity News #15

    In this edition: Svelte, Svelte Native, ClojureScript and PWAs.

  • Reactivity News #14

    Svelte Society has reached 10K Twitter followers. Cool! Over all feels like Svelte is gaining ground. There are suddenly a lot of posts about people migrating their blogs to Svelte and a lot of posts on how to build your blog in Svelte. If that's not a sign of the tipping point then I don't know what is!

  • SolidJS - a first look

    I've been watching and reading about SolidJS for the past year. The articles by its author are full of knowledge about the inner workings of JavaScript frameworks. No doubt that Ryan, the author, knows his JavaScript and web. I believe he has been a member of the Marko team and that framework is the fast!

  • Reactivity News #13

    In this edition: Svelte, Solid, Web Components and other interesting stuff.

  • Better Node.js management with ASDF

    For a long time I've relied on NVM to manage my Node.js versions. Later onc I switched to fnm. FNM is similar to NVM, but written in Rust. Both of them are good at what they do - managing Node.js versions, but that's about it. They are specialized tools.

  • Reactivity News #12

    It's May and it's Monday and it's also one year anniversary edition! Time flies! This issue's topics are a mix of alternative frameworks and languages, but first let's see what happened in Svelteverse.

  • Calculator fields in Svelte forms

    Sometimes, when working with forms in Svelte, there are situations where you need one input field to drive the value of another field. An example would be a blog editor where title form field generates the slug for the blog post. It acts as a driver for it.

  • Reactivity News #11

    It's first Monday of the month! This issue's topics are SvelteKit, Deno and writing reactive SSR apps without JavaScript, but first things first.

  • Why Webpack 5 is the best bundler for Svelte

    Many new bundlers have popped up lately. You have Vite, Snowpack, WMR to name a few and they are all good in their own way. But there is one bundler that's paved way for them alll, one that's been there for eternity, measured in Internet time, and it's Webpack.

  • Awesome form validation with Vest and Svelte

    When it comes to form validation I am a big fan of Vest validation library. It's modular, flexible and half the size of Yup. It also takes a slightly different approach to validation. If you ever written tests in Jest or Mocha before you will feel right at home.

  • Reactivity News #10

    Welcome to the March 2021 edition of Reactivity News. This edition covers SvelteKit, bundlers, forms, interesting projects found across the web and the mandatory Bad Joke of the Month.

  • Eslint, Svelte and TypeScript

    You never realize what value linting brings until you start using it. I was that developer once. Ignorant. Why use linter when you have svelte⁠-⁠check, right? Wrong! The TypeScript compiler won't either help you catch all errors. It will not whine about you naming your variables incorrectly. Nor will svelte-check, but a good linter will annoy the hell out of you until you learn to do things right.

  • Sapper server-side authentication with Auth0

    I hesitated to write this post since the announcement of SvelteKit and with it the slow death of Sapper. But who knows when SvelteKit will be released, so here is a short post on how to setup server-side authentication in Sapper.

  • Svelte's module scripts explained

    Svelte module script blocks have always been little mysterious to me. Sure, I use them all the time, but I never actually took the time to learn how they work.

  • How to setup Vim for Svelte development

    I like Vim. I like its simplicity, its ugliness. There is something appealing about its GUI constraints too.

  • RxJS beginner learning resources

    RxJS is such a wonderful technology. Seriously. It's too bad that not many people outside Angular use it. But I totally get it. The entry bar is really high. Some say it's even higher than Vim's.

  • How to send transactional HTML emails with Mailgun, Handlebars and Firebase

    If you are building any serious app chances are big that you have to send some emails. I needed to send transactional emails for a web app I am building, so I reached for the trusted Mailgun.

  • Transforming an object to array in JavaScript

    When working with objects in JavaScript sometimes it's convenient to transform them to arrays. In this short post I will show you how to do it in plain JavaScript and also with Rambda.js.

  • Snowpack for Svelte development revisited

    As I am writing this I realize that I have no good introduction. This is another post about finding the best bundler for Svelte and this time it's Snowpack's turn to be evaluated.

  • Managing Svelte UI state with Robot FSM

    Ever worked with building complex UIs? If yes, you probably know how challenging it can be to keep track all UI states. It's very easy to end up with a big hairy ball of all the state variables.

  • Learn Fast, Earn Fast

    Life is all about continuous learning. You are always learning something new whether you like it or not. If you don't, you quickly become outdated. You don't learn, you don't earn.

  • Tailwind UI dropdown menu - React vs Svelte

    The other day I was prototyping a new internal app at work in React using Next.js. To get it off the ground quickly I used Tailwind CSS. In my app I needed to create a simple dropdown menu and I looked at the Tailwind UI example on how they did it.

  • Svelte, PostCSS and TypeScript with Svite bundler

    Svite has been on my radar for quite some time now and I finally found some time to play with it. I was surprised by the results.

  • Solid Sapper setup with PostCSS and Tailwind

    While it's straight forward to integrate PostCSS and Tailwind into plain Svelte projects, Sapper is a totally different beast. There are many moving parts. Rollup configuration is super complex, code is generated. It can be hard to grasp what's going on.

  • Would you recommend Svelte and what router do you like?

    The other day I received an email from a reader with a few interesting questions and I thought I would share my answer as a blog post. Hope you find it interesting as well. It's about Svelte, Sapper, SSR vs SPA and Svelte router recommendations. Raw and unedited.

  • Is Vite currently the best bundler for Svelte?

    Testing different bundlers for Svelte development is an odd hobby of mine. I like my development environments smooth as butter and my feedback loops tight.

  • 9 Neat ES Features That Save You Lots of Typing

    Believe it or not, many of the Javascript syntax features that developers take for granted today did not exist in the language just a few years ago.

  • Firebase authentication with XState and Svelte

    This is a follow-up to my previous article on Firebase authentication. I was not satisfied with the binary solution and decided to enhance it with XState.

  • Firebase authentication with Svelte

    Most apps need some kind of authentication, but authentication is hard to get right. You can either do it yourself or use an off-the-shelf solution. The most popular ones are Google Firebase and Auth0. Both are free to use for smaller apps.

  • How to build a Todo app with RxJS, Svelte and Firebase

    In my previous article on local Firebase setup I created a simple Todo app as an example. Today, I plan to take it further and create a full blown Todo app.

  • Building a notification center with Svelte stores

    You have seen them everywhere. That little bell icon in the upper right corner with unread messages count. Learn to build one with the help of Svelte stores and Tailwind CSS.

  • Ace your first job interview

    You don't get a second chance to make a first impression. The person you meet makes a judgement of you in just a few seconds, if even that long. How can you make sure you nail it?

  • Smooth local Firebase development setup with Firebase emulator and Snowpack

    Setting up Firebase for local development is not too hard, but it's pretty tedious to connect everything together. I had to go through this for one of my side projects and documented the steps on the way. Read on to find out how to start local Firebase firestore and functions emulator together with Snowpack with just one command.

  • Svelte form validation with Yup

    Form validation is hard. That's why there are so many different form handling libraries for the popular web frameworks. It's usually not something that is built-it, because everyone has a different need and there is no one-fit-all solution.

  • 5 essential job application tips from a CTO

    After seeing a little too many poor job applications recently I feel that I need to put my CTO hat on. Learn how you can increase your chances by 500% of getting the interview by following few simple tips.

  • Svelte bind directive explained in-depth

    I spent a few hours digging into Svelte's bind directive statement with focus on forms. Read on if you want to want to learn more!

  • Recreating a classic FRP tutorial with Svelte and RxJS

    The best way to learn something is to recreate it from scratch. Actually type out the code. This way you brain will have time to process and understand while your fingers move.

  • Snowpack with Svelte, Typescript and Tailwind CSS is a very pleasant surprise

    I like bundlers. Correction, I like fast bundlers. Bundlers that help me tighten the feedback loop and help me focus on the code. Not bundlers that make me doze off, waiting for the recompilation to finish, while my CPU fan sounds like an old hair dryer.

  • 3 different ways of cross-component communication in Svelte

    How do you pass data between Svelte components? How do you communicate between children and parents? For example, when you need to trigger some action or change state in the parent from a child component. A typical case is to toggle Svelte component's visibility from itself when the visibility state lives in the parent.

  • How to use Typescript with Svelte (updated)

    With the official Typescript support in Svelte in place we can finally have turtles all the way down! The only things required are proper tools and plugins. Read on to learn more.

  • Rollup vs Parcel vs Webpack for Svelte development

    Which one of the three most popular Javascript bundlers is the best for Svelte? I compared Rollup, Parcel and Webpack so you don't have to.

  • Accessible switch toggle button with svelte.js and tailwind.css

    Sometimes, when working with forms, you might want to style your checkboxes to something more fancy than browser defaults. In this article you will learn how to create a switch button in Svelte with the help of tailwind.css.

  • Svelte routing with Page.js, Part 2

    Welcome to the second and final part of the series of routing with page.js. In the first part we got the basic routing in place and in this part we will finish what we started. More specifically we will implement:

  • Svelte routing with Page.js, Part 1

    There are many routing solutions for Svelte out there. Some are better than others. I remember Rich Harris tweeted something that many people in Svelte community use page.js - an old, small, simple and battle tested routing lib by TJ, the orginal creator of the express.js web framework.

  • The use for use in Svelte

    Recently I stumbled upon this beautiful login form made with Tailwind CSS. It has some Javascript code beside CSS to achieve the desired animation.

  • If Svelte and RxJS had a baby

    If Svelte and RxJS had a baby maybe she would grow up to become a React slayer one day. Because Svelte got the looks and elegance and RxJS got the brains. But first, let's see if the potential parents are a good match for each other.

  • Svelte Auth0 integration in 66 LOC

    Yep, you read correctly. Pathetic 66 lines of code. You think I am lying? Well, code analysis tools don't lie. Let's ask one.

  • Svelte + Tailwind + Parcel = Awesome!

    I must admit that Rollup.js, that default Svelte projects use, never grew on me for some reason so I decided to give Parcel a try. Let's see how to setup a new Svelte project using it. While on it we will also include some other useful tools and plugins on the way.

  • Let's Build a Svelte fullscreen component

    Sometimes you have the need to go fullscreen, especially when building some fun internal dashboards. Because, you know, they are fun to build. Useful too. So why not build one in Svelte for a change? Let's see how easy it is to slap together a fullscreen component with this awesome framework.