Tutorials and notes on web development, tooling, and the things I break along the way.https://risanb.com/enhttps://risanb.com/posts/loading-a-cloudflare-access-app-in-an-iframe/https://risanb.com/posts/loading-a-cloudflare-access-app-in-an-iframe/Cloudflare Access won't show its login page inside an iframe. A tiny Worker moves the login into a popup, so the iframe works anyway.Mon, 05 Oct 2026 15:00:00 GMTlogcloudflarejavascriptdevopshttps://risanb.com/posts/making-the-github-heatmap-sing/https://risanb.com/posts/making-the-github-heatmap-sing/Turning hover states on the GitHub heatmap into oscillators, envelopes, reverb, and a tiny sequencer that plays your year — with Web Audio, no library.Fri, 02 Oct 2026 00:00:00 GMTtutorialjavascriptweb-audiohttps://risanb.com/posts/fixing-blurry-image-scaling-on-css-hover-zoom/https://risanb.com/posts/fixing-blurry-image-scaling-on-css-hover-zoom/What to check when an image looks blurry during a CSS hover zoom.Tue, 29 Sep 2026 03:00:00 GMTsnippetcsshttps://risanb.com/posts/building-a-github-activity-heatmap/https://risanb.com/posts/building-a-github-activity-heatmap/A tour of the GraphQL fetch, daily JSON snapshot, and Astro SVG behind the little grid on my homepage.Tue, 22 Sep 2026 00:00:00 GMTtutorialjavascriptgraphqlsvghttps://risanb.com/posts/datatables-sorting-custom-rendered-column/https://risanb.com/posts/datatables-sorting-custom-rendered-column/Sun, 21 Mar 2021 10:20:06 GMTsnippetjavascripthttps://risanb.com/posts/datatables-dynamic-ajax-parameter/https://risanb.com/posts/datatables-dynamic-ajax-parameter/Sun, 21 Mar 2021 10:19:56 GMTsnippetjavascripthttps://risanb.com/posts/windows-php8-laravel-subdomain-routing/https://risanb.com/posts/windows-php8-laravel-subdomain-routing/Wed, 24 Feb 2021 14:54:00 GMTlogwindowsphphttps://risanb.com/posts/list-pages-with-tag-on-hugo/https://risanb.com/posts/list-pages-with-tag-on-hugo/Thu, 18 Feb 2021 14:14:00 GMTsnippethugohttps://risanb.com/posts/postmark-custom-metadata-in-laravel/https://risanb.com/posts/postmark-custom-metadata-in-laravel/Thu, 18 Feb 2021 14:04:00 GMTsnippetlaravelphphttps://risanb.com/posts/resize-images-with-hugo/https://risanb.com/posts/resize-images-with-hugo/Wed, 17 Feb 2021 14:19:20 GMTsnippethugohttps://risanb.com/posts/web-app-to-track-expense-on-google-sheets/https://risanb.com/posts/web-app-to-track-expense-on-google-sheets/Sun, 27 Dec 2020 14:41:00 GMTlogjavascriptvuehttps://risanb.com/posts/lets-build-stuff-again/https://risanb.com/posts/lets-build-stuff-again/Mon, 21 Dec 2020 13:21:00 GMTloghttps://risanb.com/posts/vue-google-login/https://risanb.com/posts/vue-google-login/Sun, 08 Nov 2020 13:28:00 GMTsnippetjavascriptvuehttps://risanb.com/posts/integrating-raygun-with-laravel/https://risanb.com/posts/integrating-raygun-with-laravel/Sun, 07 Jun 2020 15:15:00 GMTsnippetlaravelphphttps://risanb.com/posts/switching-to-hugo/https://risanb.com/posts/switching-to-hugo/Sun, 10 May 2020 14:27:00 GMTloghugohttps://risanb.com/posts/incorporating-vue-ui-with-a-traditional-laravel-login-flow/https://risanb.com/posts/incorporating-vue-ui-with-a-traditional-laravel-login-flow/Sun, 22 Mar 2020 14:21:00 GMTsnippetjavascriptlaravelvuehttps://risanb.com/posts/setting-up-tailwind-with-vue-cli/https://risanb.com/posts/setting-up-tailwind-with-vue-cli/Sat, 07 Mar 2020 15:16:00 GMTsnippetvuecsshttps://risanb.com/posts/axios-handle-error-response-with-200-status-code/https://risanb.com/posts/axios-handle-error-response-with-200-status-code/Sun, 23 Feb 2020 13:19:00 GMTsnippetjavascripthttps://risanb.com/posts/postmark-tag-in-laravel/https://risanb.com/posts/postmark-tag-in-laravel/An easy way to add a Postmark's tag in LaravelSun, 09 Feb 2020 13:45:00 GMTsnippetlaravelphphttps://risanb.com/posts/switching-to-circle-ci/https://risanb.com/posts/switching-to-circle-ci/Sun, 26 Jan 2020 15:15:00 GMTlogdevopshttps://risanb.com/posts/backup-restore-gpg-key/https://risanb.com/posts/backup-restore-gpg-key/Sat, 11 Jan 2020 16:13:00 GMTtutorialmacoshttps://risanb.com/posts/setup-macos-for-web-development/https://risanb.com/posts/setup-macos-for-web-development/How I set up a fresh macOS for web development, from Homebrew and ZSH to PHP, Nginx, NVM, rbenv, pyenv and PostgreSQL.Tue, 29 Oct 2019 08:00:00 GMTsnippetmacoshomebrewzshnginxphpnodejsrubypythonpostgresqlhttps://risanb.com/posts/bash-script-for-switching-between-php-versions/https://risanb.com/posts/bash-script-for-switching-between-php-versions/Sat, 18 May 2019 17:18:00 GMTsnippetmacosphphttps://risanb.com/posts/colorful-google-maps-marker/https://risanb.com/posts/colorful-google-maps-marker/How to use SVG path notation to replace the default Google Maps marker icon. Make the marker's color easily configurable.Sun, 12 May 2019 12:32:00 GMTsnippetjavascriptmapshttps://risanb.com/posts/lazy-load-google-maps-api/https://risanb.com/posts/lazy-load-google-maps-api/Fri, 26 Apr 2019 17:31:00 GMTtutorialjavascriptmapshttps://risanb.com/posts/machine-learning-notes/https://risanb.com/posts/machine-learning-notes/The basics of machine learning. Supervised vs unsupervised learning, regression, classification, clustering, and a worked example of Bayes' rule. Sat, 26 Jan 2019 08:00:00 GMTlogmachine-learninghttps://risanb.com/posts/how-to-clear-nunjucks-cache/https://risanb.com/posts/how-to-clear-nunjucks-cache/Mon, 14 Jan 2019 19:01:00 GMTsnippetjavascriptnodehttps://risanb.com/posts/express-responds-with-base64-image/https://risanb.com/posts/express-responds-with-base64-image/Tue, 04 Dec 2018 08:16:00 GMTsnippetjavascriptnodehttps://risanb.com/posts/regenerator-runtime-is-not-defined/https://risanb.com/posts/regenerator-runtime-is-not-defined/Sun, 11 Nov 2018 09:05:00 GMTlogjavascripthttps://risanb.com/posts/bundling-your-javascript-library-with-rollup/https://risanb.com/posts/bundling-your-javascript-library-with-rollup/Sun, 04 Nov 2018 00:51:00 GMTtutorialjavascripthttps://risanb.com/posts/vue-chart-component-with-chartjs/https://risanb.com/posts/vue-chart-component-with-chartjs/Let's build a reusable and beautiful chart component for Vue.js using the Chart.js library.Sun, 14 Oct 2018 16:38:00 GMTtutorialjavascriptvuehttps://risanb.com/posts/building-my-first-ios-game/https://risanb.com/posts/building-my-first-ios-game/Tue, 09 Oct 2018 22:10:00 GMTlogswifthttps://risanb.com/posts/basic-git-commands/https://risanb.com/posts/basic-git-commands/A cheatsheet of the Git commands I use day to day, from SSH key setup and branching to tagging, reverting and cherry-picking.Sun, 26 Aug 2018 08:00:00 GMTsnippetgithttps://risanb.com/posts/vim-key-bindings-cheatsheet/https://risanb.com/posts/vim-key-bindings-cheatsheet/My personal cheatsheet of Vim key bindings and commands, plus a few plugins and tmux commands I use along with it.Mon, 14 May 2018 08:00:00 GMTsnippetvimhttps://risanb.com/posts/tutorial-php-untuk-pemula/https://risanb.com/posts/tutorial-php-untuk-pemula/Tutorial dasar PHP untuk pemula. Pelajari dasar-dasar pemrograman PHP mulai dari variable, tipe data, operator, percabangan, perulangan, fungsi, hingga Closure.Fri, 27 Apr 2018 08:00:00 GMTtutorialphphttps://risanb.com/posts/set-authorization-header-with-apollo-client/https://risanb.com/posts/set-authorization-header-with-apollo-client/Sat, 14 Apr 2018 11:00:00 GMTsnippetjavascriptgraphqlhttps://risanb.com/posts/python-notes-from-intro-to-machine-learning/https://risanb.com/posts/python-notes-from-intro-to-machine-learning/Sat, 14 Apr 2018 08:00:00 GMTlogpythonmachine-learninghttps://risanb.com/posts/react-component-with-dot-notation/https://risanb.com/posts/react-component-with-dot-notation/Sat, 07 Apr 2018 21:04:00 GMTsnippetjavascriptreacthttps://risanb.com/posts/seeding-table-with-relationships-in-laravel/https://risanb.com/posts/seeding-table-with-relationships-in-laravel/Learn how to define relationships on Eloquent model and use Laravel's model factory to seed the database.Sun, 18 Mar 2018 15:01:00 GMTtutorialphplaravelhttps://risanb.com/posts/track-user-location-google-maps/https://risanb.com/posts/track-user-location-google-maps/We'll learn on how to track user's location using the Geolocation API and display it on Google Maps.Fri, 16 Mar 2018 15:57:00 GMTtutorialjavascriptmapshttps://risanb.com/posts/install-and-switch-php-versions-with-homebrew-php/https://risanb.com/posts/install-and-switch-php-versions-with-homebrew-php/How I installed multiple PHP versions on macOS with the homebrew-php tap and switched between them, before PHP landed in the Homebrew core.Sun, 04 Mar 2018 08:00:00 GMTsnippetmacosphphomebrewhttps://risanb.com/posts/installing-sql-server-on-macos/https://risanb.com/posts/installing-sql-server-on-macos/Tue, 13 Feb 2018 13:18:00 GMTtutorialdevopsdockermacoshttps://risanb.com/posts/i-create-my-own-static-site-generator/https://risanb.com/posts/i-create-my-own-static-site-generator/Sun, 11 Feb 2018 15:06:00 GMTlogjavascriptnodehttps://risanb.com/posts/publishing-npm-package/https://risanb.com/posts/publishing-npm-package/The steps I follow to create a JavaScript package, from git init and package.json to npm link and npm publish.Fri, 15 Dec 2017 08:00:00 GMTsnippetnpmjavascriptgithttps://risanb.com/posts/python-3-basics/https://risanb.com/posts/python-3-basics/Learn Python 3 from scratch. Strings, flow control, lists, dictionaries, functions, modules, files, exceptions, classes, and pip. Sun, 10 Dec 2017 08:00:00 GMTtutorialpythonhttps://risanb.com/posts/react-tutorial-from-scratch/https://risanb.com/posts/react-tutorial-from-scratch/Learn React step by step, from the raw React API and JSX, custom components, props validation, state, event handlers and refs, to forms, lists and HTTP requests. Wed, 06 Dec 2017 08:00:00 GMTtutorialjavascriptreacthttps://risanb.com/posts/upgrade-ssh-key-to-ed25519/https://risanb.com/posts/upgrade-ssh-key-to-ed25519/When is the last time you created your SSH key? If you're still using RSA with key-size less than 2048 bits long, It's time for an upgrade!Wed, 29 Nov 2017 15:06:00 GMTtutorialdevopsmacoslinuxhttps://risanb.com/posts/new-blog/https://risanb.com/posts/new-blog/Mon, 09 Oct 2017 15:06:00 GMTlogcssnginxjekyllhttps://risanb.com/posts/easy-git-deployment/https://risanb.com/posts/easy-git-deployment/Deploy a site with a plain git push to a bare repository on the server and a post-receive hook.Mon, 09 Oct 2017 08:00:00 GMTsnippetdevopsgitlinuxhttps://risanb.com/posts/iptables-and-fail2ban-on-ubuntu/https://risanb.com/posts/iptables-and-fail2ban-on-ubuntu/How I set up a basic iptables firewall, make the rules persistent, and ban brute-force SSH logins with Fail2Ban.Mon, 09 Oct 2017 08:00:00 GMTsnippetdevopslinuxhttps://risanb.com/posts/lets-encrypt-with-certbot-and-nginx/https://risanb.com/posts/lets-encrypt-with-certbot-and-nginx/Installing Certbot on Ubuntu, generating a certificate with the webroot plugin, and wiring it into an Nginx site.Mon, 09 Oct 2017 08:00:00 GMTsnippetdevopslinuxhttps://risanb.com/posts/setup-new-ubuntu-server/https://risanb.com/posts/setup-new-ubuntu-server/My checklist for a fresh Ubuntu server, from SSH key and non-root user to Nginx, PHP, iptables, and Fail2Ban.Mon, 09 Oct 2017 08:00:00 GMTsnippetdevopslinuxhttps://risanb.com/posts/ubuntu-command-line-cheatsheet/https://risanb.com/posts/ubuntu-command-line-cheatsheet/Everyday Ubuntu server commands for system info, packages, disk space, old kernels, and a few curl one-liners.Sat, 23 Sep 2017 08:00:00 GMTsnippetdevopslinuxhttps://risanb.com/posts/ubuntu-users-groups-and-sudo/https://risanb.com/posts/ubuntu-users-groups-and-sudo/How to manage users and groups on Ubuntu, and how to configure sudo through the sudoers files.Mon, 18 Sep 2017 08:00:00 GMTsnippetdevopslinuxhttps://risanb.com/posts/unix-file-permission/https://risanb.com/posts/unix-file-permission/Sat, 16 Sep 2017 12:44:00 GMTsnippetdevopslinuxhttps://risanb.com/posts/hello-ansible/https://risanb.com/posts/hello-ansible/Sat, 16 Sep 2017 11:57:00 GMTtutorialdevopsmacoshttps://risanb.com/posts/install-redis-on-ubuntu/https://risanb.com/posts/install-redis-on-ubuntu/Sat, 16 Sep 2017 11:52:00 GMTtutorialdevopslinuxhttps://risanb.com/posts/install-php-fpm-on-ubuntu/https://risanb.com/posts/install-php-fpm-on-ubuntu/Installing PHP 7.1 with FPM on Ubuntu, how its configuration is organized, and how to hook it up to Nginx.Sat, 16 Sep 2017 08:00:00 GMTsnippetdevopslinuxphphttps://risanb.com/posts/webpack-tutorial/https://risanb.com/posts/webpack-tutorial/A hands-on guide to learn Webpack step-by-step. How to use Webpack with Babel, processing CSS and SASS files, optimizing images, strip unused CSS rules, even developing your own Webpack plugin. Sun, 06 Aug 2017 19:00:00 GMTtutorialjavascriptwebpackhttps://risanb.com/posts/mysql-database-character-encoding/https://risanb.com/posts/mysql-database-character-encoding/Sun, 07 May 2017 13:40:00 GMTsnippetdevopshttps://risanb.com/posts/es2015-tutorial/https://risanb.com/posts/es2015-tutorial/Learn various new features of ES2015 standard. From let & const, template string, arrow function, rest parameters, spread syntax, classes, promise, all the way to generator. Fri, 24 Mar 2017 22:10:00 GMTtutorialjavascripthttps://risanb.com/posts/setup-openpgp-on-macos/https://risanb.com/posts/setup-openpgp-on-macos/Thu, 23 Mar 2017 13:33:00 GMTtutorialmacoshttps://risanb.com/posts/vue-tutorial-building-real-apps/https://risanb.com/posts/vue-tutorial-building-real-apps/Go beyond the basics of Vue.js. Make Ajax requests with axios, set up a project with Webpack and vue-cli, build an object oriented form, share state, create a custom input, use vue-loader and set up Vue Router. Sun, 19 Mar 2017 08:00:00 GMTtutorialjavascriptvuewebpackhttps://risanb.com/posts/vue-tutorial-the-basics/https://risanb.com/posts/vue-tutorial-the-basics/Learn the basics of Vue.js. From data binding, conditionals, lists and event listeners, to computed properties, components, slots and component communication. Sun, 19 Mar 2017 08:00:00 GMTtutorialjavascriptvuehttps://risanb.com/posts/setup-dnsmasq-on-macos/https://risanb.com/posts/setup-dnsmasq-on-macos/Fri, 17 Mar 2017 20:01:00 GMTtutorialmacoshttps://risanb.com/posts/working-with-es2015-modules/https://risanb.com/posts/working-with-es2015-modules/Practical guide to work with ES2015 modules system. Learn how to export and import modules with ES2015 standard. How to bundle-up and transpile your ES2015 modules with Rollup and Webpack. Sun, 26 Feb 2017 07:13:00 GMTtutorialjavascripthttps://risanb.com/posts/generating-ssl-certificate-on-macos/https://risanb.com/posts/generating-ssl-certificate-on-macos/Fri, 03 Feb 2017 19:38:00 GMTtutorialmacoshttps://risanb.com/posts/tutorial-dasar-facebook-php-sdk/https://risanb.com/posts/tutorial-dasar-facebook-php-sdk/Wed, 29 Jan 2014 13:00:00 GMTtutorialphphttps://risanb.com/posts/laravel-ajax-request-dengan-csrf-token/https://risanb.com/posts/laravel-ajax-request-dengan-csrf-token/Mon, 27 Jan 2014 13:00:00 GMTsnippetphplaravelhttps://risanb.com/posts/realtime-notification-php-pusher/https://risanb.com/posts/realtime-notification-php-pusher/Mon, 27 Jan 2014 12:00:00 GMTtutorialphp