ChatGPTをもっと楽しく使えるようにするChrome拡張機能３つ | DevelopersIO
こんにちは、ヌヌです。 初めに 最近、ChatGPTが大きな話題になっています。私もChatGPTを使ってみたところ、その素晴らしさに感動しました。 ChatGPTを最大限に活用するためには、様々な拡張機能を活用することができます。このブログでは、私自身が利用してよかった、ChatGPTのためのChrome拡張機能を紹介します。 前提 ChatGPTにログインができる リンク：https://openai.com/blog/chatgpt Chrome ブラウザを使用 拡張機能 AIPRM for ChatGPT 概要 ChatGPTからSEO、SaaSなどのために整形かされた回答を受けたい場合役に立てる拡張機能です。 AIPRMから提供されているテンプレートを利用して質問を投げることができます。このテンプレートのためChatGPTが質問の内容をよく理解できるしより良い回答を返します。 使
Googleの時代は終わり…？明確なソースを明示してくれる対話型AI「Perplexity」がめちゃめちゃ便利そう
sangmin.eth @ChoimiraiSchool @gijigae これはすごい👏！世界初となる対話型検索エンジン、Perplexity Ask（ @perplexity_ai ）が登場です。答えの根拠として最新情報を参照＋対話形式で追加質問ができる。日本語にも対応してますのでぜひ！ pic.twitter.com/4bUQ12Yr22 2023-01-20 14:25:43 sangmin.eth @ChoimiraiSchool @gijigae . @perplexity_ai（👉perplexity.ai）をさらにバージョンアップさせたい全ての方にお勧めしたいのが、Perplexityを検索エンジンとして登録すること。Chromeだと、 ①設定 ②検索エンジン ③追加 の順で登録完了です。Chromeの検索窓からPerplexityを指定して検索できるので超便利✨。 t
HTML tableの実装がこれまでと変わる！Googleデベロッパーによる変更点の解説 -TablesNG
GoogleではCSSの新機能を導入するだけでなく、既存の機能を向上することにも取り組んでいます。その中の一つ「TablesNG」で、HTMLのtableの実装がこれまでと変わるのでその変更点を紹介します。 tableは古くからあり、その後さまざまなCSSの機能がブラウザに実装されました。当然、それらの新しい機能にtableは対応していません。それらに対応し、不整合を修正するのが今回の取り組みです。 TablesNG Resolves 72 Chromium Bugs for Better Interoperability by Una Kravets, Aleks Totic 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに TablesNGの取り組み 1. テーブルの行にposition: sticky 2. バック
ChromebookにLinuxを入れてまともなターミナルを得る - おかゆ++
Chromebookを買って持ち歩いたりしていると、 「ちょっとした開発なんかもこのマシンでできないかなー」 なんて思ったので、ターミナルの環境を整えてみました。 はじめに 今回の目的は、あくまでターミナルを得ることです。 なんでターミナルがほしいかというと、そっからメインPCなりクラウドなりにsshして作業したいからです。 最初はGoogle Chromeの拡張機能とかでsshできればそれで済ませるつもりでしたが、 日本語入力に難があり、結局Linuxを入れることになりました。 でも、LinuxにVSCode入れたり とかはせずに、あくまでsshで作業することを目的にしてます。 でないと、ただでさえChromebookはストレージ容量が少ないのに、Linux入れてRuby入れてNode.js入れて……なんてやってたら あっという間にストレージが枯渇してしまいます。 なので、あんまり余計な
Upgrade Chrome from Command Line on Ubuntu
gistfile1.txt @j�� V С@� V # Install # via http://askubuntu.com/questions/510056/how-to-install-google-chrome 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/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google-chrome.list' sudo apt-get update sudo apt-get install google-chrome-stable # Update sudo apt-g
Chrome リモートデスクトップ – V – Medium
ブラウザだけで利用できるリモートデスクトップ機能。使う側のマシンにセットアップするだけですぐに使えるようになる。 Chrome 拡張と、専用のアプリをいくつかインストールするだけ。とてもインストールは簡単。ほぼほぼマウスクリックするだけで終わり。 あとはマシンの名前とピンコードを登録さえすればピンコードがわかっていればアクセスできる。 この Chrome リモートデスクトップが今までのリモートデスクトップと大きく違うのはブラウザで実現していることだろう。 そしてこの Chrome リモートデスクトップはがっつり WebRTC を利用した仕組みだ。WebRTC P2P で実現している。 VP8 でリモート先のマシンの全画面を WebRTC MediaChannel を利用して P2P 経由で送っているリモート側のマウスやキーボード情報を WebRTC DataChannel を利用して P2
puppeteer/api.md at main · puppeteer/puppeteer
Puppeteer API Tip-Of-Tree Interactive Documentation: https://pptr.dev API Translations: 中文|Chinese Troubleshooting: troubleshooting.md Releases per Chromium version: Chromium 103.0.5059.0 - Puppeteer v14.2.0 Chromium 102.0.5002.0 - Puppeteer v14.0.0 Chromium 101.0.4950.0 - Puppeteer v13.6.0 Chromium 100.0.4889.0 - Puppeteer v13.5.0 Chromium 99.0.4844.16 - Puppeteer v13.2.0 Chromium 98.0.4758.0 - P
Headless Chrome + puppeteerを使ったHTML→PDF変換サーバーを作る puppeteer編 - GAミント至上主義
Headless Chromeを使ったHTML→PDF変換サーバー第3弾。 前回は下記。 ヘッドレスChrome + Node.js + express + DockerでPDF生成サーバーを作る - 仕事中の問題と解決メモ。 ヘッドレスChromeを使ったHTML→PDF変換サーバーを作る 改善編 - 仕事中の問題と解決メモ。 下記の記事をどっかで発見し、つい最近Chromeの開発チームが作っているクライアントPuppeteerがv1になったということでこっちに変更してみた。 www.infoq.com 以前のものはchrome-remote-interfaceを使っていた。 github.com さすが公式なのか、PDF生成に200ms程度かかっていたのが、Puppeteerに書き直したら100ms以下になった。 ドキュメントもさすがGoogle、しっかりしていてよい。 github.
ヘッドレスChrome + Node.js + express + DockerでPDF生成サーバーを作る - GAミント至上主義
URLを渡すとChromeがPDFを作って返してくれるサーバーを作るお話。 業務用ソフトではよくPDFの帳票が必要になる。今作っているサービスでも必要になった。 WEB系だとHTMLは生成しやすいので、それをPDFに変換するwkhtmltopdfなどのコマンドラインツールや、Ruby製だとThinreportsなどのソフトウェアを使う必要があった。 あと選択肢としては、Google SpreadSheetやDriveのAPIを組み合わせてもできなくはないけど、やってみるとAPIが遅いのでかなり待たされるし、細かい調整は望めない。 wkhtmltopdf オープンソース PDF 帳票ツール for Ruby, Rails | Thinreports でも、今年4月に公開されたChrome59以降は、コマンドラインでChromeを起動し、PDFを生成することもできるHeadless Chrom
rspec-rails 3.7の新機能！System Specを使ってみた - Qiita
はじめに 先日、RSpec 3.7がリリースされました。 参考: RSpec 3.7 has been released! 上記ブログの中で「今回のリリースはRailsのSystem Testの統合機能をいち早く使ってもらうためのリリースだ」と書いてあります。 実際、ブログの中で触れられている新機能は「System Spec」機能の追加だけです。 というわけで、この記事はrspec-rails 3.7で導入されたSystem Specの紹介と使い方の説明をしていきます。 実行環境 この記事は以下のバージョンを対象にして書かれています。 rspec-rails 3.7.1 Rails 5.1.4 Ruby 2.4.2 selenium-webdriver 3.6.0 Capybara 2.15.4 Chrome 62 ChromeDriver 2.33 サンプルコード この記事で使用したコー
Getting Started with Headless Chrome | Blog | Chrome for Developers
TL;DR Headless Chrome is shipping in Chrome 59. It's a way to run the Chrome browser in a headless environment. Essentially, running Chrome without chrome! It brings all modern web platform features provided by Chromium and the Blink rendering engine to the command line. Why is that useful? A headless browser is a great tool for automated testing and server environments where you don't need a visi
Headless Chromeでデザイン変更履歴を追える魚拓を作ってみた - pixiv inside
はじめに こんにちは、普段はPawooの開発を担当している新卒エンジニアのabcangです。 最近話題のHeadless Chromeを使って魚拓を作ってみましたので、その話をします。 結論から言うと、こういうものができました。 以下、詳しくお話していきます。 日々行われるデザイン変更をどう把握するか pixivには毎日新機能やUIの変更がデプロイされており、どんどんページが変わっていきます。 ある日、ディレクターから「デザインの変更履歴を追うための魚拓ツールがほしい」と相談されました。魚拓ツールがあると、なにか数値の変動があったときにデザインの崩れを確認したり、過去のデザインを振り返ったりするときに便利とのことです。 ちょうどそのタイミングでHeadless Chromeが利用できるGoogle Chrome 59がリリースされていたので、試すいい機会だと思い引き受けました。 Headl
Gulp+stylus+styledoccoでフロントのスタイルガイド生成 – T2
読了: 約 5 分 サービスを長期に渡って運用しているとデザインのパーツをどうするか、不要なものなのか否かわからなくなってきますよね。デザインも広がって来て、特殊な例が出て来たり、混在してくるとカオスな状態になります。 スタイルガイドを使う意味 wiki等でデザインを管理するのは、更新の手間やチームメンバーが変わった際などの役割分担・引き継ぎなどの手間が発生するなど無駄が多いので出来ればやりたくありませんね。 一々HTMLとCSSを切り出して、別のところに切り貼りするというのは長期に渡ると思ったよりもストレスになります。開発しながら管理したいというのが理想ですよね。スタイルガイドとして有名かつ歴史のあるstyledoccoの記事は多いのですが、Gulp+stylus+styledoccoという環境の記事がなかったので、今回は自分の環境をご紹介しておきます。完全なる俺得です。 まず最初に、諸
CSS には vw, vh, vmin, vmax という単位がある | DevelopersIO
例として以下の様な HTML 構造があったとします。 <body> <!-- 画像解像度: 100 x 100 (px)--> <img src="images/thumbnail.jpg" /> </body> img { display: inline-block; margin: auto; width: 10vw; } img の幅を 10vw と指定しています。基準となるビューポートの幅を vw で表すと 100vw となります。iPhone 5S のビューポート幅をピクセルで表すと 320px な訳ですが、10vw はその 1/10 ということで32px が img の幅となります。つまり 1vw は 1% と同じ長さになります。もちろんリキッドレイアウトにも対応した動きを持っています。 Demo - viewport lengthを開く（このサンプルはChromeブラウザでの
Googleの二段階認証にセキュリティキーを使う - Qiita
Googleの認証がいよいよ2段階認証としてセキュリティキーをサポートするようになった。 従来の2段階認証ではグーグル認証システムなどが生成する6桁のOpen Authenticationワンタイムパスワード(OATH OTP)を利用していたが、新たにFIDO Universal 2nd Factor(U2F)に準拠したハードウェアトークンを利用できるようになったのである。 早速試してみたので報告したい。 背景 U2Fは2段階認証にさらなる安全性と簡便性をもたらすことになる。 まずは簡便性について。OTPでは6桁の数字を制限時間以内に手で打ち込まねばならなかったが、U2FではUSBポートに挿さったトークンをタップするだけなので簡単である。ただしこれについてはOTPでも簡単にする方法はいくらでも考えられるので、必ずしもU2F特有とは言えないであろう。 重要なのはセキュリティである。OTPは確
HTML5でクロスプラットフォームなデスクトップアプリを開発できる「Electron」とは
Electron（旧Atom-Shell）とは、Web開発者がHTML5とNode.jsでMac、Windows、Linuxのデスクトップアプリを作れるクロスプラットフォーム実行環境です。Electronはオープンソースで無料で使える上に、MITライセンスであるため、商用利用も可能です。開発元はGitHub社です。 最近はJavaScript、HTML5の進化によって、多機能なWebアプリケーションが増えてきました。それに伴い、モバイルでは、WebViewやApache Cordovaなどを使ったハイブリッドアプリも注目されています。Electronはその流れの中から生まれた新しい実行環境です。 ElectronはChromiumブラウザを内蔵しているのが一番の特徴です。Chromiumブラウザは、Google製のChromeブラウザのオープンソース版にあたります。ウェブ開発者がChrom
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Grammarly: Free Writing Assistant
アルゴリズムビジュアル大事典
しょうもない“いかがでしたかブログ”を警告するGoogle Chrome拡張／最後まで読んでしまい、損した気分になるのを防止する「この拡張はいかがでしたか？」【レビュー】
DeNA Engineering - DeNAエンジニアのポータルサイト
