PHP Archive

[JS]アニメーション付きで要素の上下を入れ替える

Posted on 2018/11/24, Updated on 2026/11/06 by PHP-Archive in JavaScript

JavaScript で要素の上下を入れ替えるには、before() や after() で DOM 上の順番を変えます。
ただしこれだけでは一瞬で入れ替わってしまうため、アニメーションを付けたい場合は「FLIP」と呼ばれる手法を使い、入れ替えた後の要素を元の位置から滑らかに移動させます。

[PHP]CakePHP 3のインストールと初期設定

Posted on 2018/06/22 by PHP-Archive in PHP

CakePHP は Ruby on Rails に影響を受けた PHP 製のフレームワークの一種で、「設定より規約」を原則としており、ファイル名やクラス名は基本的にルールに従って自動決定されるのが特徴です。

インストールは Composer を使って行います。インストールしていない場合は先に公式サイトの手順に従ってインストールしておいて下さい。

[JS]Babelとwebpackを使いES6用のスクリプトを古いブラウザに対応させる

Posted on 2018/05/31, Updated on 2018/06/05 by PHP-Archive in JavaScript

JavaScript(ECMAScript) にはバージョンによって大きく機能に差があり、最新の書き方をすると古いブラウザでは動作しない場合があります。例えば ES6(ECMAScript Edition 6) ではクラスやモジュールの読み込みなど多くの機能が追加されましたが、それらは ES5 以前では備わっていないため、Internet Explorer などのレガシーブラウザでは機能しません。

そういった問題を解決するためには、TypeScript などの Javascript ではない言語(AltJS)で書いたものを ES5 対応のスクリプトにトランスパイルしたり、ES6 の書き方で書いたスクリプトを Babel で ES5 以前の書き方に変換するのが一般的です。

今回は Babel と webpack を組み合わせて、スクリプトの保存時に自動的に ES5 対応スクリプトに変換される環境を作ってみます。