David Dal Busco

Blog

New skills I have learned, technologies I have used, and tutorials I have followed. In my series of blog posts, I share the outcomes of my recent hobby work.

A New Chapter Awakens

I’ll be working full-time on Juno through 2025 thanks to support from the DFINITY foundation.

Nov 1, 2024

Make AI-generated image (kind of) from drawing

How to create SVG images with ChatGPT from hand-drawn sketches.

Apr 1, 2024

TIL Programming Ep1

In this episode, I learned about TypeScript string patterns and Node.js WASM metadata reading.

Feb 25, 2024

My Docker Cheat Sheet: A Newbie’s Toolkit

Simple Docker Commands for Everyday Development on a MacBook M2.

Jan 28, 2024

A Year in Code: My Frontend Work of 2023

A visual journey through the frontend projects I’ve build this year.

Dec 30, 2023

Data-Loading for Docusaurus Routes

A simple guide to building routes and loading data in Docusaurus projects, illustrated by a showcase example.

Dec 10, 2023

Essential JavaScript Functions for Detecting User’s Device Characteristics

Learn how to detect iOS, Android, fullscreen mode, Firefox, Safari, and more with JavaScript.

Nov 12, 2023

$: npm publish -if-needed

Publish a new version of your libraries on NPM only if changes have been made.

Oct 27, 2023

A Sass Mixin to Build Your Own CSS Framework à la Tailwind

Ready to craft a Sass mixin to generate your own class-based CSS approach for your app?

Sep 30, 2023

JSON Parse And Stringify: BigInt, Objects and Uint8Arrays

Learn JSON Handling for BigInts, Objects, and Uint8Arrays with Replacer and Reviver. Discover parsing, stringify, and testing strategies.

Aug 20, 2023

Passing an Async Function as a Parameter in Rust

Learn to pass async functions as callbacks in Rust, exploring traits like Fn, FnMut, and FnOnce

Aug 5, 2023

Automatic Candid Generation in Rust: Exploring the ic_cdk v0.10.0 Update

How to Automatically Generate Candid from Rust on the IC and Migrate Your Existing Project to Utilize the Latest Version of ic_cdk.

Jul 21, 2023

Exploring a Juno’s Web3 Dapp Architecture

I built a web app on the Internet Computer blockchain in a weekend with Juno. Check out my insights into the frontend architecture! 🛰️

Jun 23, 2023

Build a Web3 App with VueJS

Empower your dapp development: Unleashing Vue and Juno for Web3 decentralized applications.

May 24, 2023

Translate a Svelte app (i18n) without external dependencies

Adding internationalization support to a Svelte application: a step-by-step guide.

May 18, 2023

Fake video capture with Playwright

How to mock the camera for an End-to-End test that requires a video stream capture.

Apr 30, 2023

Develop An Angular App On Blockchain

How to create a Web3 decentralized application using Angular and Juno.

Apr 21, 2023

Build A Web3 App With React JS

How to develop a decentralized application on blockchain with React and Juno.

Mar 28, 2023

Automatically generate Candid from Rust on the IC

How to auto-generate the Candid declaration from Rust code on the Internet Computer.

Mar 12, 2023

Rust Trait: A Powerful Alternative To TypeScript Interface

Comparing TypeScript “interface” with Rust “trait” for simple, flexible, and composable code.

Mar 6, 2023

Introducing Juno. An Open Source Blockchain Platform For Frontend Devs 🚀

Launching a new open-source Blockchain-as-a-Service solution that makes building Web3 applications more accessible frontend developers.

Feb 14, 2023

Svelte Custom Stores TypeScript Declaration

Svelte offers some nice easy-to-use store concepts. One of those is the custom store but how to declare its types?

Jan 20, 2023

Product naming is hard 😩

Gosh, I finally got the name for my new side project. It will be called: Juno.

Jan 10, 2023

TypeScript: isNullish, nonNullish and assertNonNullish

Three little TypeScript assertion functions that have proven to be really useful.

Dec 30, 2022

Sass media queries mixins

A Sass media queries mixin to avoid duplicating CSS breakpoints all over the place.

Dec 22, 2022

Canister guard in Rust on the Internet Computer

Guard functions can be executed before updates and queries of canister smart contracts written in Rust on the Internet Computer.

Dec 15, 2022

Deploy Internet Identity locally

How to deploy the blockchain authentication system for the Internet Computer locally.

Nov 27, 2022

Migrate canister smart contracts from Motoko to Rust

I migrated 500+ canisters from Motoko to Rust on the Internet Computer. Here are the two major things I learned.

Nov 10, 2022

Few things to know before launching a SvelteKit app in prod

Content security policy, build reproducibility and polyfill. Few tips to know before going live with SvelteKit.

Oct 19, 2022

Poll canister on the Internet Computer

Repeatedly calls a function on the IC with web workers without decreasing your dapp frontend performance.

Oct 10, 2022

Prepare your dapps for social platform and SEO

A guide to set up dapps metadata, icons and social image for social media sites and search engines.

Sep 29, 2022

Compute sha256 of CSP <script/> in NodeJS

Automatically generate the SHA-256 hash of the script tags for the Content Security Policy

Sep 17, 2022

Having fun deconstructing the localstorage in TypeScript 🤙

Read stringified objects from the localstorage in TypeScript using fun stuffs such as deconstructing objects, assertion and generic

Sep 1, 2022

Install code in child canisters with NodeJS

How to upgrade smart contracts on the Internet Computer with JavaScript

Aug 11, 2022

ICP to cycles in JavaScript

How to programmatically convert ICP to cycles in NodeJS?

Jul 15, 2022

SvelteKit Web Worker

How to create and communicate with a web worker in SvelteKit and ViteJS

Jul 7, 2022

Build a library with esbuild (vol. 2)

A few new tips and tricks to build a library with esbuild

Jul 5, 2022

Create A Popover In Svelte

How to create a popover in Svelte without any other libraries or dependencies.

Jun 23, 2022

Announcing Papyrs: Blog on web3

I have developed a new open-source, privacy-first, decentralized blogging platform and today I am making it available to anyone.

Jun 16, 2022

Dynamically Create Canister Smart Contracts In Motoko

How to generate on-the-fly decentralized smart contracts on the Internet Computer.

May 10, 2022

A Frameworkless Store In TypeScript

Have you ever developed applications that have their API, services and state management fully separated from their core?

May 2, 2022

Call Internet Computer Canister Smart Contracts In NodeJS

How to query canister smart contracts on the Internet Computer in a NodeJS context.

Apr 22, 2022

Export To The File System (Save As...) + Fallback In TypeScript

How to save a file to the user's local devices with the new File System Access API and a fallback for incompatible browsers.

Feb 18, 2022

Stylo - Another Kind Of Rich Text Editor

So, I developed a new open source WYSIWYG interactive editor for JavaScript.

Feb 9, 2022

Converting SVG To Image (PNG, Webp, etc.) in JavaScript

How to convert SVG to image in the browser without dependencies.

Dec 23, 2021

A Simple KeyVal Store Implemented in Motoko

Build a generic keyval store for canister smart contract on the Internet Computer.

Nov 30, 2021

TypeScript Utilities For Candid

A collection of functions to handle Nullable, Date and Blob when interacting with canister smart contracts.

Nov 16, 2021

Bye-Bye Amazon & Google, Hello Web 3.0

We are migrating our web application to DFINITY's Internet Computer.

Oct 11, 2021

Dynamically Import ESM Modules From A CDN

Lazy load JavaScript code from a content delivery network to serve users only what they need when they need it.

Sep 27, 2021

Angular: The Single Rule To Get Better At RxJS

A guideline that helps develop Angular applications and libraries in a reactive programming way with RxJS.

Sep 10, 2021

Internet Computer: Web App Decentralized Database Architecture

An approach of the data persistence for web applications with the Internet Computer of the DFINITY foundation.

Aug 17, 2021

Singleton & Factory Patterns With TypeScript

The singleton and factory design pattern implemented with TypeScript, explained with a hairdresser and an ice creams shop examples.

Jul 26, 2021

We Received A Grant To Port Our Web App To The Internet Computer

Can our web editor for slides work on the futuristic internet of the DFINITY foundation? Let's figure it out.

Jul 6, 2021

The State Of Progressive Web Apps Adoption By Developers In 2021

Are PWA preached or adopted by developers? Do they use these on mobile and desktop? Do they develop these even if their support on iOS is not optimal? Do they think Apple will ever implement Web Push Notifications?

Jun 22, 2021

CSS nth- Selectors Variable

A practical hack to make CSS nth- selectors variable within Web Components.

Jun 9, 2021

Build A Library With esbuild

How to bundle ESM, IIFE or CommonJS libraries with esbuild.

May 24, 2021

The MutationObserver Web API

An introduction to the MutationObserver Web API which provides the ability to watch for changes being made to the document.

May 11, 2021

StorybookJS: Tips & Tricks

Import Markdown files as Docs only pages, use a CDN to load dependencies & sort stories.

May 5, 2021

Bundling Figma Plugin With Esbuild

Build a plugin for Figma with esbuild, the extremely fast JavaScript bundler.

Apr 20, 2021

Turn Your Figma Designs Into Animated Slides

Export your Figma frames to presentations with DeckDeckGo.

Apr 8, 2021

Stencil Component Translations

A quick way to set up i18n for Stencil components without dependencies.

Apr 5, 2021

Node.js: Unzip Async Await

Unzip a .zip file in an asynchronous Node.js context.

Mar 14, 2021

Tweet From GitHub Actions

Develop a Twitter Bot that runs in GitHub Actions.

Mar 5, 2021

Introducing DiscoverWeekly.dev: The Playlists Made By Devs

I developed an open source website to discover new music on a weekly basis without an algorithm.

Feb 22, 2021

How To Download A File With Node.js

If you ever need to download a file with Node.js, here is a small script to achieve your goal.

Feb 10, 2021

Build Gatsby Websites Using Firestore Data (Without Plugin)

Get Firestore data to build your Gatsby static website with flexibility.

Jan 21, 2021

A Little Scanner App Made With The Web

I developed a little scanner prototype with the web during Christmas holidays to learn and try new skills.

Jan 4, 2021

More Gatsby i18n Tips And Tricks

A follow-up to my article about the internationalization of Gatsby websites.

Dec 24, 2020

Copy URL To Clipboard On Npm Run Start

How to copy the start URL and parameters of your application to your clipboard while starting it locally.

Dec 11, 2020

Angular: Create A Lazy Loaded Tailwind Modal

Build a generic, lazy loaded, dialog with Angular and Tailwind CSS.

Nov 30, 2020

StencilJS & Web Worker: A Fairy Tale

The story of the Stencil's compiler and its magical integration of the Web Worker API.

Nov 19, 2020

App Store & Google Play: Submission Checklist

A bare minimum checklist of the information required to submit your application to the App Store and Google Play.

Nov 3, 2020

Recursively Clean Firestore FieldValue.delete()

How to recursively remove delete methods from the document's object you just updated and have in memory.

Oct 15, 2020

Angular State Management Without RxJS - An Experiment

Angular state management without RxJS - An Experiment. Can it be done with the Stencil Store?

Sep 14, 2020

Firebase Cloud Functions: Git Commands & GitHub GraphQL API

Execute Git commands, such as Clone or Push, and use the GitHub GraphQL API, to create a Pull Request, in Firebase Cloud Functions.

Sep 8, 2020

Firebase Cloud Functions: Verify Users Tokens

Grant access to your Firebase Cloud Functions only for authenticated users.

Sep 4, 2020

Send Email From Firebase Cloud Functions

How to send email with HTML content from Firebase Cloud functions

Aug 19, 2020

Re-implementing document.execCommand()

The execCommand method has been marked has obsolete, here is how I re-implemented its styling command.

Aug 13, 2020

Ionic: Fullscreen Modal & Menu Popover

How to make Ionic modals become fullscreen and popovers act as menu

Aug 4, 2020

Professional presentation building, tailored to your brand.

Introducing another kind of editor for your company's presentations.

Jul 30, 2020

App Shortcuts And Maskable Icons: Play It Like Twitter

Follow the Twitter example to add App Shortcuts and maskable icons to your Progressive Web Apps.

Jul 16, 2020

Bundle A CSS Library

How to build your own custom CSS library with SASS, postcss and clean-css.

Jul 1, 2020

The State Of Progressive Web Apps Adoption By Developers

Are PWA preached or adopted by developers? Do they use these despite the lack of support on iOS? Here are some hints I gathered with polls the last few days.

Jun 21, 2020

Fullscreen: Practical Tips And Tricks

Toggle the fullscreen mode with any browser, a Sass mixin for polyfill and hide the mouse on inactivity

Jun 10, 2020

Dynamically Import CSS

Lazy load CSS with the help of dynamic import() demonstrated in a Stencil Web Components

Jun 1, 2020

How To Make Your PWA Offline On Demand

Download your Progressive Web Apps content à la Netflix or Spotify

May 21, 2020

Showcase Your PWA In Your Website

Introducing a new Web Component to embed applications in websites with stylish mobile devices iframes

May 8, 2020

Develop A Konami Code For Any Apps With Stencil

How to create a Web Component with Stencil to add a Konami Code feature in any modern web applications

Apr 19, 2020

Currency Picker And Formatter With Ionic React

Build a currency picker and formatter for your application developed with Ionic and React

Apr 18, 2020

An Open Source Medium Like WYSIWYG Editor

Add our WYSIWYG floating or sticky editor to any web applications

Apr 17, 2020

Git Commands I Always Forget

Revert last commit, change last or multiple commit messages or delete tags

Apr 16, 2020

Angular And Web Workers

How to integrate Web Workers to your Angular applications

Apr 15, 2020

Follow-up: Web Push Notifications And PWA In 2020

A follow-up to my one year old tutorial Web Push Notifications In Progressive Web Apps with Ionic And Angular

Apr 14, 2020

Deeplinking in Ionic Apps With Branch.io

How to set up deep links for your Ionic Apps with Branch.io and intercept parameters

Apr 13, 2020

JavaScript Useful Functions

A couple of useful JavaScript functions such as unifying events, debouncing or detecting mobile browsers

Apr 12, 2020

GitHub Actions: Hide And Set Angular Environment Variables

How to hide Angular environments variables from your repo and set these at build time while using GitHub Actions

Apr 11, 2020

React, Web Workers, IndexedDB and ExcelJS

How to generate an Excel spreadsheet with IndexedDB data and a Web Worker within a React application

Apr 10, 2020

React, Web Workers and IndexedDB

How to use IndexedDB in React applications with Web Workers

Apr 9, 2020

Angular Testing: Mock Private Functions

How to mock a private function in your automated Angular tests with Jasmine or Jest

Apr 8, 2020

React And Web Workers

How to interact with Web Workers in React applications

Apr 7, 2020

Third Party Service Providers. Be transparent to each other!

Call to display your third party providers.

Apr 6, 2020

Create Your Own NPM Cli

How to create your own npm init command for your project

Apr 5, 2020

More JSX For Angular Developers

A follow up introduction to JSX in Stencil or React for Angular developers

Apr 4, 2020

JSX For Angular Developers

A brief introduction to JSX in Stencil or React for Angular developers

Apr 3, 2020

Merge Two Objects And Array To Object In JavaScript

How two merge two objects or transform an array into an object in JavaScript

Apr 2, 2020

Test Angular Components and Services With HTTP Mocks

How to test Angular Components and Services with the help of mocked HTTP requests

Apr 1, 2020

Add A Slider To You Angular App

Use our core Web Component to add a slider to your application developed with Angular

Mar 31, 2020

Create A Modal For Your Angular App Without Libs

How to create a modal for your application developed with Angular without the use of any libraries or dependencies

Mar 30, 2020

Create A Menu For Your Gatsby Website Without Libs

How to create a menu for your Gatsby website without the use of any libraries or dependencies

Mar 29, 2020

Protect Your HTTP Firebase Cloud Functions

How to protect your HTTP Firebase Cloud Functions with an authorization bearer

Mar 28, 2020

Takeover The Cordova Facebook Plugin Maintenance

I am giving up being the active maintainer of the Cordova Facebook Plugin. Anyone willing to replace me?

Mar 27, 2020

Gatsby Tricks: Viewport, CSS Modules Transition And i18n Tricks

Overriding Viewport settings, CSS modules transition and an i18n formatting tricks with Gatsby

Mar 26, 2020

Test Angular Pipes With Services

How to test an Angular pipe which uses injected services

Mar 25, 2020

Starting In A New Company? Think Npmrc And Git Name

How to configure your company's npm Enterprise registry and provide your name for Git interactions

Mar 24, 2020

Deploy Apps And Functions To Firebase From A Mono Repo With GitHub Actions

How to deploy applications and functions from a mono repo with GitHub Actions to Firebase Hosting and Functions

Mar 23, 2020

Get App Name And Version In Angular

How to read or display the name and version of your application in Angular without duplicating these information

Mar 22, 2020

How To Declare And Use Ionic Modals With Stencil

How to declare and use Ionic modals with Stencil incl. passing parameters, close actions and hardware back button support

Mar 21, 2020

Internationalization with Gatsby

How to internationalize your Gatsby website with gatsby-plugin-i18n and react-intl in 2020

Mar 20, 2020

Sometimes You Just Need A Dumb Library

How to create a library with Rollup and Typescript #OneTrickADay-31

Mar 19, 2020

Inject JavaScript Or CSS At Runtime And On Demand

How to load a JavaScript library, component or a style only when you really need it #OneTrickADay-32

Mar 18, 2020

Replace Environment Variables In Your Index.html

How to update environment variables and even add a SHA-256 in your application index.html without any plugins #OneTrickADay-33

Mar 17, 2020

How To Call The Service Worker From The Web App Context

How To Call The Service Worker From The Web App Context #OneTrickADay-34

Mar 16, 2020

Introducing: Tie Tracker. A simple, open source and free time tracking app ⏱️

Mar 11, 2020

Introducing A New Web Component To Drag, Resize And Rotate

Add drag, drop and resize capabilities to any web apps

Mar 3, 2020

Syntax Highlighting Displayed In Ubuntu Terminal Like

Display the code of your apps, websites or blogs with code highlighting in stylish Ubuntu Terminal like

Feb 24, 2020

Reorder With Google Cloud Firestore

How to maintain a list of data dynamically sorted with Cloud Firestore collection

Feb 19, 2020

Create A React Custom Hooks For Your Web Components

How to create a React custom hooks to bind your Web Components events with useEffect

Feb 12, 2020

Firebase Storage Gotchas 😅

Sharing some Google Cloud Storage key points I learned while implementing private assets and reverting two days of work.

Feb 4, 2020

Infinite Scroll with Ionic, Angular and Firestore

How to implement an infinite scroll with Ionic, Angular and Google Cloud Firestore

Jan 27, 2020

DeckDeckGo: Kick-starting 2020 with so much improvements

We are unleashing Google Fonts, private assets, accessibility improvements and many new features in our web open source editor for presentations.

Jan 20, 2020

Lazy Load YouTube Video <iFrame/>

How to lazy load Youtube Video using the Intersection Observer API.

Jan 9, 2020

Dark And Light Mode: OS Color Scheme And Theme Switcher

How to add a dark and light mode theme switcher to your application which inherits the OS color scheme as default state too.

Dec 30, 2019

Generate Contrasting Text For Your Random Background Color

How to generate automatically a contrasting text for your random background color in Javascript.

Dec 23, 2019

Stylish Cards And Syntax Highlighting With Gatsby

How to display the code of your Gatsby website and blog with styled cards and code highlighting with a new plugin

Dec 17, 2019

How to declare and pass parameters to an Ionic + React Modal

Dec 10, 2019

Interact With Your Audience With A Live Poll

We are introducing a new feature to let your interact with your audience without leaving your presentation

Dec 5, 2019

Infinite Scroll with Ionic + React

How to implement an Infinite Scroll with Ionic + React and a filter with Hooks

Dec 2, 2019

How to keep secret your Font Awesome Pro token in public GitHub actions

Configure your GitHub actions to keep secret your Font Awesome Pro token or NPM private tokens

Nov 27, 2019

Introducing the new remote control for your presentations

Introducing the new remote control for your presentations developed with the web open source editor DeckDeckGo

Nov 12, 2019

Trick JavaServer Faces, load your bean data from the client side

How to trick JSF (JavaServer Faces) while loading your bean data from the client side with the help of Primefaces

Nov 4, 2019

Highlight Markdown code with Remarkable and a Web Component

Nov 2, 2019

Create a Primefaces JSF project with Maven and Wildfly

How to create a Primefaces and JSF project with Maven and Wildfly as a local server

Oct 30, 2019

Integrate the same QR code Web Component in React, Angular or Vue

How to integrate the same QR code Web Component developed with StencilJS in React, Angular or Vue

Oct 8, 2019

Introducing DeckDeckGo: the web open source editor for presentations

Sep 24, 2019

Debounce with vanilla JavaScript or RxJS

Sep 18, 2019

We need your help to get started

We need your help for the launch of DeckDeckGo our upcoming web open source editor for presentations

Aug 28, 2019

Map a JSON file to ENUM in Java

Aug 16, 2019

Outcome of our first call for contributors

Aug 1, 2019

Contribute to our open source project

Are you looking to contribute to a new open source project? Or want to get started with technologies like Web Components and StencilJS ? Contribute to our open source project DeckDeckGo

Jul 26, 2019