Lumberjack·Webブラウザのconsoleをパワーアップ！ MOONGIFT
おお、これを入れておくとかなり捗りそう！ 最近のブラウザは開発ツールが充実しており、JavaScriptやAjaxを使った処理がとても簡単に作ったりデバッグしたりできるようになっています。しかし物足りない…と感じている人も多いかもしれません。 consoleはWebブラウザからデフォルトで提供されている機能なのでそのまま使うのかと思っていたのですが、実際には拡張ができます。その一例として紹介したいのがLumberjackです。 実行例です。色々な表示が行われているのが分かるでしょうか。 例えばこんな感じに書きます。 console.stream('cat').info('I do not like you.'); console.stream('cat').warn('Hiss!'); console.stream('dog').info('The feeling is mutual.')
Googleの新しい写真管理アプリ『Google+フォト』を未対応のWin・Macにインストールする方法 | ライフハッカー・ジャパン
疲れやすい、呼吸の浅さを改善。ストレッチポールは毎日使いたいほど気持ちがいい!【今日のライフハックツール】
Learn web development | web.dev
Stay organized with collections Save and categorize content based on your preferences. Explore our growing collection of courses on key web design and development subjects. An industry expert has written each course, helped by members of the Chrome team. Follow the modules sequentially, or dip into the topics you most want to learn about.
1分で実現できるjavascriptにおけるconsoleまわりの有用なテクニック4つ - Qiita
jsのconsoleまわりのテクニックはいろいろありますが、個人的に有用だと思ったものにしぼって紹介します。 chromeなら、command + option + jでconsoleを開いて下記のコードを貼りつければ実際に動きを確認できます(1分でできます!!)。 console.logの出力結果をcssで装飾する 出力例 サンプルコード console.log("%csuccess", "background-color:#5bb75b;color:white"); console.log("%cfail", "background-color:#da4f49;color:white;font-size:30px");
Web屋ならチェックしておきたい！作業効率が激変するChrome DevToolsの便利な使い方まとめ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
Web屋ならチェックしておきたい！作業効率が激変するChrome DevToolsの便利な使い方まとめ こんにちは、デザイナーの王です。 今回の記事では、ChromeのDevTools（デベロッパーツール）について、「多分、周知されていないけど、使わないともったいない！」的な機能を紹介させて頂きたいと思います。 フロントエンジニアにも、デザイナーにも、きっと効率アップに繋がる小技が見つかるはずです。 開発者なら「Chrome Canary」を使おう！ みなさんはChrome Canaryを使っているんでしょうか？一般向けにリリースされている安定版であるChromeより、ほぼ毎日アップデートしている「Canary」ビルトを選ぶ理由があります。 それは、開発者向けの新機能がいち早く利用できるからです！リリースがノロノロしているChromeを使ってたら、いつまでも最新の便利な機能の恩恵が受けられ
DevTools Snippets
allcolors.js # (view raw) Print out all colors from computed styles used in elements on the page. Uses styled console.log calls to visualize each color. // allcolors.js // https://github.com/bgrins/devtools-snippets // Print out CSS colors used in elements on the page. (function () { // Should include colors from elements that have a border color but have a zero width? var includeBorderColorsWit
responsive-web-design - Chrome Web Store
Responsive web design test Chrome extension using http://responsive.victorcoulon.fr/ code
Mobile Tester Chrome Extension
Test responsive web designs or mobile pages that detect specific user agents. Test multiple devices at the same time!
CSSファイルやJavaScriptファイルを閲覧した際に自動整形して表示するChromeエクステンション・PrettyPrint
ブラウザでCSSやJavaScriptのファイルを見たときにソースを自動整形して表示するChromeエクステンション・PrettyPrintのご紹介。地味に便利・・かも。 ブラウザでCSSやJSファイルを見たときにソースをインデントするエクステンションです。便利っちゃ便利かも。
コード作成やデータ編集作業など、マイナーだけどすこぶる便利なChromeアプリを一挙まとめ | ライフハッカー・ジャパン
最近、めまぐるしい成長っぷりを見せているChromeアプリストアの「オフラインアプリ」たちですが、残念なことにその多くが知名度を得られていない状態になっています。そこで今回は、米Lifehackerお気に入りの知られざるアプリたちをいくつか紹介してみたいと思います。 Googleはここ最近、Chromeウェブストアにオフラインアプリを数多く投入してきています。オフラインアプリとは、PCにインストールしたアプリさながらに、Chormeブラウザ内で使えるアプリのこと。Chromeブラウザがインストールされているパソコンであれば使えるので、借り物のノートPCや容量が少ないPCで作業する際にもかなり便利です。 全てのアプリがオフライン作業に対応しているわけではありませんが、オフライン使用が可能なものも段々と増えてきています。つまり、大量の容量を必要とするデスクトップソフトウェアの代替として、オフラ
SafariやGoogle ChromeでGreasemonkey·NinjaKit MOONGIFT
NinjaKitはSafariやGoogle Chromeで使えるYet Another Greasemonkeyです。 Webサイトの表示や動作を自分好みに変更できるUserScript。そんなUserScriptをSafariなどでも使えるようにする機能拡張がNinjaKitです。 インストールします。SafariまたはGoogle Chrome版があります。 設定画面です。 UserScripts.orgでInstallボタンを押せばフローティングが表示されてそのままインストールできます。 スクリプトの編集機能もあります。 タブ幅を変えたりもできます。 ちゃんと動きます！ Google ChromeではデフォルトでUserScriptに対応していますが、Greasemonkeyとの互換性は完璧ではありません。もし動かないスクリプトがあればNinjaKitを使ってみるのも良さそうです。
最近Chromeが重いと感じたら…軽さを取り戻すための6つの爆速化設定 | 教えて君.net
Google Chromeが「軽さ」を売りにしていたのは過去の話。最近は先進的な機能を盛り込んだ分、重くなっており、ちょっと古いマシンで重いページを開くと、固まってしまうこともしばしば。軽量化のためのチューンアップが欠かせないのだ。基本である初級編から、ちょっとリスクのある上級編まで、Chrome軽量化のテクニックをおさらいしよう。 Chromeが重いときの対処法としては、まず、履歴やキャッシュが溜まっていないかを確認しよう。これらのデータを全て削除し、ネットワークの自動検出の設定を無効化する。ここまでが基本の設定。パソコンのスペックが充分な場合は、これでChromeは快適に動くようになるはず。 それでもまだ重い場合は、ブラウザ動作の体感速度をアップさせる工夫が必要だ。Chrome標準の「先読み」機能を有効にして、ウェブの読み込み時間を短縮。さらに、タブを複数開いているときに、使っていない
GoogleChromeにバック・ボタンを付けるURLスキームが分かった - W&R : Jazzと読書の日々
PocketからGoogleChromeの連携がiPadを便利にする どのブラウザにも付けてほしい。「後で読む」のPocketが20日にバージョンアップして、Chromeとの連携を内蔵しました。その時は気にしてなかったんです。ChromeだろうがSafariだろうが同じ... PocketのChrome連携機能。考えてみると、これが出来るのはURLのオプションしか考えられない。けれど、通常の「googlechrome:」では、全てがURLアドレス扱いになるのでコールバックはできない。するともう一つ、URLスキームがあるはず。 iOS6のURLスキームをお手軽に調べる決定版 SchemeTaker photo credit: skene via photopin ccさて、明日はiPad mini発表予定の日。薄くて軽いのが出ますように。何かと重宝するURLスキーム。だけど、作者の人が公開し
Google ChromeでJavaScriptのデバッグをする際にはぜひインストールを！·JS Runtime Inspector MOONGIFT
JS Runtime InspectorはGoogle ChromeのJavaScriptデバッグを強力にサポートしてくれるソフトウェアです。 最近はJavaScriptを徹底的に活用したWebアプリケーションも増えてきました。そんな中デバッグは非常に困難になってきています。そこで使ってみたいのがJS Runtime Inspectorです。 インスペクタにJS検索フィールドが追加されます。 検索結果です。 そこから定義されている場所に簡単に飛べます。 利用例。 JS Runtime Inspectorを使えばJavaScriptを掘り下げて調べるのがとても簡単になります。関数名の他、値でも検索できるので目的の処理を見つけるのが簡単になるはずです。 JS Runtime InspectorはGoogle Chrome用、MIT Licenseのオープンソース・ソフトウェアです。 MOONG
『JavaScript開発時に便利なツールたち』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして。アメーバ事業本部でディベロッパーをしています、平木(id:Layzie)です。 先日2/9に行なわれたFrontrend Vol.4で"JavaScript Development Tools – JavaScript開発の効率アップ"というテーマで登壇させていただいたのですが、セッションでは時間の都合でお話できなかった補足や、その他のツールのご紹介をしていきたいと思います。公式サイトで各講演のスライドと動画を見ることができますので、残念ながらイベントにいらっしゃらなかった方は、ぜひご覽になってください。 Chrome Canaryビル
Chrome上で動くLocal Proxy "Klepto"をベースにしたフロントエンド開発フローの展望
（HTTP）Proxyとは ブラウザとサーバの通信を中継したりする 高速通信のためにデータをキャッシュしたり サーバ側でリバースプロキシとして使ったり 大学や企業で検閲に使ったり SquidやDeleGateとか有名
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Download YouTube Videos as MP4 Userscripts.org
https://bugs.chromium.org/p/chromium/issues/detail?id=175294
YouTube人気急上昇
画像やフラッシュを隠してテキストだけに集中できるChrome拡張機能『Text Mode』 | ライフハッカー・ジャパン