ChromeのvimiumでEmacsキーバインドにしてみる - swat 技術blog
はじめに vimiumをEmacs風に設定した中でハマったところがあったので、記録を残しておく vimniumとは vimライクの操作が可能になるChromeの拡張プラグイン 環境 Chrome 59.0.3071.115 vimium 1.59 macOS sierra 10.12.5 Emacsで使いたい キーバインド参考 公式wikiや個人の方が設定を公開してくださっているので、基本これをコピペすればOKでした GitHub - raamdev/vimium: My Vimium key bindings (Emacs-style). Key Mappings · philc/vimium Wiki · GitHub alt/optionが効かない？ <a-*>のキーバインドが効かないっぽい 公式のissueで似たような質問が… https://github.com/philc/vi
GitHubのissueへのリンクをMarkdown etcでいい感じにコピーできるChromeの拡張機能をつくった - Qiita
2017.09.19 追記 プルリクもissueと同じようにコピーできるようになりました 👇のような感じでコピーされます。 #5｜Sample pull request (Pull request) TL;DR GitHubのissueへのリンクをタイトル、IDも含めてコピーできるChromeの拡張機能をつくりました。 issueもしくはプルリクのページ閲覧時のみアクティブになり、たとえばこのissueであれば、 #1｜Sample Issue 👆の形になるようMarkdown、HTML、プレーンテキストから選んでコピーできます。 チャットやissue、プルリクなどに貼り付ける際の手間が軽減され、パッと見もわかりやすいのでそれなりにいい感じです。 インストール Chrome Web Store コピーがめんどう… 自分の会社ではエンジニア以外も全員がGitHubのissueでタスク管理
agoutiというWebDriverクライアントを使って面倒な作業を自動化する - Qiita
普段の仕事で定例化しているものや、同じ作業を何回もしていて面倒だと感じることって結構あると思います。 特にWebの操作はポチポチ何回もやるのは面倒です。 そこで、Selenium WebDriverを使って作業の自動化をしてみます。 WebDriverのクライアントは様々な言語から出ていますが、今回はGolangのAgoutiというライブラリを利用します。 Golangにしたのは、一つのバイナリになるのでチームなどへの連携、配布が楽ってのが大きな理由です。 事前準備 WebDriverをインストール Chrome用のWebDriverをインストール 他のブラウザでも構わないですが、以下の記事の通り、FireFoxはまだ動きませんでした。(2017/1/24時点) Firefox 48以降でselenium-webdriverが動作しない問題とその回避策 - Qiita 現状、chromed
超最低限の Chrome エクステンションを開発しウェブストアで公開するまでの手順 - Qiita
つい最近、初めて作った Google Chrome エクステンション「Feedly をはてブ対応させる Chrome エクステンション」をブログで紹介したので、その時の技術的なメモなどを Qiita に残しておきたいと思います。まあ検索すればすぐに集まる程度の情報ではあるものの、一箇所にまとまってなかったので、自分用の備忘録でもあります。 全てのソースコードは github 上で公開しているので、気になる方は参考にしてみて下さい。実際に書いたスクリプトの簡単な解説もこの記事の最後に付録として付けています、 超最低限な Chrome エクステンションの作成 Chrome エクステンションは基本的に、一つのフォルダに保存された複数のファイルからなります。エクステンションのルートに必要な最初のファイルは、manifest.json というファイルで、これがエクステンションの基本的な情報を含んでい
閲覧中のWebサイトで使われている技術を確認できるChrome拡張「Wappalyzer」のご紹介 - Qiita
はじめに エンジニアたるもの、よそで使われている技術は気になると思います。今回は、そんな時に役立つChrome Extensionの「Wappalyzer」をご紹介します。 概要 Wappalyzerは、ブラウザに現在閲覧しているWebサイト内で使われているテクノロジーを覗き見する機能を追加できる拡張スクリプトです。 Chrome Extensionとして配布されているほか、FirefoxのAdd-onとしても配布されているので、どちらでもお好みのブラウザで利用が可能です。 Chromeのかたはこちらのリンクより、Firefoxのかたはこちらのリンクよりダウンロードが可能です。 使ってみる 導入方法をご紹介しましたので、早速実際に使ってみましょう。 今回はWappalyzerを導入したGoogle Chromeにて、Qiitaの執筆画面を見てみます。 まずはじめに、対象とするページを開いた
Chromeのタブを自動スリープさせてメモリを節約できるオススメ拡張機能 - あなたのスイッチを押すブログ
なにはともあれ、インストール 今回ご紹介する「The Great Suspender」は、Google Chrome 専用の拡張機能。以下の Chrome ストアから無料でダウンロードできます。 サイトにアクセスしたら、右上の「Chrome に追加」ボタンを押して完了です。 インストールが完了すると、右上に人の顔のようなアイコンが追加されます。 実際に使ってみよう 使ってみようと言っても、基本的には自動的にスリープするので、あまり能動的なアクションは必要ありません。 一定時間使われなかったタブは、こんな感じでスリープします。クリックをすると再読み込みされるような仕組み。 右上のアイコンをクリックすると、「このタブを一時的にスリープさせない」「このタブ以外のすべてをスリープさせる」などの設定が可能です。 使いやすいように設定をしよう 右上のアイコンをクリックして「setting」を選択すると
Chrome愛用のエンジニアであれば、これだけは入れておくべき拡張機能を8つに絞ってみた｜TechClips[テッククリップス]
ウェブ系エンジニアにとってブラウザは、自分好みにカスタマイズして使い倒したい一種の仕事道具のような存在なのではないでしょうか？ 最近だと、純国産で多機能なブラウザ「Kinza」が登場し、国内でもエンジニア好みのブラウザが増えている印象。 とはいえ、やはり不動の人気を誇るのがGoogleの提供するChrome。これまで幾度となく、ネット上ではエンジニアにとってオススメのChrome拡張機能が紹介されてきましたが、今回改めてエンジニアにとって本当に必要であろう拡張機能を8つに厳選しました。 Chrome愛用のエンジニアはお見逃しなく！ 1. YSlow http://yslow.org/ エンジニア向けとしてよく紹介される王道の拡張機能「YSlow」。サイトパフォーマンス計測ツールであり、Webサイトの表示を高速化する際に役立ちます。 最近で言えば、このサイトスピードをいかに早くするか、ある意
![Chrome愛用のエンジニアであれば、これだけは入れておくべき拡張機能を8つに絞ってみた｜TechClips[テッククリップス]](https://cdn-ak-scissors.b.st-hatena.com/image/square/49b48a9a28ce96184a2dafcfd8da5a9633f5c938/height=288;version=1;width=512/https%3A%2F%2Fobject-storage.tyo1.conoha.io%2Fv1%2Fnc_261159609ad84809af5afcb9e5f56abb%2Ftechclips%2Fimages%2F167%2Fimage.png)
クポ速
Qoo10カテゴリのQoo10 BBIA Official_JPの新着クーポンコードの一覧を随時まとめています。 割引クーポンを見つけた日別にまとめており、記事の上にあるものが最新の割引クーポンになります。 Qoo10（キューテン）のショッ...
[ オススメ拡張機能 ] 効率オタクが長年使って本当に厳選した「Chrome拡張機能」まとめ（2020年5月追記）| ヨッセンス
こんにちは!「効率化オタク」すぎて書籍まで出版したヨス（プロフィールはこちら）です。 わたしがネットを閲覧する「ブラウザ」といえば、完全にGoogle Chrome派で、登場した当初から使っています。 Google Chromeを好んでいる理由はいろいろありますが、拡張機能の便利さが一番の理由でしょう。 そんなGoogle Chromeの超・ヘビーユーザーであるわたしがどんな拡張機能を使っているか気になりませんか？ 本記事では、わたしが実際に使って心の底からオススメできる拡張機能だけを紹介します。 状況が変わりしだい、随時更新していきます！ 「新規タブ」を自分好みに改造できる拡張機能 Google Chromeで新しいタブを開くというシチュエーションがよくありますよね。 ところが、初期の状態だと「新規タブページ」が不便なのです。 そこで、拡張機能「Speed Dial 2」を導入すれば、新
![[ オススメ拡張機能 ] 効率オタクが長年使って本当に厳選した「Chrome拡張機能」まとめ（2020年5月追記）| ヨッセンス](https://cdn-ak-scissors.b.st-hatena.com/image/square/2fa955094b38517fbfd2e729c247801991527135/height=288;version=1;width=512/https%3A%2F%2Fyossense.com%2Fwp-content%2Fuploads%2Frecommend-extension-672.jpg)
ubuntuでapt-get経由でChromeをインストールする - 動かざることバグの如し
https://www.google.co.jp/chrome/browser/からDebファイルを落としてきてコマンドでインストール、ってのが１つのインストール方法だけど、これだと依存パッケージを予め自分で入れなきゃいけなくて面倒。 Laboratory of Theoretical Medicinal Chemistry & Drug Design Department of Chemistry, Rikkyo (St. Paul's) University そこでGoogle公式のレポジトリを使う方法をめも sudo wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | sudo apt-key add - sudo sh -c 'echo "deb http://dl.google.com/linu
Ubuntu + Ruby + selenium-webdriver で Google Chrome をエミュレート - Qiita
インストール Google Chrome、chromedriver、Xvfbのインストール http://qiita.com/pandora2000/items/ca1654cc40d07c09b78d に従ってください Gems require "selenium-webdriver" require 'headless' headless = Headless.new headless.start driver = Selenium::WebDriver.for :chrome driver.navigate.to "http://google.com" element = driver.find_element(:name, 'q') element.send_keys "Hello WebDriver!" element.submit puts driver.title drive
機械学習でつかう画像を集める作業を少しラクにするツールをつくりました - #daiizメモ
昨日の記事 の冒頭で紹介した，機械学習用の画像データを収集する作業を手助けするツール『tfPhotoPalette』をChromeウェブストアで公開しました．TensorBoardに傚ってオレンジ系統の配色にしてみました． Chromebookでも使えます！！ 画像の表示 画面上部の長いボックスに画像のURLを入力して，その隣の「Load」ボタンを押すと画像が表示されます．一番左に大きく表示された画像がオリジナルなものです．画像の中に用意されている半透明な領域の大きさや位置を変更して，任意の箇所を切り抜くことができます．切り抜かれた領域は，オリジナル画像のすぐ右隣に表示されます． 画像の切り抜きと縮小 機械学習で学習／評価用に与える画像のサイズは，かなり縮小しておく必要があります．TensorFlowのチュートリアルで紹介されていた画像分類の話や，昨日の例では入力画像は32 x 32 px
米Google社員が語った、作業が捗るGoogle Chromeテクニック20個！ – 和洋風KAI
和洋風KAIは、Apple・水樹奈々・食べ歩きが三本柱のブログです。モットーは「楽しく」「便利で」「端的に」。 ⇒ アバウト ⇒ 免責事項 1．テキストのみコピペする方法。 リッチテキストエディタなどを使っていると、ブラウザからテキストをコピペした場合、画像なども付いてくる場合があります。 そんな時は「Control+Shift+V（Macだとcommand + shift + V）」を使ってペーストすると、テキストのみ貼り付けることが出来ます。 2．最後に閉じたタブを復活させる方法。 誤ってタブを閉じてしまった時は、「Control+Shift+T（Macだとcommand+shift+T）」とショートカットキーを叩くと復活させることが出来ます。 3. タブにマウスを置くと、ウェブページのタイトルの全てが読める。 Google Chromeはタブを開きすぎるとタブがとても小さくなってタイ
ブレークポイントを使ったJavaScriptデバッグを整理してみた【再入門】 - Qiita
はじめに プログラミングの上達において、デバッグスキルを上げることはとても重要で近道の1つだと考えています。 私自身、勉強し始めた頃に知っていれば（理解できていれば）とよく思います。 今回、JavaScriptデバッグについてChromeDevtoolsとブレークポイントを使った基本パターンを整理しました。 自身の復習かつ、あまり馴染みの無い方でも、以下おおよそ理解できるようになれば良いなぁ、というのが本稿の目的です。 どのようなものにブレークポイントが貼れるのか どういった時にブレークポイントが発動されるのか ブレークポイントが発動されると何ができるのか ご存知の方には特に目新しいことはないかと思いますが、何かのお役に立てば幸いです。 表示・動作はChrome 50.0.2661.87mで確認したものになります(2016-05-11) タブやパネルの位置は環境によって異なる可能性がありま
Mac OS XでCLIからapplication-modeなChromeを起動する。 - Bye Bye Moore
普通に起動したい方はこちらの記事を参照。 2015/12/13 もっとモダンな環境が出てました shuzo-kino.hateblo.jp 前準備 複数アカウントでChromeを動かす前準備です。 すでに実施してる方は必要ありません。 設定画面を開いてアカウント作成をクリック アイコンを選んで…… Chromeにログイン(任意)すればOKです これで、 /Users/#{USER_NAME}/Library/Application\ Support/Google/Chrome/ に「Profile 1」*1という項目が増えている筈です。 CLIから起動 起動中のChromeをプロセスごと閉じます。 その後、CLIで以下のようなコマンドを叩きます。 $ open "/Applications/Google Chrome.app" --args --profile-directory="Pro
既存のコードの理解が捗るChrome DevToolsの使い方 - kitak blog
jQuery系ライブラリによるDOM操作が中心のプロジェクトにがっつり機能を追加する機会があった。 そのJavaScriptのコードは他の人から引き継いだコードで、一応引き継ぎ時にディレクトリ構成、設計、実装方針について共有を受けたが、それでもいざ手を入れようとすると自分自身のコードの理解が進んでおらず「えーっと...」となってしまった。 上記以外にも、長年、多くの人が触れてきたJavaScriptのコードに機能を追加する、修正するのはなかなか難しいのではないか、と思う。最初は、ちょっとしたユーザビリティの向上のために書かれたスクリプトが、気がつけば多数のDOM操作、至る所で宣言される変数、どこから実行されるか分からない関数群で無秩序に膨れ上がり、頭を抱えることになる(そうならないようにするのがウェブフロントエンジニアがいるひとつの理由ですが…)。 これらのケースでは、まずは修正、あるいは
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Google Chrome の textarea を Emacs で編集する
https://qiita.com/JamLand/items/8f83c9bcfc5bc0a0698e
GitHubを快適にブラウジングするための3種の神器
Chromeでxpathやcssセレクタの実験したいとき - Qiita
