なぜか昔ほしかった、あの「黄色いノート」 子供のころ、なぜか無性に欲しかった“黄色いノート”ってありませんでしたか？（あるかなぁ。。。ないだろ） リングで綴じられていて、表紙はくすんだ黄色。大学ノート…

Webサイトに動きをつけたい。でもJavaScriptを書くのはハードルが高い…そんなときにおすすめなのが AOS.js（Animate On Scroll） です。 この記事では、AOS.jsの基本…

Webサイトにアニメーションを取り入れたいとき、軽量で手軽に導入できるライブラリがあると便利です。この記事では、ScrollReveal.jsの基本的な使い方と、実践的なサンプルとしてデモサイトを紹介…

Electron × SQLiteで最強のクリップボードアプリを実現！ 前回はlocalStorageを使ったシンプルなクリップボード履歴アプリを紹介しましたが、今回はSQLiteを採用したバージョン…

この記事は、Electron と HTML/CSS/JavaScript を使って開発した「クリップボード履歴管理アプリ」の完成までの実装手順を整理した手順ガイドです。 目的 Mac上で実行できる、履…

CrossGlide：上下スクロール中に画像がすり替わるスタイリッシュなアニメーションを実装しよう Webサイトに動きのあるビジュアル要素を取り入れたいとき、スクロールに連動するアニメーションは非常に…

Webページ上で、画像が重力で落下して跳ね返る──そんな動きに魅了された経験はありませんか？この記事では、物理演算ライブラリ「Matter.js」を活用して、ランダムな大きさの円形画像が落下し、1つだ…

1. はじめに：Viteとは？ Vite（ヴィート）は、フロントエンド開発のビルドツールです。Vueの開発者であるEvan You氏が作成し、従来のWebpackよりも高速な開発体験を提供します。 🔍…

「背景にふわっと現れる文字で、上品な雰囲気を演出したい」 そんな時にぴったりのCSSアニメーションが「FadeGlyph（フェードグリフ）」です。 このアニメーションでは、日本語明朝体フォント「Zen…