JavaScriptビルドツールの整理 各ツールの機能と依存関係
フロントエンドのビルドツールが色々ありすぎて、何がどうなっているのかがわかりづらいため、 各ツールができること、特徴 ツール間がどのように依存しあっているか を一気に調べて整理した。(情報は2023/10時点) 概要 ツールの依存関係整理 上層: dev server付きのバンドラ/ビルドツール。アプリ開発者が直接configなどを書いて取り扱うのはここが多いと思われる。(Next.jsに関しては、ビルド機能に着目した場合) 下層: やや基盤的なdev serverなしのツール群。 矢印は、明示的な依存関係を表す。実際には、明示的な依存関係がなくても、下層のツール群は上層のバンドラ(やRollup)に対してプラグインを提供していることが多い。 各ツールのできること整理 ツールごとに、大まかな機能区分で、できることとできないことをまとめた。 各機能区分の定義は次セクションを参照。 ツールごと
フロントエンドのテストのモックには msw を使うのが最近の流行りらしい
皆様フロントエンドのテストを書いていらっしゃいますでしょうか？ フロントエンドのテストを書くときには API コールする処理を全てモックする必要があります。外部の API をコールする処理をテストに含めると API サーバーが落ちているなどの外部の要因によってテストが失敗してしまう可能性がありますし、テストを実行するたびに実際に API をコールしてしまうとサーバーに負荷がかかってしまうなど外部に対しても悪影響を与えてしまいます。 さて、従来のモックする手段としては Jest のモックを利用して axios や fetch などのモジュールをモック化する手法がよく使われていたかと思います。 最近のテスト手法として API コールをモックする際に Jest ではなく Mock Service Worker (以下 msw ）を使用する手法が注目されています。実施にどのように使用されているのか
Image and Video Upload, Storage, Optimization and CDN
Image and Video APIs for Fast, Scalable Media Management Store, transform, optimize, and deliver media with powerful APIs, intuitive widgets, and a user-friendly interface. CLOUDINARY IMAGE → CLOUDINARY VIDEO → AI-Powered Image & Video Transformation at Scale Transform your image and video workflows with Cloudinary’s Generative, LLM, and Content-Aware AI features. LEARN MORE → TRY OUR GENERATIVE A
deck.js » Modern HTML Presentations
<div class="deck-container on-slide-1"> <section class="slide deck-previous"> <h1>My Presentation</h1> </section> <section class="slide deck-current"> <h2>Slide Header</h2> <p>Here is a list of points:</p> <ul> <li>Point 1</li> <li>Point 2</li> <li>Point 3</li> </ul> </section> <section class="slide deck-next"> <h2>Another Slide</h2> <blockquote cite="http://example.com"> <p>Lorem ipsum dolor sit
Bookmarklets | A Bookmarklet Search Engine | Marklets.com
book•mark•let [book-mahrk-let] –noun 1. a bookmarklet is an applet, a small computer application, stored as the URL of a bookmark in a web browser or as a hyperlink on a web page. Whether bookmarklet utilities are stored as bookmarks or hyperlinks, they are designed to add one-click functionality to a browser or web page. 2. a bookmarklet performs some function, one of a wide variety such as a sea
AJAX APIs Playground
Stay organized with collections Save and categorize content based on your preferences. The Google APIs Explorer is a tool available on most REST API reference documentation pages that lets you try Google API methods without writing code. The APIs Explorer acts on real data, so use caution when trying methods that create, modify, or delete data. For more details, read the APIs Explorer documentatio
Microsoft Ajax Minifier
すべての Microsoft 製品 Global Microsoft 365 Teams Copilot Windows Surface Xbox セール 法人向け サポート ソフトウェア Windows アプリ AI OneDrive Outlook Skype OneNote Microsoft Teams PC とデバイス Xbox を購入する アクセサリ VR & 複合現実 エンタメ Xbox Game Pass Ultimate Xbox とゲーム PC ゲーム Windows ゲーム 映画とテレビ番組 法人向け Microsoft Cloud Microsoft Security Azure Dynamics 365 一般法人向け Microsoft 365 Microsoft Industry Microsoft Power Platform Windows 365 開発者
JavaScript開発ツールの本命！ FirebugとAptana（1/3） − ＠IT
JavaScript開発ツールの本命！ FirebugとAptana：どこまでできる？ 無料ツールでWebサイト作成（4）（1/3 ページ） ついに「Aptana STUDIO」がリリース 先日、連載第1回と第2回で紹介したAptanaが、2年にわたる開発期間を経て「Aptana STUDIO 1.0」としてリリースされた。 「Aptana STUDIO 1.0」には、「Community Edition」と呼ばれるフリー版と、「Professional Edition」と呼ばれる製品版が存在し、製品版は1年間の更新と優先的なサポート、最新開発版へのアクセスパスが付いて199ドル（現在はセール中？）で、以降更新のために1年ごとに79ドル、というプランが用意されている。Professional EditionはIE（Internet Explorer）のデバッグサポート、JSONエディタ、S
JavaScript Utility V3 by Patrick J. O'Neil
This site is dedicated to providing a collection of useful tools for those that want to develop JavaScript applications. Currently the following tools are available: A JavaScript Tester is a useful tool for trying out small bits of code. It especially useful in analyzing complex RegExp statements where the results are not always obvious. A JavaScript Validator can help eliminate a number of bugs b
XUL Apps > Tiny Applications > 高橋メソッドなプレゼンツール in XUL リターンズ - outsider reflex
2005.10.5 2005.10.8 2005.10.20 2006.3.1 2006.3.3 2006.3.31 2006.4.14 2006.12.7 2006.12.11 2007.6.6 2007.6.7 2007.8.6 2007.11.26 2009.5.28 2011.10.2 これは何？ 高橋メソッドって何？ もんたメソッドって何？ これを使うと何がうれしい？ どうやって使うの？ インストール・設置 操作方法 構文 起動オプション ライセンス 関連サイト Home Back to XUL Tiny Applicationsｓ これは何？ まあ実際に見てみて下さいな。 高橋メソッド in XULの後継バージョンであるもんたメソッド in XULに手を加えていったらだんだんもんたから離れていってしまったので、敢えて原点に回帰して「高橋メソッドなプレゼンツール in XUL リ
Online JavaScript beautifier
End script and style with newline? Support e4x/jsx syntax Use comma-first list style? Detect packers and obfuscators? (unsafe) Preserve inline braces/code blocks? Keep array indentation? Break lines on chained methods? Space before conditional: "if(x)" / "if (x)" Unescape printable chars encoded as \xNN or \uNNNN? Use JSLint-happy formatting tweaks? Indent <head> and <body> sections? Keep indentat
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - xojs/xo: ❤️ JavaScript/TypeScript linter (ESLint wrapper) with great defaults
Explore DOM Events
GitHub - faisalman/ua-parser-js: "Unmask Your Traffic" - UAParser.js: The Essential Web Development Tool for User-Agent Detection
Online Javascript Editor
作業効率が10倍アップする Chrome Developer Tools の使い方 - はてブロ@ama_ch
JS Bin