i-html is a drop in tag that allows for dynamically importing html, inline. It's a bit like an <iframe>, except the html gets adopted into the page. You might have used something similar before, it might seem familiar to other techniques such as hotwired turbo or similar. You might have even used an element very close to this one, for example the popular include-fragment-element by GitHub. This el
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
It's happening! One of the features I am most hyped about has just landed across all modern browsers and is officially a part of Baseline 2024. And this feature is the Popover API. Popover provides so many awesome primitives and developer affordances for building layered interfaces like tooltips, menus, teaching UIs, and more. Some quick highlights of popover capabilities include: Promotion to the
Attributes and properties are fundamentally different things. You can have an attribute and property of the same name set to different values. For example: <div foo="bar">…</div> <script> const div = document.querySelector('div[foo=bar]'); console.log(div.getAttribute('foo')); // 'bar' console.log(div.foo); // undefined div.foo = 'hello world'; console.log(div.getAttribute('foo')); // 'bar' consol
The MDN Curriculum provides a structured guide to the essential skills and practices for being a successful front-end developer, along with recommended learning resources. Last updated: February 2024 Beginner's level Self-paced Free Defines the essential skills and knowledge every front-end developer needs for career success and industry relevance. Created by Mozilla and refined with insights from
=>htmz> a low power tool for html htmz is a minimalist HTML microframework for creating interactive and modular web user interfaces with the familiar simplicity of plain HTML. [GitHub] plain🍦 Use straight up HTML. No supersets. No hz- ng- hx- v- w- x-; no special attributes. No DSLs. No <custom-elements>. Just vanilla HTML. lightweight🪶 166 bytes in total. Zero dependencies. Zero JS bundles to l
The content previously available on this website has been moved to my blog, in the form of books, in PDF or ePub format. This website was basically a "web" version of my books, but I could not maintain the same content in 2 different places, it was unsustainable as a solo project, so I decided to focus on my blog and my books. You can access the books, free of charge, at https://flaviocopes.com/ac
Lightweight Javascript Framework Review (For Django Developers) Introduction Many developers are confused when they try to find a Lightweight Javascript Framework for the Django project because there are so many options. In this post, I will talk and compare lightweight javascript frameworks, and help you decide which one is the best for your Django project. If you want to: Render HTML in Django,
2023/11/18(土)で開催されたフロントエンドカンファレンス沖縄 2023に関する、現時点での公開資料と X アカウントリンクをまとめました。 よろしければご活用ください。 はじめに 登壇者名は敬称略させていただいています。 スライドについては、ご本人がツイートで展開されていたり、スライドサービスにアップロードされているものを記載。 Discord の方だけで公開されている方は、勝手に公開しない方がよいかと思いましたので、記載しておりません。 X アカウントについては、資料に記載されていたり、資料公開のツイートで分かった方のみ記載。 リンクの間違い等ありましたらコメントいただけると助かります🙏 アーカイブ 本イベントは YouTube で配信されていて、アーカイブが残るようです。 タイムテーブル 10:10 [ゲストセッション]Figmaプロトタイプ入門〜インタラクションイメージの
2023年11月24日紙版発売 2023年11月24日電子版発売 株式会社ICS 池田泰延，西原翼，松本ゆき 著 A5判／344ページ 定価2,860円（本体2,600円＋税10%） ISBN 978-4-297-13871-4 Gihyo Direct Amazon 楽天ブックス 丸善ジュンク堂書店 ヨドバシ.com 電子版 Gihyo Digital Publishing Amazon Kindle ブックライブ 楽天kobo honto 本書のサポートページサンプルファイルのダウンロードや正誤表など この本の概要 フロントエンド開発の範囲は広く，習得すべき技術は多種多様です。 HTML・CSS・JavaScriptはフロントエンドエンジニアにとって共通言語ではあるものの，Webサイトを制作するのか，Webアプリケーションを開発するのか，その違いによって採用すべき技術は全く異なります。
JavaScript なしでインタラクションを追加する Invokers Invokers は JavaScript なしでインタラクションを追加するための提案です。`<button>` 要素に `invoketarget` 属性を指定することで、値として指定した id を持つ `<dialog>` などの要素の開閉状態を切り替えることが可能となります。 <button> 要素に invoketarget 属性を指定することにより、JavaScript を削減し、より宣言的な方法で UI にインタラクションを追加できます。下記の例では invoketarget 属性に <dialog> の id を指定することで、<button> 要素をクリックしたときに <dialog> 要素を開くことができます。 <button invoketarget="dialog">Open Dialog</b
JSer.info #662 - Babel v7.23.0リリースされました。 7.23.0 Released: Decorator Metadata and many new import features! · Babel Stage 3のDecorator Metadataのサポート、Stage 3のimport sourceのサポートが追加されています。 Stage 2のimport deferのサポート、Stage 1のOptional Chaining Assignmentのサポート、TypeScript 5.2のサポートされています。 またBabel 8がαリリースされています。 変更点やアップデート方法については、マイグレーションガイドが公開されています。 Upgrade to Babel 8 · Babel ReactやVueなどに対応したNext.jsやNuxtのよう
htmx 1.9.0 Release I’m happy to announce the 1.9.0 release of htmx. New Features Support for view transitions, based on the experimental View Transitions API currently available in Chrome 111+ and coming to other browsers soon. Support for “naked” hx-trigger attributes, where an hx-trigger is present on an element that does not have an hx-get, etc. defined on it. Instead, it will trigger the new h
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Amazon.co.jp: フロントエンドの知識地図—— 一冊でHTML/CSS/JavaScriptの開発技術が学べる本: 池田泰延, 西原翼, 松本ゆき: Digital Ebook Purchas
