Saki Imafuku

はじめにTypeScriptでは「データがない」ことを表す型が2種類存在します。違いや使い分けについてまとめたいと思います。 null型, undefined型とはどちらも「データがない」ということを表すプリミティブな型です。const hoge: null = nullconst foo: undefined = undefined 発生タイミングnullは開発者が意図的に指定した場合のみ設定されます。// 開発者が指定するconst hoge = nullundefinedは変数の初期値がない場合や存在しないプロパティにアクセスした場合などに自動で設定さ...

TypeScript nullとundefinedどちらを使う？

はじめにsweeep株式会社エンジニアの今福です。今回は日付に関する記事をまとめます。日付と一言に言っても、タイムゾーンや表示形式が複数あり、各レイヤーで最適なタイムゾーン、表示形式に変換する必要があります。たとえば、UI上はユーザが直感的に理解できる日付の表示を行いつつ、BEではグローバル展開も視野にUTCでデータを保管するケースがあります。UIFEBE / DBタイムゾーンユーザが属するタイムゾーン(JSTなど)-UTC日付形式YYYY年MM月DD日 YYYY-MM-DD　　などDateオブジェクトISO8601形式 タ...

日付変換の基礎知識

はじめにトーストを複数表示するためにシングルトンパターンを利用したので、備忘録としてまとめます。 Vue-Toastificationを使用してトーストを表示する弊社ではトーストの表示にVue-Toastificationというライブラリを使用しています。 Vue-Toastificationとはトーストを簡単に実装できるライブラリです。vueと名前についていますが、Reactでも使用できるようです。https://vue-toastification.maronato.dev/ 特徴TypeScriptをサポートしているトーストの表示や動作を簡単にカスタ...

シングルトンパターンを利用してトーストの複数表示を行う

はじめにvue-good-tableを使用することで、簡単にさくっと高機能なテーブルを作成することができます。この記事ではインストール方法などは割愛します。下記のページを参考にしてみてください！https://xaksis.github.io/vue-good-table/ 基本機能columnsとrowsを指定するだけで、必要最低限のテーブルを作成できます。<template>  <div>    <vue-good-table      :columns="columns"      :rows="rows"/>  &l...

vue-good-tableで簡単にテーブルを作成する

はじめにsweeep株式会社でエンジニアをしている、いまふくです。新サービス「sweeep Box」では、Phosphor Icons からSVGをコピーし、アイコンとして使用しています。SVGタグをそのまま使用すると扱いづらい部分があったため、アイコンのコンポーネント化を行いました。 SVGとはSVG（Scalable Vector Graphics)は画像フォーマットの一種です。html, cssなどと同じく「タグ」で扱うことができます。 メリット拡張性・汎用性が高い後から色・サイズ・文字の変更が簡単アニメーションをつけることも可能拡大縮小による画像の劣...

TypeScript nullとundefinedどちらを使う？

日付変換の基礎知識

シングルトンパターンを利用してトーストの複数表示を行う

vue-good-tableで簡単にテーブルを作成する

SVG形式アイコンをコンポーネント化した