[B! extension] pipeheadのブックマーク

pipehead id:pipehead

extensionに関するpipeheadのブックマーク (64)

Chrome DevToolsを使いこなそう！ Web開発に必須なブラウザ開発ツールによるデバッグの基本 - エンジニアHub｜若手Webエンジニアのキャリアを考える！
Chrome DevToolsを使いこなそう！ Web開発に必須なブラウザ開発ツールによるデバッグの基本開発者ツール︵DevTools︶とは、ブラウザに搭載されているデバッグツールです。多岐にわたる技術の集合体であるWebページやWebアプリケーション、いわゆるフロントエンドの開発において、なくてはならないツールです。皆さん、どうもこんにちは。今回で3度目のエンジニアHubの登場となる大竹智也です。春の季節もそろそろ終わりを迎え、新生活を迎えた人たちも新たな環境に慣れてくる時期だと思いますが、元気にお過しでしょうか。前回までエディタの話ばかりしてきましたが、今回はエディタから離れてWebブラウザ︵以下、ブラウザ︶の話をしたいと思います。ただ、ブラウザの話といっても、エンジニアHubは開発者向けの媒体なので、ブラウザに搭載されている開発者ツール︵Developer Tools︶のお話を
pipehead 2017/05/30
標準のパネルと React Developer Tools および Redux DevTools で追加されるパネルの簡単な説明

software

web_browser

chrome

extension
リンク
Wildfire - Chromeでマクロを組む方法! 操作を記録して繰り返し自動クリックしよう
ブラウザ上で繰り返し同じ操作をしている場合、マクロを組んで自動化できたら便利ですよね。そこで本記事では、操作を記録して自動クリックを設定できるChrome向け拡張機能﹁Wildfire﹂を紹介します。 Chrome上で操作したカーソルやタブ、キーボードの動きを記録し、忠実に再現できます。専門的なコード知識がなくても、カンタンに設定できるのが魅力です。
pipehead 2017/04/08
software

web_browser

chrome

extension

howto
リンク
フロントエンド開発にめっちゃ便利！CodePenライクな爆速Chrome拡張エディター
有名なライブラリーを読み込んだり、リアルタイムでプレビューしたり。サクッとコードを書いて確認できる﹁Web Maker﹂はオフラインで使えるCodePenライクな開発環境。フロントエンド開発者におすすめのChrome拡張です。この記事では、筆者のKushagra Gourが自ら開発したWeb Makerについて紹介します。Web Makerはブラウザーの拡張機能で、フロントエンド開発者向けの爆速のオフライン開発環境です。フロントエンド開発者なら、CodePen、JSBin、JSFiddleなど既存のコード開発環境を使ったことがあるでしょう。どれもすばらしいもので、必要な機能を備えています。私は主に、直面している問題を解決するときやスニペットについて仲間と議論するときに使っていました。しかし、インターネットを経由する必要があり、立ち上げて使えるようになるまでの遅れを避けられないことに、多
pipehead 2017/03/03
software

web_browser

chrome

extension
リンク
【ブラウザ】 Chromeウェブストアから拡張機能を直接アドレス指定(直リンク)でダウンロードする方法 | ニッチなPCゲーマーの環境構築Z
Chromium派生ブラウザでChromeウェブストアを見たら、右上の『CHROMEに追加』が無くて拡張機能(CRXファイル)がインストールできない。そんな経験ありませんか。あまりないとは思いますが、もし、そういったブラウザにめぐり合ってしまったときは、直接アドレスを指定して拡張機能をダウンロードをしましょう。方法は簡単です。ベースとなるアドレスは https://clients2.google.com/service/update2/crx?response=redirect&prodversion=48.0&x=id%3D【ここに拡張機能のアドレスの最後の文字列を入れる】%26installsource%3Dondemand%26uc
pipehead 2017/01/16
https://clients2.google.com/service/update2/crx?response=redirect&prodversion=48.0&x=id%3D{ID}%26installsource%3Dondemand%26uc

software

web_browser

chrome

extension

howto
リンク
ブラウザでMarkdownを表示する方法 - Qiita
READMEやメモ書き等でよく使われるMarkdown記法ですが、これをブラウザで表示できるようにする方法について紹介します。 Firefox Firefoxを起動します。 Markdown Viewer – 🦊 Firefox (ja) 向け拡張機能を入手より、アドオンを追加します。 Google Chrome, Vivaldi Google Chrome (Vivaldi) を起動します。 Markdown Preview Plus - Chrome ウェブストアより、アプリを追加します。 chrome://extensionsにアクセスします。チェックを入れます。をクリックします。 Optionsをクリックします。チェックを外します。共通mdファイルの関連付けをブラウザに設定します。
pipehead 2016/06/06
Markdown Viewer, Markdown Preview Plus

software

web_browser

chrome

firefox

extension

markdown
リンク
自前Chrome拡張機能がオフにされるのを防ぐ。強制オフされるのを避ける。 - それマグで！
chrome34あたりから警告出るようになりました。 chrome 33-35 の周辺で警告が出続けます。 CRX 、拡張子UserJSもダメです。以前は、拡張子 sample.user.js を放り込んでいけばユーザーJSが使えて便利でしたが。ソレもできなくなりました。自分で作った野良拡張機能をChromeに放り込めなくなっています。強制的に disabledにされます。開発者モードでもダメです。警告が出続けます。警告くらいべつにどってことないけど、起動時に毎回出るのはツライ。対処法 chrome のチャンネルを変える。 beta チャンネルを使う︵← 使えない。2016-05-08確認 dev チャンネルを使う︵← JS の互換性エラーでバグるサイトが多すぎexドコモ︶その他のブラウザを使う vivalid ︵←オススメ Chromium Comodo Dr
pipehead 2016/05/08
--enable-easy-off-store-extension-install

software

web_browser

chrome

extension

howto
リンク
Google公式のブックマークサービス用Chrome拡張機能「Save to Google」　
pipehead 2016/04/15
software

web_browser

chrome

extension
リンク
Google ChromeでMarkdownの確認 - 沖の雑記帳
以前、Githubに上げる際のMarkdownを手軽に確認したいと下記のような記事を書いた GithubのMarkdownを手軽に確認したかった - 沖の雑記帳だが、実はChromeの拡張機能にMarkdown Preview Plusというのがあってこれが結構手軽で便利だった。本当にちょっと確認するだけならこちらのほうが手軽かもしれない。使い方は簡単だけどローカル環境で試すときは少し注意点がある。まず、GithubのMarkdown確認用に使うときはオプションのDefault CSSのドロップダウンからGithubを選んでおくと良い。また独自のCSSを使用することも可能となっている。ローカル環境で試す際には必ず下記の設定を行なっておく必要がある。拡張機能に入りMarkdown Preview Plusの下にある﹁ファイルのURLへのアクセスを許可する﹂にチェックを入れておく
pipehead 2016/04/04
Markdown Preview Plus

software

web_browser

chrome

extension

markdown
リンク
GmailからSMSを送信する方法 | NOV-LOG
本来であれば、SMSはGmailから送信・受信ができるものでは無く携帯電話︵ガラケー︶やスマートフォンなどから送受信するものですが、PC版のAndroidメッセージを使うことでパソコンから送信できるようになりました。 PC版Androidメッセージとは？ AndroidスマートフォンでSMS︵ショートメッセージサービス︶を送信するには専用のアプリを用います。スマートフォン本体にプリインストール︵プレインストール︶されているアプリを用いることが多いですが、別途にGoogleが “Androidメッセージ” アプリを提供しています。このアプリにはパソコンのWebブラウザから利用できるPC版が存在しており、これを使うとパソコンを使ってSMSを送信することができるようになります。 PC版Androidメッセージの使いかた AndroidメッセージのPC版と言っても、SMS︵ショートメッセージサ
pipehead 2016/02/27
SMS from Gmail ™ & Facebook™ (MightyText)

software

web_browser

chrome

extension

howto
リンク
任意のサイトで任意のJavaScriptを自動実行させるChrome拡張 - Qiita
任意のサイトで任意のJavaScriptを自動実行させる拡張機能の紹介です。 nakajmg/ScriptAutoRunner 使い道スニペットを実行させておきたいときに jQueryなどのライブラリを挿入しておきたいときにデバッグに devtools-snippets/にあるconsoleを拡張するスニペットなど、スニペットをあらかじめ実行しておく必要があるものなどに使えます。ブックマークレットなどで挿入していたjQueryなども自動で挿入することができます。ホスト名でフィルタリングできるので、デバッグにも使えると思います。使い方まず実行させたいスクリプトを追加します。スクリプトの追加は拡張のオプションページから行います。オプションページは次の3つの方法で開くことができます。拡張機能のアイコンを押して歯車アイコンをクリック拡張機能のアイコンを右クリックして"オプション"
pipehead 2015/09/23
ScriptAutoRunner

software

web_browser

chrome

extension
リンク
使える「広告ブロック拡張機能」10選
ブラウザで表示される広告コンテンツはページの読み込みを遅くするため、快適なブラウジングの妨げになることがあります。近年では﹁Adblock Plus﹂をはじめ、数々の広告除去ツールがChromeやFirefoxの拡張機能としてリリースされていますが、それぞれどのような違いがあるのか、コンピュータ関連の調査を行うRaymond.CCがピックアップした10個の広告ブロック拡張機能をテストしています。なお、2018年4月20日に記事中に登場する広告ブロック拡張機能の1つ・AdR emoverが拡張機能を装ったマルウェアであるという事実が判明し、研究者から﹁同様の拡張機能が大量に提供されている状態にあるとみられる﹂と注意喚起が行われているので、他の拡張機能も使用する際には注意して下さい。 10 Ad Blocking Extensions Tested for Best Performance •
pipehead 2015/08/28
AdBlock, Adblock Plus, Adblock Pro, Adguard AdBlocker, AdRemover, Ghostery, Simply Block Ads!, SuperBlock Adblocker, μBlock, uBlock Origin

software

web_browser

extension

chrome

firefox
リンク
Firefox 41 アドオン互換性情報
[これは Mozilla Add-ons Blogの記事 Add-on Compatibility for Firefox 41 の翻訳です] Firefox 41 が9月22日 [日本時間同日深夜] リリースとなります。Firefox 41 の変更点でアドオンの互換性に影響を及ぼす可能性のあるものを以下にまとめました。Firefox 41 for Developers により詳しい情報が載っていますので、こちらも併せてご覧ください。拡張機能への署名41は、新たな署名要件が強制される初のバージョンとなります。Firefox 40 では警告が表示されるだけでしたが、41では未署名の拡張機能は初期設定で無効化されます。AMO に掲載されているアドオンの署名はすべて完了しており、現在は AMO 非掲載アドオンの調査を進めているところです。一般設定項目 browser.
pipehead 2015/08/16
> Firefox 40 では警告が表示されるだけでしたが、41 では未署名の拡張機能は初期設定で無効化されます。

software

web_browser

firefox

extension

change
リンク
Chrome で今見ている Web サイトでどのような技術が使われているのかを調べる拡張機能 BuiltWith Technology Profiler
Web 開発者の方であれば今開いている Web ページにどのような技術が利用されているのか気になる事がありますよね。ソースを表示したり Developer Tools を起動したりして調べるのも良いですがさくっと確認するだけであればBuiltWithTechno logy Profiler という拡張機能を利用するのが便利です。この拡張機能を入れるとメニューバー上にアイコンが表示されるので、調べたい Web ページを開いてアイコンをクリックするだけです。例えばこのブログだと上記のような感じに表示されます。かなーり縦に長いので文字で書きますが以下のような情報を取得しています。 Web サーバの種類, バージョンネームサーバホスティングしているサーバ CMS の種類, バージョン使用しているフレームワーク広告の種類ユーザ統計情報(Google Analytics 等) Jav
pipehead 2015/07/25
software

web_browser

chrome

extension
リンク
uBlockとuBlock Originの違い - あれこれ備忘録@はてなブログ
調べてみたら、このような記事がありました。 uBlockオリジナルの作者が現開発陣の運営方針を疑問視し、独自に開発存続をアナウンス www.reddit.com/r/newsokur/comments/33wick/ublock はてなブログにおいて更新できなくなるエラーが出ているので、リンクは貼りません。コピーしてアドレスバーに貼り付けてアクセスしてください。元の開発者が開発継続やサポートを考えて、あるチームに権利を譲渡。しかし、そのチーム(というよりも一人の人物Chris Aljoudi)が寄付を名目として他人のコードでお金を集めたり、他人の作ったフィルターを定期的に更新することを自分たちにコードが移ってからの大きな成果であるようにしている点を元の開発者は問題視したようです。フィルター設定ファイルの自動更新は便利なようですが、既にある程度確立したフィルター設定は毎日更新が必要な
pipehead 2015/06/24
software

web_browser

extension

chrome

firefox
リンク
Firefox 40 アドオン互換性情報
[これは Mozilla Add-ons Blogの記事 Add-on Compatibility for Firefox 40 の翻訳です] Firefox 40 が8月11日 [日本時間同日深夜] リリースとなります。Firefox 40 の変更点でアドオンの互換性に影響を及ぼす可能性のあるものを以下にまとめました。Firefox 40 for Developers により詳しい情報が載っていますので、こちらも併せてご覧ください。拡張機能への署名 Firefox 40 は新たな署名要件が適用される初のバージョンとなります。AMO に掲載されているアドオンの署名はすべて完了しており、現在は AMO 非掲載アドオンの調査を進めているところです。このバージョンには署名要件を無効化する設定項目 (xpinstall.signatures.required) がありますが、41
pipehead 2015/06/20
> このバージョンには署名要件を無効化する設定項目 (xpinstall.signatures.required) がありますが、41 で削除されます。

software

web_browser

firefox

extension

change
リンク
Chrome拡張「Scraper」でWEBページ情報を手軽にスクレイピングしてデータ化する方法
Scraperとは Scraperは、WEBページ上の規則性のあるデータを手軽に取得することができるChrome拡張です。例えば、テーブルデータや、Aリンクデータ、のような特定のHTML要素に入っている情報を、片っ端から取得してテーブルデータ化することができます。また、その取得したデータをワンクリックでGoogleスプレッドシートに保存することができます。テーブルデータのスクレイピングは以下の動画を見た方が分かりやすいかも。以下では、その使い道などをいくつか考えてみました。テーブルデータの取得最もオーソドックスな使い方と言えば、動画にも出てきたテーブルデータの取得です。例えば、信長の野望の以下のような武将データテーブルがあったとします。これを、以下のように選択して、Chromeの右クリックメニューから﹁Scrape similar︵似たものをスクレイプ︶﹂を選択します。す
pipehead 2015/05/04
software

web_browser

chrome

extension
リンク
Webページ上のGIFアニメを停止させるGoogle Chrome拡張「Stop Animations」NOT SUPPORTED
pipehead 2015/02/19
software

web_browser

chrome

extension
リンク
HTML5開発に適したIDEを探す（その3）「Google Chrome Workspaces」
Visual Studio、WebStormに引き続き、今回もHTML5/CSS3/JavaScriptによるWebシステム開発をサポートしたIDEを紹介します。今回は開発に特化したという訳ではありませんが、Webシステム開発を十分にこなせる存在になってきたGoogle Chrome Workspacesを紹介します。単体ではまだ物足りない機能がありますが、機能拡張を組み合わせることでIDEとして十分な性能になってきています。セットアップ Google Chrome Workspacesでは、DevToolsを使ってローカルフォルダを登録するところから開始します。まずはDevToolsを開いて、SourcesタブにてAdd Folder to Workspaceを選択します。そしてローカルのフォルダを登録すると、フルアクセスを求める通知が出ますので許可します。許可するとこのようにSo
pipehead 2015/02/12
DevTools + Web Server for Chrome + Grunt Devtools

software

web_browser

chrome

extension

howto
リンク
Latest topics > Firefox 41以降での、アドオンの署名義務化の影響について - outsider reflex
Latest topics > Firefox 41以降での、アドオンの署名義務化の影響について宣伝。日経LinuxにてLinuxの基礎？を紹介する漫画﹁シス管系女子﹂を連載させていただいています。以下の特設サイトにて、単行本まんがでわかるLinux シス管系女子の試し読みが可能！ « ﹁シス管系女子﹂の本のおまけについてMainシス管系女子の刊行物の関係まとめ » Firefox 41以降での、アドオンの署名義務化の影響について - Feb 12, 2015 より安全なアドオン体験を提供するため、拡張機能に署名を導入します | Mozilla Developer Street (modest) 具体的にアドオンを作る・使う側の人間はどう対処すれば良いのか、というのを自分の理解でまとめてみる。判断のソースは原文のコメント欄での質問と回答で示されている情報です。 AMOでFull R
pipehead 2015/02/12
software

web_browser

firefox

extension
リンク
より安全なアドオン体験を提供するため、拡張機能に署名を導入します
pipehead 2015/02/11
software

web_browser

firefox

extension
リンク
1 2 3 4 次のページ