複雑なJavaScriptアプリケーションに立ち向かうためのアーキテクチャAWS Summit Hong Kong 2025: Reinventing Programming - How AI Transforms Our Enterprise Coding Approach
JetBrainsのWeb UIコンポーネントをオープンソース化 | Post Blog
Ring UIを発表します。Ring UIはオープンソースのWeb UIコンポーネントです！ JetBrainsは何年にも渡ってRing UI ライブラリを開発してきており、複雑なUIコントロールを提供します。Ring UIは50を超えるReactコントロールからなり、シンプルなリンクやボタンに始まり、デートピッカーやデータリストといった洗練されたコントロールまで揃っています。 このライブラリはYouTrak、Hub、Upsourceをはじめとする製品でフル活用されています。そしてJetBrainsはこのライブラリを今後も引き続きメンテナンスしていくことにコミットします。 Ring UIライブラリを使う場面として一つあげられるのがHubのダッシュボードに組み込みカスタムウィジェットの開発です。Ring UIを使うことでお馴染みのJetBrainsのインターフェースに馴染みます。是非クイック
【WebAssembly初心者必読】バイナリコードを使って「 WebAssembly 」の基礎を徹底解説してみた！ | 株式会社ヌーラボ(Nulab inc.)
【WebAssembly初心者必読】バイナリコードを使って「 WebAssembly 」の基礎を徹底解説してみた！ WebAssembly はウェブ上での利用に適した軽量でポータブルなデータフォーマットです。ゲームなどの実行速度が求められる分野で使えるように、JavaScript よりも読み込み速度や実行速度を早くすることを念頭に設計されています。それを実現するために、WebAssembly では機械語のようなバイナリコードをブラウザ上で使うようにしています。 JavaScript の生みの親であるブレンダン・アイクが 2015 年 6 月に WebAssemblyを発表してから 2 年が経ち、多くのブラウザで使えるような状況が整いつつあります。 そこで、この記事では WebAssembly のバイナリコードを使ったサンプルのコードを通して、WebAssembly を簡単に紹介したいと思い
脆弱性診断データの活用例 - Webアプリケーション診断編 -
A tool that recommends the inspection character string of the Web application to the security engineer.
Vue.jsを教えるまでの道のり - sushitecture
querySelectorを教えるべきかgetElementByIdとかでやるべきか一瞬迷う（結局querySelectorにする）
PWAの実装をしてみた - 技術探し
一年以上前の記事なので、コードが古いです。気をつけて読んでください。 PWAとは？ 目的 技術スタック Service Worker PWAのview App Shell Content キャッシュ戦略 読み込みフロー Web App Manifest デザイン FirefoxとChromeしかService Workerないけどどうするの？ ネットワーク 実装 ライブラリ webpack-offline 構成 ファイル ルーティング アセットのインストール API周り SSR 資料 さいごに そういえばPWAの実装したことがなかったなと思ったので少し触ってみた。 PWAとは？ PWA(Progressive Web Apps) インストールが不要で、不安定なネットワークでも素早く起動し、プッシュ通知を可能にします。 また、ホーム画面にアイコンも表示でき、アプリと同様の扱いをすることが可能
Fetch の中断と Promise のキャンセル方法の標準化 | blog.jxck.io
Intro XHR から fetch() に積極的に移行しづらかった最大のミッシングピースとして、中断できないという問題があった。 これは、fetch() が選んだ Promise ベースのインタフェースにおいて、キャンセルをどうするかという議論と絡み、長く決着が付かずにいた問題である。 最近、やっと話が前進したので、ここまでの経過を解説する。 Fetch のミッシングピース fetch() は、ブラウザが発行するリクエストと、取得するレスポンスを扱う低レベルなインタフェースとして策定が始まった。 DOM の API が Promise ベースに移行しつつある流れを汲み、fetch() もまた Promise を返す関数一発スタイルになった。 クラスからインスタンスを生成しメソッドを呼ぶ XHR スタイルでは、インスタンスを再利用した場合の挙動などを含め、オブジェクトのライフサイクルを考慮
フロントエンド開発の基本知識（2017年夏） - Qiita
10年ぶりくらいに Web 開発に再デビューしなくてはならなくなった筆者が見た、現代のフロントエンド開発の基本知識についてまとめます。フレームワークを使ったシングルページアプリケーション開発が対象です。若干の不正確には目をつむってズバリ言い切るスタイルで書いていきます。 Node.js 現代のフロントエンド開発には Node.js を使います。フロントエンド開発を強力にサポートするいくつものツールが Node.js で実装されているからです。 Web 開発で言語処理系というと、Ruby on Rails のような Web アプリケーションフレームワークを思い浮かべるかもしれません。もちろん Node.js にもそのようなフレームワークはいくつも存在しますが、フロントエンド開発で使うツールはそれとは全然関係ありません。 これらのツールを使うことによって解決するのは、以下のような要望です :
AMP/PWA をどこで/いつ使うか - Qiita
某所で使った資料の公開版 用語整理 PWA: ネイティブアプリのようなUXを提供するための機能群 SPA: JSで遷移するシングルページアプリケーション AMP: 後述 PWAMP: AMPで流入させてPWAを起動する形式 MFI: モバイルファーストインデックス いまさら聞けないPWAとAMP アメブロ2017: Isomorphic Web Appの進化編 AMP とは イニシャルビューのためのHTMLの特殊なサブセット GoogleにホワイトリストされたHTML属性しか使えない GoogleにホワイトリストされたJSプラグインしか使えない CSSはHEADに全部書く AMP仕様を満たすと、Googleがキャッシュして、モバイルの検索流入ではそのキャッシュを使う HTTPS必須 必ずしも全ページをAMPに対応する必要はない PWA: ServiceWorker の機能 リソースの先読み
ヘッドレスブラウザ(Chrome)を使ってSPAをスクレイピングする - Qiita
一般的なスクレイピング手法とその問題点 スクレイピングというと、HTTPクライアントライブラリを用いてHTML取得し、HTML/XMLパーサーで解析するというのが一般的だと思います。 この手法の場合、以下の場合にうまく処理できません。 ターゲットのページがJavaScriptにより動的にDOMを操作する場合 HTML/XMLパーサーが取得したHTMLを正しく解釈できない場合(正しくないHTMLでもブラウザはなんとか処理するが、パーサーライブラリは正確なHTMLでないと処理できないことがある) 特に問題になるのは前者でしょう。最近のWebサイトではJavaScriptでDOMを操作することは珍しくなくなってきています。SPAであればなおさら難しく、もはやこういった手法によるスクレイピングは不可能でしょう。 ヘッドレスブラウザによるスクレイピング 動的なDOMやパーサーがうまく解釈できないとい
【Bootstrap製】90ページ超えの無料HTML5／CSS3テンプレート素材 Titan
ウェブサイトやアプリ制作に必要なスタイルがあらかじめ定義された、人気CSSフレームワーク Bootstrap。しかし、デザインが他のサイトとかぶってしまうとお悩みの方も多いのではないでしょうか。 今回は、Web制作をより手軽に行うことができる、Bootstrap対応の無料HTML5/CSS3テンプレート素材 Titan をご紹介します。90ページにおよぶ大量のサンプルHTMLページが用意されており、あらゆるプロジェクトに活躍してくれるフリー素材となっています。 Bootstrap を拡張パワーアップ！参考にしたい50個の無料プラグイン、コンポーネントまとめ 無料HTML/CSSテンプレート Titan について Titan はHTML5/CSS3で制作されたBootstrap対応テンプレートで、過去5年間のウェブデザインの傾向を分析して作成されたスタイリッシュな素材です。 じっくりと検討さ
Headless Chrome をさわってみた | CYOKODOG
Headless Chromeのリリースをうけて、PhantomJS のメンテナーが開発の終了を宣言したりとか、ちょっと話題になった Headless Chrome について試してたことをメモっておく。 試したやつのリポジトリ：https://github.com/cyokodog/headless-chrome 概要 ヘッドレス（GUIを表示しない状態）で実行できる Chrome の機能 Chromium と Blink が提供する機能をコマンドラインで利用できる Chrome 59 から利用可（2017/06/08時点ではMAC、Linuxのみ） 活用例 ウェブページのテスト 表示・動作テスト、画像やPDFによる画面のスクリーンショット スクレイピング 認証が必要なサイトでも対応 ヘッドレスで起動する --headless フラグと --disable-gpu フラグ（そのうち指定不要
V8 javascript engine for フロントエンドデベロッパー
V8 is Google's open source JavaScript engine that is used in Chrome and Node.js. It uses several optimization techniques like hidden classes, inline caching, and TurboFan to improve JavaScript performance. V8 first parses JavaScript into an AST, then compiles it into bytecode which is executed by the Ignition bytecode interpreter or optimized by TurboFan into machine code using techniques like hid
Java の上の JavaScript エンジン Nashorn の基本 - A Memorandum
Nashorn とは Java から Nashorn を使う Java オブジェクトを渡す JavaScript の関数を Java から呼び出す JavaScript のオブジェクトを Java から呼び出す JavaScript 内で Java クラスを利用する JavaScript と Java の型 文字列 数値 配列 リストとマップ ラムダ Java クラス・パッケージのインポート JavaScript で Java インターフェースを実装する JavaScript 関数を Java インターフェースの実装として利用する スクリプトを事前コンパイルする Nashorn で REPL する jjs でシェルコマンドを使う nashorn をシェルスクリプトとして使う 例えば まとめ Nashorn とは Java7 までは JavaScript スクリプティングエンジンとして Ri
ヘッドレス Chrome スタートガイド | Blog | Chrome for Developers
要約 ヘッドレス Chrome は Chrome 59 でリリースされています。これは、ヘッドレス環境で Chrome ブラウザを実行する方法です。つまり、Chrome なしで Chrome を実行することになります。Chromium と Blink レンダリング エンジンが提供する最新のウェブ プラットフォームのすべての機能をコマンドラインにもたらします。 なぜこれが有用なのでしょうか。 ヘッドレス ブラウザは、可視 UI シェルが必要ない自動テストやサーバー環境に最適なツールです。たとえば、実際のウェブページに対してテストを実行したり、その PDF を作成したり、ブラウザが URL をレンダリングする方法を確認したりできます。 ヘッドレスの開始（CLI） ヘッドレス モードを開始する最も簡単な方法は、コマンドラインから Chrome バイナリを開くことです。Chrome 59 以降がイ
JavaScript,jQueryの爆速コーディング、デバッグ方法論の勧め～実践向け逆引き(windows,chrome向け)～ - Qiita
※2017/4/21にオンロード時のデバッグ方法8を追記しました！ こんにちは！エイチーム引越し侍の加藤です！ みなさんJavaScript書いてますか？ console.logめっちゃ使うよねーって人は目からうろこのデバッグ方法を、 ケース毎に紹介していこうと思います。(僕はconsole.log使いません) サーバーにデバッグ用のコードをアップロードすること無いので、 消さずに意図に反してリリースしてしまう危険性がないのもお勧めです。 前提知識 F12で出てくるデベロッパーツール(Elements, Console, Source, Network)の知識 Ctrl+Shift+Fで外部ソース(js,css)に対して一括検索ができる HTML、CSSはElementsから直接修正⇒確認ができる jsはSourceから直接修正できる(Ctrl+Sで保存したらその状態で実行できる) jsは
初学者としてJavaScriptを学ぶ | さにあらず
はじめに 僕が以前書いたModern JavaScript 概観、そして Electron へは、読んで貰えただろうか？ あれは初学者には全く向いてないエントリだ。 あのエントリは、僕の理解したモダンな JavaScript 全体について概観することを目的としているからね。 あれを読んで、「今の JavaScript ってこんなに大変なのか…」と感じた人は多いだろう。 しかし、ある程度のソフトウェアを開発するために技術全般を概観しようとすれば、ああいう分量になるのは致し方ない。 と言う訳で、今回はちゃんと初心者向けのエントリを書いた。 少し多く感じるかもしれないが、丁寧に説明しようとしたからだと好意的に解釈して欲しい。 開発環境 Thinkpad X1 Carbon 2016 年モデルに Windows10 をインストールしてある。 ハードウェアスペックは、こうだ。 CPU i7 66
target="_blank" のセキュリティリスク(デモ動画あり)
HTMLを勉強する際に最初に覚えるものの1つにa要素(タグ)があります。HTMLのアイデンティティと言っても過言ではない、ハイパーリンクを実現する大事な要素です。 href属性に設定されたリンク先のURLをどのウィンドウ等に表示するかを決めるtarget属性というものがあります。任意の値を設定してウィンドウに名前を付ける事で、複数のa要素から同じウィンドウへリンク先URLを表示する事もできますし、常に新しいウィンドウを開く_blankのような、あらかじめ挙動が設定されている値もあります。 target="_blank" のセキュリティリスク リンクの開き方を決定するtarget要素ですが、この挙動を利用してリンク先からリンク元のウィンドウを操作できるというセキュリティリスクが公開されています。 Target="_blank" - the most underestimated vulner
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - JetBrains/ring-ui: A collection of JetBrains Web UI components
Vueコンポーネントのユニットテスト
