Webのフロントエンドを構成する技術、特にHTMLやCSS、JavaScript、またそれらに関連する話題を扱うBlogです。
ダークモードでブラックサンタクロースを召喚してみた
この記事はミツエーリンクスアドベントカレンダー2019 - Qiitaの11日目の記事です。
突然ですが、皆さんは「ダークモード」を使っていますか？ 筆者はつい最近、スマートフォンをダークモードに切り替え、6年間使い続けていた無地の白背景が黒になりました。 このダークモードが世のユーザーに広く使われ始めたのは、今年の9月に公開されたiOS13の話題性からだと考えられます。
おそらく、
- 暗い場所で使用する際に明るい画面と暗い夜道の明暗差を抑え、目の負担を軽減してくれる
- ディスプレイに有機ELを採用するスマホの普及により、バッテリーの消費を抑えられる
- YouTube、Twitter、Google Mapsなどのサービスがダークモードに対応したこと
- 純粋にかっこいいから
などの理由で使用されている方が多いのではないでしょうか。やはり黒い画面はクールでかっこいいですからね。
「ダークモードでブラックサンタクロースを召喚してみた」の全文を読む
AWSでJAMstackことはじめ（基礎知識編）
この記事はミツエーリンクスアドベントカレンダー2019 - Qiitaの10日目の記事です。
JAMstackとは2016年ごろにNetrifyの創設者Matt Biilmann氏が提唱した新しいフロントエンドスタックです。リクエストを受けてからサーバー上で処理を行いレスポンスを返す従来のWebサイトの配信方法とは異なり、JAMstackでは事前にビルドされたHTMLをCDN上で配信します。
最近、特に注目が集まっているこのJAMstackについて、基礎知識編と構築編の2回に分けてご紹介したいと思います。
「AWSでJAMstackことはじめ（基礎知識編）」の全文を読む
ヒューマンリーダブルなフロントエンド設計
この記事はミツエーリンクスアドベントカレンダー2019の8日目の記事です。
フロントエンド設計において「マシンリーダビリティ（機械可読性）」はSEOやWebアクセシビリティの観点からその重要性が度々話題に上ります。Webサイトは特性上、公開して終わりという質のものではなく「素早く」「さまざまな」ユーザーに更新情報を届けることにこそ真価を発揮できるメディアです。マシンリーダブルに設計することはWebサイトの価値を最大限引き出すために必要不可欠な品質指標となります。
しかし、せっかくマシンリーダブルに設計したWebサイトも運用フェーズで品質の維持が難しくなるケースがあります。どんな思想や意図で設計されているのか、コードから読み取ることができない、または読み取りづらく、運用が困難になってしまう場合があるのです。
前述のとおりマシンリーダビリティは言わずもがな昨今のWebサイトの品質指標でありますが、運用フェーズにおいては同じくらい「ヒューマンリーダビリティ」も重要とされるのです。
そこで、新規構築と運用案件の両方の要件を加味し、私が考える「ヒューマンリーダブルな設計」への近道を5点ご紹介します。
inquirer.jsを使用してCLIアプリケーションに対話型インターフェースを導入する
この記事はミツエーリンクス Advent Calendar 2019 - Qiitaの7日目の記事です。
昨今のWebフロントエンド業界では、HTML、CSS、JSの開発を行う際にwebpack、Gulpといった技術の活用や、Vue.js、Reactなどのフレームワークの使用が当たり前となってきています。
それらの開発環境を導入するためには、ターミナルからnpm経由でパッケージをインストールすることになりますが、最近ではターミナルからCLIアプリケーションを操作しながら開発を行う場面も増えてきました。
技術の移り変わりが激しい業界であるゆえにかと思いますが、それはつまり、フロントエンドエンジニアも黒い画面（ターミナル）と向き合い、CLIの操作に慣れておく必要があるということです。
本稿ではNode.jsでCLIアプリケーションを作成する時に役立つnpmパッケージ「inquirer.js」の使い方を紹介しつつ、対話形式の楽しいインターフェースをターミナル上で動作させていきます。
実際にCLIアプリケーションを作成してガッツリとコマンドの設定を書いていくわけではありませんが、CLIを操作したことがない方でも楽しく黒い画面を操作することができる内容となっておりますので、CLIアプリケーションを作ってみたい、黒い画面と仲良くなりたいと思っている方の学習の足がかりになれば幸いです。
「inquirer.jsを使用してCLIアプリケーションに対話型インターフェースを導入する」の全文を読む
セマンティックなマークアップでサンタクロースに手紙を出す
この記事はミツエーリンクスアドベントカレンダー2019の6日目の記事です。
12月に入り、街中はすっかりクリスマスムードですね。
ケーキやプレゼントを心待ちに、クリスマスを楽しんでいた幼少期が思い出されます。
サンタクロースには、サンタクロース中央郵便局を通じて手紙を出せることをご存じでしょうか。
1年に1度のクリスマス。今一度童心に返り、手紙をしたためてみれば、大人になったの私の元にもプレゼントが届くかもしれません。
それでは、早速手紙を書いていきましょう。