スムーススクロールの jQuery プラグインを npm にあげるようにしました

数年前に「ページ内で気持ち良いスムーススクロールをするためのjQueryプラグイン作った。」というい記事を書きまして、これが結構使い勝手が良くて案件でもいつも使っていたのですが、昨今 JS といえば npm で入れるのが当たり前という感じになっておりまして、いろんなライブラリやら jQuery プラグインやらを npm で入れているのにこのスムーススクロールのやつだけは GitHub から手動ダウンロードして設置しなければならないというのがくそめんどくさいなーと常々思っていましたので、いよいよ重い腰を上げて npm にあげるようにしました。

ついでに、メンテナンス性を考慮してコードも ES6 + Rollup + Babel な感じで書き直しました。その都合で GitHub にあるコードはソースファイルのみになりまして、GitHub からダウンロードしてきても一度ビルドしないと多分動きません。RAEDME の手順通り yarn add で入れたり、npm install で入れればビルドされたファイルも入っているのでそのまま使えます。気が向いたら Travis CI とか使って GitHub の Releases からビルド済みの zip をダウンロードできるようにしようかなと考えていますが、今のところ僕は困っていないのでいつになるかはわかりません…。

JS はなるべく ES6で書くようにしているのですが(むしろもう時代は ES7 なんですかね。もう ES7 言うな問題というのもあるそうですが…と思ってぐぐったら ES7 は 2016 なのでもはや ES7 でもちょっと古いのか…?)、JS に精通していないのでいまいちどういう設計で書くのがベターなのかよくわかっていません。個人的には構文が短くなったり class 使えるようになったりして以前より見通しは良くなっていると感じているのでそれほど問題はないのですが、本格的にフロントエンドの仕事をしようと思ったらこんなんじゃだめだよなーと思ったり。じゃあ PHP はちゃんと書けているのかといえばこっちもこっちでよくわかっていないんですけれども。

こういうのってみなさんどうやって学んでいるのですかね。こう書けばこう動く、というのはリファレンスみたりググればすぐわかりますが、ファイルはこういうふうに分割してこういうふうに配置して、メソッドはこういう風に分割するのがベターみたいなのって Tips 的な情報と比べるとあまり多くないしあってもなかなか難しい内容だったりするので、こう初歩からステップアップするのって…まぁとにかくやってみる、しかないのかなぁ、ともやもや。

MW WP Form

MW WP Form はショートコードベースのフォームプラグインです。多くの機能を持っており、例えば、多くのバリデーションルール、問い合わせデータの保存、そしてグラフ機能集計などを使用することができます。

さらに詳しく
Habakiri

Habakiri

Bootstrap ベースのシンプルな WordPress テーマ。レスポンシブ、多くのカスタマイズ機能。圧縮された CSS・JS を使用する高速化対策。Microformats 対応。Sass、クラスベースの functions.php。

さらに詳しく
basis-stylus

Basis

軽量なレスポンシブ Stylus/CSS フレームワーク。Flexbox ベースのグリッドシステム、疎結合なコンポーネント、バーティカルリズム。

さらに詳しく