LodashのTemplateとsortByを使って並び替えと再利用に強いページを作ろう – 大阪のシステム開発・WEBシステム開発会社技術担当スタッフの覚書き、子だぬきの技術習得ノート

フロントエンドの業務でAJAXでバックエンドと接続して内容を取得してデータを表示する、なんていう場面は多々あると思います。 ただ、AJAXで取得したデータを一つ一つ要素を作成して流し込んでいく事が面倒だったり、表示の並びなどはViewだけでちょっと触るだけで変更できればバックエンドの処理が減って良かったりします。 今回は、jQueryとJavaScriptの便利ライブラリ集Lodashのテンプレート機能とソート機能を使ってみたいと思います。 Lodash Lodashドキュメント デモ codepenでデモを作ってみました。 See the Pen lodash Template Test by koka (@kokaben) on CodePen. ミニブログを想定して、画像とタイトル、日付、タグ、内容をオブジェクトにしてそれを配列で持たせています。 HTML側にscriptタグでテンプ