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

Photo by Florencia Viadana on Unsplash

I just migrated the documentation of DeckDeckGo to StorybookJS. More than its ability to simplify building and testing, I like to use it for documentation purpose because it allows me to integrate the README.md files that StencilJS generates automatically. Sparring steps between code and documentation is the best don’t you think?

Here are a couple of tips & tricks I reused, or discovered, along the process.

Import Markdown Files Into StorybookJS

One particularly cool feature of StencilJS is that, out of the box, it auto-generates readme.md files in markdown from the code’s comments. Isn’t that neat?

I think it is. Therefore, to even push to…


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

Photo by Uillian Vargas on Unsplash

I recently published a new open source plugin to export Figma frames to DeckDeckGo slides.

As I like to benefit from my experiences to learn and try new concept, instead of using a bundler as described in the Figma documentation, I decided to give a try to esbuild.

The least I can say, I loved it ❤️.

Foreword

Following solution is the one I set up for my plugin. It does work like a charm but, notably because it was the first time I used esbuild, it might need some improvements. …


Export your Figma frames to presentations with DeckDeckGo.

I am thrilled to unveil a new way to turn your Figma designs into animated slide decks thanks to the open source plugin I recently published: Figma to DeckDeckGo 🥳.

But… Why?

You may ask yourself why would you export your content from Figma to DeckDeckGo? After-all it is possible to present a design without a 3rd party platform. I get that but, before making up your mind, let me list some advantages I do see in such a solution.


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

Photo by Lucas George Wendt on Unsplash

I have been using the same strategy to internationalize quickly Stencil components without dependencies in various projects. Among others for the project Owlly or the Bonjour foundation.

As all these projects are open source, I will share with you my recipe 🧑‍🍳.

Goal

I recently internationalized with the help of the community our project DeckDeckGo, but this article has for goal to add translations to a relatively small component or set of components without dependency.

I use this solution when I create components that contain some slot with default values and which have has primary market our lovely “four languages +…


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

Photo by Florian Steciuk on Unsplash

I am developing a new feature of DeckDeckGo for which I have to unzip a data in Firebase Functions.

It took more time than expected to code such a Node.js function, that’s why I am sharing this solution, hoping it might help you some day too 😇.

Unzipper

Node.js provides a compression module Zlib but, it does not support ZIP files. Luckily, we can use the library unzipper to handle these.

npm i unzipper --save

Unzip With Async Await

My new feature reads and writes data uploaded in Firebase Storage through streams. I also develop my code with a promises (async / await) approach. …


Develop a Twitter Bot that runs in GitHub Actions

Photo by Ravi Sharma on Unsplash

I launched recently DiscoverWeekly.dev a website that shares each Wednesday the new music playlists made by the developers.

To spread the information and let people subscribe, in addition to an RSS feed, I opened a Twitter account and developed a Bot that tweets once a week about the news playlists as well.

Here is how you can also create a Twitter Bot that runs periodically in GitHub Actions.

Twitter API

Tweets are posted with the help of the Twitter API. To get access to such a feature, you need to create a developer account and request access. …


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

Like everyone in the current situation, I miss being able to do a lot of different things such as hugging my mum, attending live events or being able to travel.

Recently, I also noticed I began to miss some immaterial things too, notably discovering new music to listen to totally unpredictably and not through an algorithm. Those bands and songs for which I fall in love for no other particular reason than the fact that they remind me a good memory.

The Upsetters? Discovered at the IQ Bar in Zürich, end of Summer when these were still open. We were…


Photo by Savannah Wakefield on Unsplash

Over the weekend I made a dependency update of my time tracking app “Tie Tracker” (PWA / GitHub).

In this particular tool, I defer the heavy work to Web Workers so that the UI does not find itself in a blocking state.

Because the app is meant to work offline and, is available in the App Store and Google Play, I did not import the required workers’ dependencies through a CDN but, locally.

importScripts('./a-third-party-library.min.js');

The app itself is developed with React but, I implemented the workers with vanilla JavaScript and no package manager to handle their dependencies.

Therefore, I had…


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

Photo by Melanie Magdalena on Unsplash

It is possible to populate Gatsby websites using Cloud Firestore with existing plugins and CMS but, you might be looking to implement such solution by yourself, without dependencies, to get the full control on the process.

This was my goal when I recently developed the new website of DeckDeckGo, more precisely when I was looking to present users’ published decks in the dedicated page “Discover”.

In this article I will show you, step by step, how to collect Firestore data to build Gatsby static websites. …


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

Image credit: Author

This last Christmas break, with the exception of visiting my parents for a couple of days (after having forced myself into a sort of autolockdown period first), I didn’t have any big plans. That’s why, I took the opportunity to improve my software development knowledge.

As I better learn concepts by applying them to real applications rather than writing examples, I decided to create a little scanner progressive web app (PWA) entirely made with the web.

I called it Rebel Scan because it’s just a little scanner app, you rebel scum!

A potato demo video of Rebel Scan

Introduction

It’s important…

David Dal Busco

Freelancer by day | Creator of DeckDeckGo by night | Organizer of the Ionic and IndieHackers Zürich Meetup

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store