TECH BOX

Technology developer's blog

#JavaScriptの一覧

GridsomeでWordPressの記事詳細ページに前後の記事リンクを追加する

静的ページだとなかなか前後の記事をつけるのが大変です。GraphQLを使って前後の記事を取得しますが…クエリ一つでというのができないのでクエリとJS側でフィルターする方法

GridsomeでPugを使う

インデントで記述するので構造がわかりやすく、閉じタグを忘れたりする些細なミスも減るメリットの大きいプリプロセッサーであるPugをGridsomeでも利用する方法

GridsomeでStylusとPostCSSを使う

altCSSであるStylusとPostCSSをGridsomeで使う場合の設定は最初から用意されているため比較的簡単に導入ができます

GridsomeでTypeScriptを使う

GridsomeでもTypeScript + リンター環境を構築する方法を紹介

吸着スクロールの実装

ドラムロールをウェブブラウザでも実現したい!そんな時に使える吸着スクロールの実装方法を紹介します。

独自スクロールの実装

いつかどこかで役に立つはず。独自スクロールの作り方も!

ファジィ理論 〜台形型〜

ファジィ理論の3回目。台形型は画像遅延や領域内に入ったかどうかの判定をしたりするのにとても相性が良いです。

ファジィ理論 〜三角形型〜

ファジィ理論の2回目。三角形型をの頂点を使うことで特定の位置に一番近い要素を取得することもできます。サンプルでは集中力をパーセントで表示しています。

ファジィ理論の概要と傾斜型

ゲームAIや洗濯機、冷蔵庫などで使われるファジィ理論。ウェブ制作とは縁がないと思いがちですが、仕様次第では有効に活用することができます

Chrome拡張「Web Maker」を使って気軽に実験する

プライベートでコードをたくさん書いて実験したい…そんなあなたに。

byteをKBやMBなど適切な単位に変換する

地味に忘れがちなbyteからKBなどへの変換方法

今すぐ使えるES6以降での配列やオブジェクトの書き方

今日から仕事で使えるちょっとした小技を紹介します

ページャリストの作り方

カレントページが常に左端の場合と、中央の場合のページャリストの計算方法を紹介

JSONの代わりにYAMLを使う

JSONだと長くなればなるほど可読性が落ちてくるので、YAMLを使ってデータを読みやすくしよう。

配列をn個ずつ抜き出す

配列をn個ずつ抜き出すときにfor文で頑張っていた人はArray.sliceを使うとコードが見やすくなりますよ。さらにクラス化すれば使い回しができます。

よく使っているJavaScriptのロジックを公開

よく使うJavaScriptロジックをGitHubで公開しました

ゼロ埋めライブラリを公開

JavaScriptでゼロ埋めをする関数ライブラリ。数値と総桁数を渡すだけで簡単生成。マイナスにも対応。

WebStorageを操作するライブラリを公開

WebStorage(localStorage / sessionStorage)を簡単に操作するライブラリを公開しました

requestAnimationFrameで任意のミリ秒ごとに処理を可能にするライブラリを作成

FPSと実行したいミリ秒を元に総フレーム数を計算し、フレームをカウントしていくライブラリを作成しました。

アスペクト比計算ツールをリリース

画像サイズから整数比のアスペクト比と最大公約数を計算するツールを公開。利用している技術などもすべて公開

アスペクト比の求め方

画像サイズからアスペクト比を計算する