CMSを理解するのに「Movable Type」をオススメする理由
エンジニアがフロントエンドもバックエンドも一貫して行うようになり、特に今年に入って私はCMS実装をする機会が非常に多くなった。これまではモックの実装までを行ってCMSはバックエンドのエンジニアに引き継いで実装してもらっていたが、今年はほぼすべての案件で一貫して実装を行った。その中で「Movable Type」というCMSを実装す […]
続きを読む →投稿者：酒井琢郎
フォントのチラつき解消法
エンジニアなら、開発中のウェブサイトでロード時にWebフォントが適用されるまでに一瞬タイムラグがあるという現象に遭遇したことは一度くらいあるのではないだろうか。俗に言う「フォントのチラつき」問題だ。NotoSansJPなど重い日本語フォントを指定したときに発生しがちだ。 今回、私が遭遇したのはあるプロジェクトでYaku Han […]
続きを読む →ベイジ流未経験エンジニアの育て方
今年4月に新しいエンジニアの方が入社して約4ヶ月が過ぎた。新人の方は入社当時でHTML・CSS・JSの基礎知識はもっていたものの実務未経験だったので、他のエンジニアとも分担してベイジのコーディングを教えていった。今回はこの4ヶ月の進め方と振り返りをいくつかまとめたので、いまベイジを検討しているエンジニアの方やエンジニアの育て方で […]
続きを読む →フロントエンドエンジニアはWordPressまで実装すべき
私は今年の最初の方の日報で「フロントエンドエンジニアはモックからWordPressまで一貫して実装できた方がよい」と書いた（「エンジニアがモックからWordPress実装まで一貫して行うことの必要性」）。以前まではWordPress（以下、WP）実装の一部しか担当していなかったが、最近のプロジェクトでモック作成からWP実装まで全 […]
続きを読む →コーディングの「汎用性の高さ」は誰のためのものなのか？
他人のコードはあくまで他人のもの 入社時からHTMLとCSSをコーディングする際は「汎用性高く作るべき」と教わり、認識と命名ルールの統一・再利用しやすい構造・細分化など汎用性を意識してコーディングしてきた。こうすることで別のエンジニアが作ったパーツも自分のもののように扱え、コーディングが楽になると考えていた。しかし、意識しようが […]
続きを読む →開発と運用のパフォーマンスを向上させるための「JSは最低限」ルール
私はwebサイトをコーディングする上で「JSは最低限」という自分ルールを作って、守るようにしている。 「JSは最低限」とは？ 例えば、「フェードイン」で要素を表示するとき、実装方法として以下の手段が考えられる。 .visibleというクラスをJSで付与することでopacity: 1に切り替えて表示する。アニメーションはtrans […]
続きを読む →100ページ規模のサイトの高速化にService Workerは有効か？
私が関わるとあるプロジェクトで、ページの読み込みを高速化させるためService Workerを導入した。Service Workerとは、PWA（Progressive Web Apps）などブラウザで動作するWebアプリで使用される技術だが、今回はこの技術の一部である「オフラインキャッシュ」を使用して高速化を図った。省略して […]
続きを読む →エンジニアがモックからWordPress実装まで一貫して行うことの必要性
あるプロジェクトをモックのコーディングとそれのWordPress化を分担して進めている。その中で一度はWordPress化しているが、デザインなどの修正が入り、モックの方が最新になってしまったページをWordPressに再度反映する作業を一部担当した。 すでにWordPress化されたページの最適化なので特段難しい作業というわけ […]
続きを読む →効率的な品質チェックに欠かせない2つの方針
私はエンジニアだが、業務内容には全般的な品質チェックも含まれる。中でもwebサイトのブラウザチェック（画面表示チェック）や、表記統一のチェックを同僚と一緒に進める際に、効率の良い分担の仕方を意識するようになった。 スピーディーに効率良く作業を進めるためには以下の2つの方針を実践する必要がある。 タスクを性質で分解して整理する 作 […]
続きを読む →効率良いフロントエンド実装をするために新卒の私が気を付けていること
どの案件でも共通するが、どういう順番でコーディングを進めていくかは、スピードに大きく影響する重要なことだと思う。 フロントエンドが行うコーディングでいえば HTMLを組む PC版のCSSを書く SP版のCSSを書く PSDから画像を書き出す JavaScriptを実装する これらが主な作業だ。この順番を案件ごとに変え、どの流れが […]
続きを読む →