スムーススクロールの 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 的な情報と比べるとあまり多くないしあってもなかなか難しい内容だったりするので、こう初歩からステップアップするのって…まぁとにかくやってみる、しかないのかなぁ、ともやもや。

  • ブックマーク
  • Feedly

この記事を書いた人

キタジマタカシ

長崎在住、フリーランスのWordPress テーマ / プラグインデベロッパー。 多数のプロダクトをオープンソースで開発・公開しています。現在は WordPress 有料テーマ Snow Monkey を開発・販売しています。