👻 GhostText — Use your text editor in the browser
• Use your text editor in the browser Whenever you’re writing more than a little snippet of code anywhere on the web, activate GhostText to open your preferred text editor and enjoy your own development environment. Installation GhostText is a browser extension that connects to your editor via its own extension. Install both extensions and, if necessary, start the GhostText server in the editor’s
知っておきたいブラウザについての基礎入門
知っておきたいブラウザについての基礎入門 at サポーターズ京都勉強会 https://supporterz.connpass.com/event/51220/
ブラウザでビジュアルテストをするreftest-runnerを作った
概要 reftest-runnerというブラウザで描画内容やレイアウトといった表示結果をテストするためのライブラリを作りました。 要素技術としてはブラウザ、WebDriver API、レンダリングキャプチャ、画像Diffという感じです。 azu/reftest-runner 時間が無い人向け 以下のスライドに簡単にreftest-runnerやreftestとはなにか、どういうユースケースがあるのかが書いてあります。 reftest-runner-overview.pdf reftestとは reftest(Referrence Test)とは、2つのHTMLの表示結果(スクリーンショット)を比較することで表示結果が意図したものかをテストする方法です。 用意するHTMLとして以下の2種類を1セットとして用意して利用します。 テスト用HTML テストしたい機能を使って実装したHTML リファ
Rubyでブラウザを操作する！Watirを使ったブラウザ操作の自動化 - .logbook
仕事や普段の作業で、ブラウザを操作する作業がめんどくさいと感じていた。 ブラウザ経由での勤怠情報入力 特定のサイトにアクセスしてのファイルアップロード これを自動化することができないか？と調査していたところ、Rubyでプログラムを記述してブラウザを操作できるライブラリを発見。早速使ってみた。 ※今回はひとまずUbuntu 13.10上で動作させている。 インストール 下記順でコマンド入力して、インストールした。(ruby-devがないとエラーが出る) $ sudo apt-get install ruby-dev $ sudo gem install mini_magick $ sudo gem install watir プログラム作成 Rubyプログラムを記述。今回は「Yahoo!にアクセスして、ヤフオクのリンクをクリックする」を自動化してみた。 require "watir" bro
termshare – ターミナルの出力をブラウザで共有
MOONGIFTはオープンソース・ソフトウェアを紹介するブログです。2021年07月16日で更新停止しました ハンズオンや技術者向けのセミナーなどで画面を共有したいと思うことがあります。それはデスクトップの場合もありますが、ターミナル操作の場合もあります。 サーバ構築系などでターミナル操作を見て欲しいと思ったら、ズームなどを使うのではなくtermshareを使ってみると面白そうです。 termshareの使い方 termshareのインストールはワンライナーです。 curl -sL https://termsha.re/download/$(uname -s) | tar -C /usr/local/bin -zxf - 使い方も簡単で、 termshare を実行するだけです。実行すると次のようにURLが生成されます。 このURLに参加者がアクセスすると、Webブラウザ上にターミナルの実
Bragi-Browser - ブラウザのデバッグコンソールをさらに便利に MOONGIFT
ブラウザのデバッグコンソールでは console.log を使うのが一般的ですが、他にも console.info や console.warn などでアイコンの変更ができるようになっています。しかし大量のメッセージが流れる中ではこれだけでは分かりづらいかも知れません。 そこで使ってみたいのがBragi-Browserです。ログメッセージをグルーピングしたり、多色展開できるログシステムです。 Bragi-Browserの使い方 Bragi-Browserはnodeのライブラリとしてローカルで動作することもできるログライブラリです。 こんな感じで様々な色が使えます。グループを指定するだけなので簡単です。 読み込んでさえしてしまえば、普通のログと変わらず使えます。 BRAGI.log('groupname', 'message'); CommonJSを使うこともできます。 var logger
初心者がWebフロントエンドを高速化するための基礎知識
連載目次 ブラウザーの持つ開発ツールとその使い方を紹介する連載「無料で使えるブラウザー開発ツール入門」の第2回です。初回の「初心者がブラウザーでデバッグするための基礎知識」では、フロントエンド開発を始めた方が、ブラウザーに組み込まれている開発ツールを使ってアプリの不具合を見つけ、修正するためのツールとその基本的な利用方法を紹介しました。 前回紹介した「DOMインスペクター」「スタイルエディター」「JavaScriptデバッガー」を駆使して、不具合の原因特定と修正を行えるようになり、意図通りに動作するアプリを作成できるようになった方も多いのではないでしょうか。 ところが、フロントエンド開発者には不具合の修正と同様、一定のパフォーマンスの確保もアプリ作成で必要とされます。誰もが体験されたことがあると思いますが、「自分の思い通りに動作してはいるのだが、どうにもこうにも遅くてストレスがたまる」とい
ブラウザストレージ技術とプライベートブラウジング（改訂版） - Nothing ventured, nothing gained.
4年前に HTML5のストレージ技術とプライベートブラウジング - Nothing ventured, nothing gained. という投稿をした。ブラウザのストレージ技術であるWeb SQL Database、Local Storage、Session Storage（いずれもWeb Storageで規定）のそれぞれが各ブラウザのプライベートブラウジングモードで使えるかを試してみたものである。 4年が経過し、各ブラウザの実装状況も変化した。また、ストレージ技術にも変化があったので、改めて調査してみた。 対象としたブラウザは前回と同じ5種類。Internet Explorer、Firefox、Opera、Safari、Chrome。それぞれ以下のバージョンを用いた。 Internet Explorer - 11.0.9600.17126 (Windows 7) Firefox - 3
File System and JavaScript. Processing Files in Browser - XB Software
File System and JavaScript. Processing Files in Browser There are plenty of tasks connected with creating, parsing, editing, saving and removing files. Most of them are performed on the server side. First of all, we do that because Java, C# or whatever language we use on the backend can easily handle all these tasks. However, a huge problem persists: there’s only one server for all your users and
Disable Javascript Console in Browsers
Randomly found this interesting reading about how Facebook disable developer tools at StackOverflow. It turns out, it's actually possible to disable Javascript console using Javascript alone but with a caveat. It started with a recent Facebook scam, users are being convinced/guided to paste malicious codes into the Javascript console which will post SPAM or hack accounts. And now, Facebook is rand
Sublime Text 2で素早くブラウザプレビューする方法 - Web New Jack
港で噂のSublimeText2ダウンロードして放置していましたが、久々にさわってみました。 Coda2がネイティブになっている者からするとリアルタイムプレビューできないのはキツイす..＞＜.. SublimeText2にもありました！（似たようなの） 「Browser Refresh」 ショートカットでブラウザを更新してくれます。 Package Controlから検索してみてください。 (Package Controlを入れてないかたは検索を) デフォルトだと、macでは「cmd+shift+r」でブラウザが更新されます。 試したら他のパッケージとバッティング？してしまって動きませんでした。 なので、ショートカットを変えたところ良い感じに！ 「command+s」でsaveしつつbackgroundでブラウザを更新してくれます。(ﾟ∀ﾟﾉ)ﾉ 設定方法設定内容は↓ ツールバーの「Sub
Code editor awesomeness ...in your browser :: ICEcoder
So, what's ICEcoder? ICEcoder is a browser based code editor, which provides a modern approach to building websites. By allowing you to code directly within the web browser, online or offline, it means you only need one program (your browser) to develop sites, plus can test on actual web servers. After development, you can also maintain the website easily, all of which make for speedy and smart de
［速報］グーグル、WebKitをフォークして新しいレンダリングエンジン「Blink」を開発すると表明
グーグルは、これまでChrome/Chromiumのレンダリングエンジンとして採用してきたWebKitをフォークし、新しいレンダリングエンジンの「Blink」をオープンソースで開発すると今朝表明しました。 グーグルのDeveloper Relations Japan Blogに投稿された「Chromium プロジェクトの新しいレンダリングエンジン Blink のご紹介」で、なぜWebKitからフォークしてBlinkの開発を始めるのか、その理由が記されています。 Chromium は 他の WebKit ベースブラウザーと違い、マルチプロセス アーキテクチャを採用しているため、WebKit プロジェクトと Chromium プロジェクトはここ数年複雑化の一途を辿ってきました。これにより、全体的なイノベーションの速度が低下してきたことは否めません。そこで本日、WebKit ベースの新しいオープ
ファイル編集したら即ブラウザー再読込させる LiveReloadX を作った
Web 開発してると、ソースを編集して、ブラウザーをリロードして、という作業の繰り返しになりがちだ。ソースを編集したら、自動でブラウザーをリロードしてくれるような夢のツールがあれば便利そうだ。 この分野では CodeKit や LiveReload などが有名なんだけど、もれなく有料だったり GUI だったりする。そこで、LiveReload のオープンソースな部分を参考にしつつ、コマンドラインで使える LiveReloadX というものを作ってみた。 特長はこんなところ。 Node.js を使ってるので Windows/Mac/Linux 問わずに動かせる 開発環境のブラウザーだけでなくスマートフォンのブラウザーもリロードできる 無料 インストール方法 インストールは超簡単！ Node.js をインストールする。 コマンドラインで npm install -g livereloadx を
[JS]ブラウザとそのバージョンだけでなくOSもデバイスもスクリーンサイズも判定し、CSSのセレクタで利用できる便利なスクリプト -CSS Browser Selector+
IE6/7/8/9, Firefox, Chrome, Safari, Operaは当たり前、Win, Mac, LinuxなどのOS、iPhone, Android, iPod, iPadなどのデバイス、スクリーンのサイズ、言語などを判定し、それらをCSSのセレクタで利用できるスタンドアローンのスクリプトを紹介します。 CSS Browser Selector+ CSS Browser Selector+の特徴 CSS Browser Selector+の使い方 CSS Browser Selector+の特徴 CSS Browser Selector+はハック無しで、さまざまなUAをCSSのセレクタで指定できるスクリプトです。ブラウザごとに異なるスタイルシートの適用、スマフォやタブレット用のレスポンシブなスタイルにも利用できます。 CSS Browser Selector+が判別するの
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Getting Sublime 3 To Launch your HTML page in a Browser with a Key Combo - DZone Web Dev
zsh を使って簡単に URL や HTML ファイルをブラウザで開く - Qiita
Internet Explorer デベロッパー センター
アドオン「Jetpack」でAndroid用Dolphinブラウザが10倍速くなる？ | ライフハッカー・ジャパン
ブラウザで Perl をためせる Farabi がすごい。 - tokuhirom's blog