Intro こういうタイトルを付けるのはあまり好きではないが、あえてこのようにした。 「ブラウザでキャッシュがヒットしない」 以下は、Web における Caching の FAQ だ。 サーバで Cache-Control を付与したのにキャッシュがヒットしない サーバで ETag を付与したのに If-None-Match が送られない サーバで Last-Modified を付与したのに If-Modified-Since が送られない 先日も、筆者が書いた MDN の Cache セクションで「記述が間違っているのでは?」と同様の質問を受けた。 Issue about the Age response header and the term "Reload" · Issue #29294 · mdn/content https://github.com/mdn/content/iss
Vite（ヴィート＝フランス語で「速い」の意味）は2020年に発表された新しいフロントエンドのビルドツールです。 開発者がVue.jsの作者であるEvan You氏であるため、Vue.jsのツールであると誤解されることもありますが、プレーンなJavaScript（バニラJS）からVue.js・React・Svelteといった流行のフレームワークまで、さまざまな環境で利用できる汎用的なツールです。 位置付けとしてはwebpackのようなバンドラーと呼ばれるものに近い存在ですが、それだけではありません。この記事では、Viteを導入してプレーンなJavaScriptから、TypeScript+Vue.js・Reactといったフレームワークまで、快適な開発環境を手に入れる方法を紹介します。 この記事で紹介すること： Viteの特徴と基本の仕組み 基本の使い方 Vite + SCSS Vite +
初心者向け解説によくある例です。 これが現時点（2019年5月時点）で非推奨な書き方だと、初心者は気付くことができない。つらい。 【JavaScript初心者のつらいところ】 初心者向け解説（チュートリアル）のvarをconstやletに置き換えなきゃいけない 何も知らずvarで写経すると悪癖がつく 他にも「今は覚えなくていい書き方」がどうやらたくさんある 「歴戦のJavaScripterがモダンJavaScipt知識をアップデートするためのまとめ」を読むには、そもそも必要とされる前提知識を持ってない 「何が正解かわからない→ググる」と、正しい情報探しに時間が消える 解説途中でググらなくても良い、チュートリアル的に読み通せるサイトってどこ！？！？ そんな私のニーズを満たせそうなサイトにたどり着いたので、記事にしてみます。 【js-primer】 js-primer これからJavaScri
Web標準に新たなステータス「Baseline」が登場。変化し続けるWeb標準のうちWeb開発者が安心して使える機能群を示す。MDNドキュメントなどで表示開始 Web開発者の開発体験を改善することなどを目的としたW3CのWebDX Community Groupは、つねに新たな機能などが登場し変化し続けるWeb標準のうち、Web開発者が安心して使える機能群を示す新たなステータス「Baseline」を発表しました（Googleによる発表、MDNによる発表）。 現在、Web標準はリビングスタンダードとしてつねにアップデートが行われており、ChromeやFirefox、Safariなどの主要なWebブラウザは、Web標準で新たに策定される機能をそれぞれ実装し、最新版に反映させています。 そのため、それぞれのWebブラウザがWeb標準のどの機能をいつ頃実装し、最新版に反映させるのかは時期が異なりま
オープンソースやテクノロジーを中心としたコミュニティの維持や発展を支援する組織「Open Collective」は、Web技術のドキュメント化を長期的に支援する取り組みとして「Open Web Docs」を発表しました。 Open Web Docsはおもに既存のコミュニティによるドキュメント、特にMozillaのMDNをまずは優先的に支援するとしています。 We’re happy and proud to announce Open Web Docs, to support a community of technical writers around creation and long-term maintenance of web platform technology documentation that is open and inclusive for all.https://t
2025/1/18 北陸三県.rb Lightning Talks in Kanazawa
はじめに 明けましておめでとうございます。 (一週間遅れ) この記事はJavaScriptの組み込みAPI Intl の紹介と解説です。 Intl とは？ MDN から引用すると Intl オブジェクトは、 ECMAScript の国際化 API の名前空間で、言語に依存した文字列の比較、数値の書式化と、日付の書式化を提供します。 Intl オブジェクトは、いくつかのコンストラクターに加え、国際化コンストラクターや他の言語に関する関数に共通する機能へのアクセスを提供します 用はi18nの書式版です。 例を出すより見たほうが早いので実際に機能解説します。 (先に言っておきますが、実はこれバックエンド無しで自然言語処理が出来る優れものです。) 用語解説 localesって何？そもそもnewって何？って人がいるかもしれないので locales https://developer.mozilla.
ここからできる → https://donate.mozilla.org/ja/ Chromium 系使っててもいいから Mozilla に寄付をするといいと思う。Web Developer なら MDN にもお世話になっているはずで、もちろん Firefox の存在は Web の健全性に多大な寄与をしている。Web 標準とかを追っている人なら分かるはず。 とにかく寄付をしよう。月額 230 円からできる。俺は月 560 円
GoogleやMicrosoftらで構成される大手IT企業連合が2021年1月26日に、Web開発者向のオープンなドキュメンテーションを支援するプロジェクト「Open Web Docs」の設立を発表しました。Mozillaも参加するこのプロジェクトは、Mozillaの不振により下火となっていたMDN Web Docsの空白を埋めるものになると期待されています。 Open Web Docs - Open Collective https://opencollective.com/open-web-docs/updates/introducing-open-web-docs Browser makers launch new project for writing documentation for Web APIs | ZDNet https://www.zdnet.com/article/
Deprecated: This feature is no longer recommended. Though some browsers might still support it, it may have already been removed from the relevant web standards, may be in the process of being dropped, or may only be kept for compatibility purposes. Avoid using it, and update existing code if possible; see the compatibility table at the bottom of this page to guide your decision. Be aware that thi
If you’ve accessed the MDN website today, you probably noticed that it looks quite different. We hope it’s a good different. Let us explain! MDN has undergone many changes in its sixteen-year history from its early beginning as a wiki to the recent migration of a static site backed by GitHub. During that time MDN grew organically, with over 45,000 contributors and numerous developers and designers
Deno embraces modern web APIs. When capabilities are added to the runtime, the preference is in the form of a browser API. This benefits developers because they are already familiar with these APIs, and it benefits Deno because already existing tests can be leveraged. Web APIs have a huge amount of documentation. Searching for “fetch javascript” turns up hundreds of millions of results. The best s
マイクロタスクは、それを作成した関数やプログラムが終了した後、 JavaScript 実行スタックが空の場合にのみ実行され、ユーザーエージェントがスクリプトの実行環境を動かすために使用しているイベントループにコントロールを返す前に実行される短い関数です。 このイベントループは、ブラウザーのメインイベントループか、ウェブワーカーを駆動するイベントループのどちらかです。これにより、他のスクリプトの実行を妨げるリスクなしに与えられた関数を実行することができ、同時に、ユーザーエージェントがマイクロタスクによって行われるアクションに反応する機会を得る前に、マイクロタスクが確実に実行されるようにします。 JavaScript のプロミスと変更監視 API は、どちらもコールバック実行にマイクロタスクキューを使用しますが、他にも、現在のイベントループのパスが終了するまで作業を延期する機能が役に立つ時があ
Last month, Gregor Weber and I added an autocomplete search to MDN Web Docs, that allows you to quickly jump straight to the document you’re looking for by typing parts of the document title. This is the story about how that’s implemented. If you stick around to the end, I’ll share an “easter egg” feature that, once you’ve learned it, will make you look really cool at dinner parties. Or, perhaps y
Null 合体演算子は、論理 OR (||) 演算子の特殊形と見なすことができます。後者は左辺の値が null や undefined だけでなく、何らかの偽値であった場合に右辺値を返すものです。言い換えると、|| を使って別の変数 foo に何らかの既定値を与える場合、一部の偽値（'' や 0 など）を使用可能とみなすと、予想外の動作に遭遇することがあります。詳しい例は以下を参照してください。 Null 合体演算子は演算子の優先順位が下から 5 番目で、 || のすぐ下、条件（三項）演算子のすぐ上とします。 AND (&&) および OR 演算子 (||) のどちらも、直接 ?? と結合することはできません。このような場合、構文エラーが発生します。
After several intense months of work on such a significant change, the day is finally upon us: MDN Web Docs’ new platform (codenamed Yari) is finally launched! Between November 2 and December 14, we ran a beta period in which a number of our fabulous community members tested out the new platform, submitted content changes, allowed us to try out the new contribution workflow, and suggested improvem
MDNの翻訳活動に参加した話 Mozilla コミュニティに参加して 私がつくったもの MDN翻訳ステータス一覧表 MDNミートアップ：自己紹介シート MDN 月例ミートアップ - 翻訳ガイド MDN ドキュメントの日本語翻訳ガイド 翻訳作業によって生成された記事 さいごに MDNの翻訳活動に参加した話 この記事は 2023 年の MDN 翻訳 Advent Calendar 向けに作成したものです。 こんにちは。debiru です。私は MDN が Mozilla Developer Network だった頃からよく MDN の記事を読んだり、内容に誤りがあれば修正したりしていました。ちなみに MDN が MDN Web Docs と呼ばれるようになったのは 2017 年 6 月頃のようです。 当時、私がよく MDN を見ていたのは確か 2012 年頃だったんじゃないかと思います。その頃
公式のキャッチフレーズにあるように、 React はユーザーインターフェイスを構築するためのライブラリーです。 React はフレームワークではなく、ウェブに限定されるものでもありません。他のライブラリーと共に使用して、特定の環境にレンダリングします。たとえば、 React Native はモバイルアプリケーションの構築に使用できます。 ウェブ向けに構築するには、開発者は ReactDOM と連携して React を使用します。React と ReactDOM は、他の本当のウェブ開発フレームワークと同じ土台で頻繫に議論され、同じような問題を解決するために用いられます。React を「フレームワーク」と呼ぶとき、それは口語的な理解として扱います。 React が目指すところは、開発者が UI を構築しているときに発生するバグを最小限に抑えることです。これは、コンポーネント（ユーザーインター
Last week, Mozilla announced some general changes in our investments and we would like to outline how they will impact our MDN platform efforts moving forward. It hurts to make these cuts, and it’s important that we be candid on what’s changing and why. First we want to be clear, MDN is not going away. The core engineering team will continue to run the MDN site and Mozilla will continue to develop
MDN is one of the most trusted resources for information about web standards, code samples, tools, and everything you need as a developer to create websites. In 2015, we explored how we could expand beyond documentation to provide a structured learning experience. Our first foray was the Learning Area, with the goal of providing a useful addition to the regular MDN reference and guide material. In
フレックスボックスの目的。一連のブロック要素やインライン要素を、 1 次元で柔軟にレイアウトすること。 フレックスの用語 — フレックスコンテナー、フレックスアイテム、主軸、交差軸。 既定で display: flex が何をもたらすかを理解すること。 新しい行や列にコンテンツを折り返す方法。 フレックスアイテムを柔軟にサイズ変更したり、並べ替えたりすること。 コンテンツの位置合わせと配置。 CSS フレックスボックスレイアウトでは、以下のことができるようになります。 コンテンツのブロックを、親コンテンツの中で上下中央に配置すること。 利用できる幅や高さに関係なく、コンテナーのすべての子が利用できる幅や高さを等しくすること。 段組みのレイアウトで、コンテンツの量が異なっていても、すべての段の高さが同じになるようにすること。 フレックスボックス機能は、1 次元レイアウトのニーズに最適なソリュ
High-quality documentation for web platform technologies is a critically important component of our shared, open digital infrastructure. Today, we’re excited to publicly introduce Open Web Docs, a collective project designed to support a community of technical writers around strategic creation and long-term maintenance of web platform technology documentation that is open and inclusive for all. Op
//////////// //////////// //////////// //////////// //////////// //////////// //////////// ++++++ ++++++ ++++++ ++++++ ++++++ ++++++ ++++++{{{{ }}}} {{{{ }}}} {{{{ }}}} {{{{ }}}} {{{{ }}}} {{{{ }}}} ../../ ../../ ../../ ../../ ../../ ../../ ../../<></><></><></><></><></><></><></><></><></><></><></><></><></><></><></><></> AI HelpGet real-time assis
HTML DOM APIWindowインスタンスプロパティcachesclosedconsolecookieStore Experimental credentialless Experimental crossOriginIsolatedcryptocustomElementsdevicePixelRatiodocumentdocumentPictureInPicture Experimental event 非推奨; external 非推奨; fence Experimental frameElementframesfullScreen 非標準 historyindexedDBinnerHeightinnerWidthisSecureContextlaunchQueue Experimental lengthlocalStoragelocationlocationbarmenubar
When we launched the MDN Blog in May 2023, we were excited and curious to see what our readers would think and how the blog would look like one year on. We're thrilled to see that there's a wonderful variety of articles from the MDN team, guests, and partners that we think help developers build for the web. We launched the blog with the intention of having a channel that's separate from our usual
MDN Web Docs evolves! Lowdown on the upcoming new platform The time has come for Kuma — the platform that powers MDN Web Docs — to evolve. For quite some time now, the MDN developer team has been planning a radical platform change, and we are ready to start sharing the details of it. The question on your lips might be “What does a Kuma evolve into? A KumaMaMa?” For those of you not so into Pokémon
We’ve made a lot of progress on moving forward with MDN Web Docs in the last couple of months, and we wanted to share where we are headed in the short- to mid-term, starting with our editorial strategy and renewed efforts around community participation. New editorial strategy Our updated editorial strategy has two main parts: the creation of content pillars and an editorial calendar. The MDN write
Note: We updated the Baseline widgets and rolled it out for more pages to align with the refined Baseline definition. The Baseline definition described in this post is outdated. Read more in the Baseline's evolution on MDN post. MDN is committed to providing modern web development documentation to over a million developers daily. Due to the rapidly-evolving nature of the web platform, and the trem
ウェブアニメーション API により、JavaScript でアニメーションを構築したり、再生を制御したりすることができます。この記事では「ふしぎの国のアリス」を利用した楽しいデモとチュートリアルで正しい利用方法を説明します。 ウェブアニメーション API は、ブラウザー内のアニメーションエンジンを開発者に公開し、JavaScript で操作できるようにします。この API は CSS アニメーションと CSS トランジションの両方の実装基盤となるように設計されており、将来のアニメーション効果への扉を開いた状態にしています。これは、ハックや強制、Window.requestAnimationFrame() なしで、ブラウザーに自分自身で内部最適化をさせる、ウェブ上でアニメーションするためのほとんどのパフォーマンスの高い方法の 1 つです。 ウェブアニメーション API を使うと、インタラク
Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation. Portions of this content are ©1998–2025 by individual mozilla.org contributors. Content available under a Creative Commons license.
Thanks! Please check your inbox to confirm your subscription. If you haven’t previously confirmed a subscription to a Mozilla-related newsletter you may have to do so. Please check your inbox or your spam filter for an email from us. Saboya Gustavo Great initiative! Never coded before 2020, and I intend to become a front-end developer since the beginning of this year. Sometimes, my path has slowed
In our previous post — MDN Web Docs evolves! Lowdown on the upcoming new platform — we talked about many aspects of the new MDN Web Docs platform that we’re launching on December 14th. In this post, we’ll look at one aspect in more detail — how we are handling localization going forward. We’ll talk about how our thinking has changed since our previous post, and detail our updated course of action.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
HTTPガイドHTTP の概要典型的な HTTP セッションHTTP メッセージMIME タイプ（IANA メディア種別）HTTP の圧縮HTTP キャッシュHTTP 認証HTTP Cookie の使用HTTP のリダイレクトHTTP 条件付きリクエストHTTP 範囲リクエストコンテンツネゴシエーションHTTP/1.x のコネクション管理HTTP の進化プロトコルのアップグレードの仕組みプロキシサーバーとトンネリングHTTP クライアントヒントHTTP セキュリティサイトの安全化HTTP ObservatoryPermissions Policy Experimental コンテンツセキュリティポリシー (CSP)オリジン間リソース共有 (CORS)Cross-Origin Resource Policy (CORP)ヘッダーリファレンスHTTP ヘッダーAcceptAccept-CHAc
In its lifespan, Mozilla's HTTP Observatory tool has scanned over 6.9 million websites, providing useful, actionable insights into how developers can improve web security and guard their sites against would-be attackers. The HTTP Observatory tests website compliance with security best practices, mainly concerning the correct usage of HTTP headers. When a scan is complete, it provides a report to t
プログレッシブエンハンスメント (Progressive enhancement) とは、可能な限り多くのユーザーに不可欠なコンテンツと機能のベースラインを提供することを中心とした設計哲学であり、必要なすべてのコードを実行できる最新のブラウザーのユーザーに限り、最高の体験を提供します。 プログレッシブエンハンスメントの「プログレッシブ」とは、古いブラウザーや機能の限られた端末のユーザーには、よりシンプルでありながら良い使い勝手を実現し、同時に新しいブラウザーや機能が豊富な端末のユーザーには、より魅力的で充実したものへ使い勝手を進化させる設計であることを意味しているのです。 機能検出は、一般にブラウザーが高水準のコンテンツを処理できるかどうかを判断するために使用されます。 ポリフィル は JavaScript で欠けている機能を構築するためによく使用されます。 アクセシビリティに特別な注意を
Console API（コンソール API）には、開発者がデバッグ作業（メッセージ、コード内の設定点での変数の値、操作の完了にかかった時間などの記録）を実行できるようにする機能が用意されています。 Console API は、一貫性のない方法ではありますが、さまざまなブラウザーで実装されている、大部分が独自の API として始まりました。 Console API 仕様は、一貫した振る舞いを定義するために作成されました。 すべての最新のブラウザーは、最終的にこの振る舞いの実装に落ち着きましたが、一部の実装には独自の機能がまだ追加されています。 これらについては、次をご覧ください。 Google Chrome の開発ツールの実装 Safari の開発ツールの実装 使用方法は非常に簡単です — console オブジェクト — window.console またはワーカーの WorkerGlob
合同会社イージーモードは、同社ECサイト（BASEショップ）で「水習字用紙」の販売を開始した。水だけで書くことができる習字用の紙。一般的な書道とは異なり、墨や墨汁を用いないスタイルで書けるため、手や服や机が汚れる心配がなくて片付けも簡単になる。 合同会社イージーモードは、東京都港区北青山で書道教室「花香墨」（東京都港区北青山）を運営中。今回の「水習字用紙」は、書道教室の先生によって開発された。 「水習字用紙」の大きな特徴は、乾いても書いた文字が消えないこと。水だけで書ける書道用紙はこれまでにも販売されてきたが、これまでの用紙は数分後には乾いて消えてしまうため、作品を残すことができなかった。 新登場の「水習字用紙」は、墨汁を使った場合とは違って筆が固まってしまう心配もなし。乾いて消えるタイプの用紙で練習した後に、作品として残すために本番で「水習字用紙」を使うなどの方法もあり、気軽に書道を楽し
HTTP ガイド リソースと URI ウェブ上のリソースの識別 データ URL MIME タイプ入門 よくある MIME タイプ www 付きと www なしの URL の選択 HTTP ガイド HTTP の基本 HTTP の概要 HTTP の進化 HTTP メッセージ 典型的な HTTP セッション HTTP/1.x のコネクション管理 プロトコルのアップグレードの仕組み HTTP セキュリティ Content Security Policy (CSP) HTTP Strict Transport Security (HSTS) X-Content-Type-Options X-Frame-Options X-XSS-Protection サイトの安全化 HTTP Observatory HTTP アクセス制御 (CORS) HTTP 認証 HTTP キャッシュ HTTP の圧縮 HTT
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
