日付整形、フロントでやるか APIでやるか

どうも、イソップ(@Yuhiisk)です。

サーバーのAPIからデータを取得する時に、データ内に日付がある場合があります。

“`json
{
“id”:8,
“title”:”hoge”,
“created_at”:”2017-09-29T00:32:55.077022Z”,
“updated_at”:”2017-09-29T09:42:44.336096Z”
}
“`

`created_at` (作成日)や `updated_at` (更新日)ですね。

よく悩んでしまいがちなのが、日付の整形処理をフロントかサーバーかどちらで行うかという問題。

Twitterで教えてもらいました。

柔軟性を重視してフロント側で処理しよう

というコメントをいただきました。ありがとうございます!

はい、日付の表示の種類は変わることがあります。
例えば、`2017/9/30` とか `9/30` とか `2017/9/30 5:54` とか。

APIによって、レスポンス値を整形して返すのは条件や処理が増えるので、複雑化するということなんですね。
なのでフロント(JavaScript)で処理しましょうね、というお話でした。

すんごいスッキリ。

日付整形のJSライブラリ

個人的には次のどちらかを使っています。

date-fnsが使いやすいですね。(moment.jsは最近使ってない)
ES6でもimportして使えるので、めちゃくちゃ重宝してます。

“`sh
npm install date-fns –save

#or

yarn add date-fns
“`

“`js
var isToday = require(‘date-fns/is_today’)
isToday(new Date())
//=> true
“`

ドキュメントはこちらからどうぞ。

Getting Started – date-fns

五十川 洋平(Yohei Isokawa)

五十川 洋平(Yohei Isokawa)

フロントエンドエンジニア/面白法人カヤックなどのWeb制作会社に勤務したのち、故郷の新潟に戻り独立。JSフレームワークAngularやFirebase、Google Cloud Platformを使ったWebアプリ開発が得意。 また、Udemyのプログラミング解説の講師、writer.appの自主開発や上越TechMeetupの主催などを行っています。

プロフィール

©Copyright 2022 Yohei Isokawa All Rights Reserved.