すべての記事 8 ページ

2021

フロントエンド

フロントエンド不安症

この記事はあくまで僕自身の観点と考えを述べるものであり、同業者を批判する意図は一切ない。現在のフロントエンド領域（ここではWeb開発を指す）は成熟しつつあり、フロントエンドフレームワークはコンポーネント化という中核思想とリアクティブな仕組みを採用し、独自の構文や開発手法、哲学を組み合わせることで、大半のユースケースに対応できるようになっていると僕は考えている。
開発ノート

メンタルモデルがプログラミング言語の学習に与える影響

メンタルモデルとは、物事がどう進展するか、あるいは物事がどのように機能するかを予測する認知プロセスのことだ。少し学術的に聞こえるかもしれないが、例えば画面上でボタンのUIを見たとき、僕たちはそのUIがクリック可能であり、クリック後には一連のイベントが発生すると予想する。そのため、ユーザーはそのUIが期待通りに動作しないと混乱を覚える。
雑談

日本で長期的に働くことへの懸念

ソフトウェアエンジニアにとって、日本の特殊な文化や環境、給与水準は必ずしも第一希望とは言えず、日本で働くエンジニアの多くは単純に日本が好きだからこそ来日している。そのため、ここでは給与や日系企業の文化については触れず、日本社会の現状にフォーカスして、僕が現在最も懸念している点を挙げていく。
雑談

Tech Leadの心得 1 — 現場を深く知る

実際に手を動かしている現場のメンバーの声に耳を傾けるべきだとよく言われるが、それは開発においても同じだ。しかし、Tech Leadになるにあたっては、コードそのものを理解するだけでなく、プロジェクト全体を網羅的に把握していることがより重要になる。ここでは、僕が重要だと考えるいくつかのポイントを挙げてみる。
開発ノート

会社でサーバーを構築するのは僕が想像していたほど簡単ではなかった

今回のプロジェクト開発において、従来の純粋な静的ランディングページに対して、企画側からAPIを叩いてデータを動的に取得・更新したいという要望が出た。さらにページのインタラクションも増えてきたため、従来のpug+webpack+jQueryによる純粋な静的ページでは対応しきれなくなり、僕たちは新バージョンの開発でnext.jsを導入した。そして、サーバー構築における試行錯誤の旅が始まった。
フロントエンド

HTMLにおけるForm Dataを理解する

フォームはウェブにおいて非常によく使われる機能であり、プレーンテキストの送信だけでなく、ファイルアップロード機能も実現できる。しかし、formの挙動は他のデータ送信方法とやや異なるため、時に疑問や誤解を生むこともある。この記事では、仕様を読み解きながら経緯を整理し、formの背後で実際に行われている処理や、フォームと他の送信方法との違いについて深く理解していく。最後にHTMLのformタグが裏で何を行っているのかについても触れる。
フロントエンド

Svelteを深く理解する（2）— Svelteが生成するコードの分析

Svelteのコアコンセプトからわかるように、Svelteはコンパイルプロセスから必要な情報を可能な限り取得し、ランタイムのオーバーヘッドを削減することを目指している。前回の記事ではSvelteがコンパイルからコード生成までどのように動作するのかを説明したが、今回はSvelteが生成したコードがどのように動作しているのかを観察してみよう。
フロントエンド

Svelte を深く理解する（0）— 抽象構文木とは何か？

この一連の記事では Svelte の原理と実装の探求を中心とし、読者が Svelte のコンパイルメカニズムとコード生成をより深く理解できるようにすることを目指している。Svelte のコンパイルプロセスにはコード解析が含まれるため、この記事ではまず抽象構文木とは何かについて議論し、抽象構文木が果たす役割と重要性を詳しく説明していく。

2020

フロントエンド

HotwireとTurbolinks

TurbolinksはJavaScriptパッケージであり、通常はRuby on Railsと一緒に使われる（単体のライブラリとして使うことも可能だ）。主にHTMLをfetchして直接差し替える手法によって、通常のページ遷移に伴う再リクエストやCSSのコストを回避する。「JavaScriptを使う必要がない」と言うのは厳密には正しくない。JavaScript自体は存在しており、ライブラリ側ですでに処理してくれているため、開発時にJavaScriptを書かなくて済むというだけのことだ。