The Front End Developer/Engineer Handbook 2024
This guide is open source, please go ⭐️ it on GitHub and make suggestions/edits there! https://github.com/FrontendMasters/front-end-handbook-2024 1. Overview of Field of Work This section provides an overview of the field of front-end development/engineering. 1.1 — What is a (Frontend||UI||UX) Developer/Engineer? A front-end developer/engineer uses Web Platform Technologies —namely HTML, CSS, and
Fluor.js
on("click", "button", addClass("wobble", "h1")) on("animationend", "h1", removeClass("wobble")) What is it?Fluor.js is a tiny JavaScript library that provides you with a high-level language to easily add interactions and effects to your websites. It is great for prototypes, UI and UX research and for all websites that do not require the cumbersome machinery of a full-fledged framework. It is inspi
真のコンポーネント粒度を求めて - builderscon tokyo 2017
Abstract HTML／CSS／JavaScriptを組み合わせてモノを作るフロントエンドの開発において、運用の効率アップとコードの破綻を回避するため、画面を構成するUIを、それなりの大きさの塊の集合として考えてコードを構成するのが一般的です。 このUIの塊のことは、「モジュール」「コンポーネント」「ブロック」「エレメント」など、様々な呼ばれ方をします。 HTMLとCSSを書く際、このコンポーネント（と呼ぶことにします）をどのくらいの大きさのものとして扱うかは、なかなか難しい問題です。私を含め、フロントエンドに従事する者の多くがこの不確定なコンポーネントの粒度（大きさ）に頭を悩ませていることでしょう。 HTMLとCSS的にコンポーネントをどう考えるかは、CSS設計方法論（CSS methodology）としてまとめられたものがいくつもあります。しかしその多くは、コンポーネントの粒度につ
Frontend Weekly Tokyo
Latest postsVol.500Vol.500Kota Furusawa 16th July 2025 「何に対して優先するか？」を明確にせよ、ソフトウェアエンジニアの「自我の危機」、デザインは戦略的リーダーシップの技術、ほか計10リンク Vol.499Vol.499Kota Furusawa 8th July 2025 普通の人のためのパスキー入門、優れたインターフェースデザイナーの要素、必要なのは視点、ほか計10リンク Vol.498Vol.498Kota Furusawa 2nd July 2025 なぜデザインは失敗するのか、そしてどう正すか、Rolldown の仕組み、チャット後のUIへ — LLMが従来のアプリをどう壊し、どう再構築するか、ほか計10リンク Vol.497Vol.497Kota Furusawa 25th June 2025 UXデザインの本質、サーバーと
A Baseline for Front-End [JS] Developers, 2015
23 Mar 2015 edit It's been almost three years since I wrote A Baseline for Front-End Developers, probably my most popular post ever. Three years later, I still get Twitter mentions from people who are discovering it for the first time. In some ways, my words have aged well: there is, shockingly, nothing from that 2012 post that has me hanging my head in shame. Still, though: three years is a long
今フロントエンドで何が起こっているのか - YAPC::Asia Tokyo 2015
ここ最近のフロントエンドに対しては、 流れが速すぎてついていけない あるライブラリを使おうと思ったら今はみんな別のライブラリを使ってると言われてもう何を使えばいいかわからない ビルドするのが当たり前になっていて、HTML/CSS/JavaScriptを少し修正したいだけなのにどうすればいいのかわからない importやclassなど自分の知っているJavaScriptでない せっかく覚えても半年後には使えない知識になっている という意見を聞きます。果たしてそうでしょうか？ そこで本トークでは、サーバーサイドをメインで書いている人に向けてフロントエンドの今をいくつかのトピックに分けて解説します。 例外もありますが、新しいライブラリは突然何の脈絡もなく登場したわけではなくそれまでの流れを踏まえて登場しています。 本トークでは、個々のライブラリの使い方紹介ではなく、その背景や目的などに注目するこ
最近あまり使ってない、流行っていた時期もあるフロントエンドもの
最近あまり使ってない、ちょっと前の流行りもの なんとなく書いてみます。Web アプリケーション開発屋さんなので、Web サイト制作屋さんとはかなり文脈ズレると思います。 jQuery ファミリー 個人的には jQuery って、協業用のツールという位置づけでした。jQuery でさえ書かれていれば、jQuery 書ける人材のほうが外からも調達しやすいため、人員の流動にも有効と考えられる頃が確かにありました。 DOM に触れてくれるな勢の台頭 ところが昨今では AngularJS や React、その他ライブラリでも DOM 操作が大いに抽象化されていることが多く、jQuery で直接 DOM を操作すること自体が相性良くないケースが散見されます。今思えば Backbone.js くらいのころが jQuery 需要の最終ピークだったように思います。 jQuery プラグイン の需要減 jQu
ScaleOut | Supership
日々の出来事、メンバーの働く様子や声、未来への想いなど、Supershipの“BE SUPER”なストーリーをシェアしています。
Allan Jardine | Reflections | Visual Event 2
Events in Javascript are often seen as a bit of an enigma. This is odd given that Javascript is very much an event driven language, but it is typically down to their complex nature and difficulty to debug. To this end I've created Visual Event to help track events which are subscribed to DOM nodes. Introduction Visual Event is an open source Javascript bookmarklet which provides debugging informat
どんなイベントが設定されているか一目で分かる·Visual Event MOONGIFT
Visual Eventはイベントが設定されているDOMをビジュアル化するライブラリです。 最近のWebサイト開発においてJavaScriptを使わないということは殆どなくなりました。jQueryなどを使って様々なイベントを設定しているサイトも多いでしょう。そこで使ってみたいのがVisual Eventです。 実行しました。色がついた部分がイベントを設定しているところです。 フローティングでアクションの内容が分かります。 Yahoo! Japanで実行しました。意外と色々なアクションが設定されています。 表示の切り替え系が多いようです。 Visual Eventを使うとjQueryで設定したり、onClickで指定したりしたアクションが一目で分かるようになります。jQueryで開発中に設定したイベントが正しく実装されているかどうか確認するのにも使えそうです。 Visual EventはJa
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
