ブラウザ上でデバッグするときに使えるテクニック
ウェブ上でJavaScriptを実行してバグが発生した場合、ブラウザに内蔵されている開発者ツールを使ってデバッグすることがよくあります。そうしたブラウザでのデバッグにおいて役立つテクニックをNetflixでフロントエンドの開発に携わっているアラン・ノルバウアーさんがまとめています。 67 Weird Debugging Tricks Your Browser Doesn't Want You to Know | Alan Norbauer https://alan.norbauer.com/articles/browser-debugging-tricks ◆高度な条件付きブレークポイント 開発者ツールの「ソース」タブにはデバッガーが用意されており、JavaScriptの任意の行にブレークポイントを設定することで実行を一時停止して変数やコールスタックの中身を確認できます。ブレークポイントを
ChatGPTで英会話レッスンをする｜柴田 和祈
ChatGPTを使って英会話の練習ができたら良いなと思って色々と試してみました。 Chrome拡張を用いる英会話に必要なのは音声による入出力です。 「Voice Control for ChatGPT」というChrome拡張を使うことでそれが可能になります。 この拡張をインストールした状態で、ChromeでChatGPTを開くと次のような画面になります。 画面下のマイクボタンを押してからPCに向かって喋ると、音声による入力ができます。 マイクボタンの隣にあるセレクトボックスから入力の言語が指定できるので、英語に設定しましょう。 ChatGPT側からの返信も音声で読み上げられます。 設定画面から読み上げ速度の調整もできます。 これだけで、ChatGPTとの英会話が成立します。 注意点としては、こちらからの音声入力ではピリオド（.）や疑問符（?）を入れられないので、複数センテンスは入れられませ
Chromeでタブをたくさん開きがちな人に届け！作業効率を上げまくる拡張機能4選 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは！ 広報室のたびちん（@takiyoro）です〜。 今回はこれがないと暮らしていけない！ とまでなったChrome拡張機能を４つ厳選してお伝えします。 ▼以前ご紹介した、タスク管理に便利な拡張機能＋アプリの使い方はこちら 開けているタブをリスト化！ 「GetTabInfo」 ダウンロードURL あらゆるオフィスワーカーに知ってほしい！ タブで出したページのURLやタイトルなどの情報がリストになって出てきます。表示方法はテンプレート化が可能です。URLだけのリスト、タイトルとURLで間にタブを入れる、タイトルを＜＞などで囲むなど、柔軟に設定できます。 こういう感じで、同じウインドウ内で開いている複数タブをリスト化できます。 「ちょっとこの業界のURL調べてリスト化しといて」なんて命が下ったときに何度か救われた拡張機能です。複数タブを開けておき、これでリストにするだけなので、個人的な
海外で７年働いて、今でもやっぱりメチャ使っている英語の補助ツール３選｜__shinji__
アプリの方はまだ日本語版のみですが少しずつ改善を続けています。このnoteの中でオススメの英語ツールについて記事を書くと宣言していたものの、なかなか時間がとれず遅くなってしまいすみません。数年前の記事の書き直しではありますが、誤っていた部分を修正し、情報を最新版にして改めて書いてみます。 というわけで、今回は英語の補助ツールの紹介です。知っている人からすれば定番中の定番ではありますが、だからこそ英語を勉強中の方でも設定してしまえばきっと長い間使うことになると思うので、まだ設定していない方はぜひこの機会にやってみてください。パソコンでのGoogle Chromeを使った設定になります。 爆速ポップアップ辞書 英文のドキュメントを読んでいるときに意味を知らない単語が出た場合、いちいち翻訳サイトに飛んだり、辞書を開いたりするのは面倒ですよね。そんなときに使えるのがポップアップ辞書になります。ポッ
業務中に堂々Twitterしたい！→TwitterをSlack風に表示できるChrome拡張を開発する天才的サボリ - ねとらぼ
「業務中も堂々とTwitterをしたい」――そんな欲望から、Twitterをビジネス向けチャット「Slack」風に表示するChrome拡張を開発してしまう会社員が現れました。サボるためなら苦労をいとわない、その心意気がステキ。 色調といいレイアウトといい、見た目はだいぶSlack。でも内容はTwitterのタイムライン 作者は面白法人カヤック在籍のデザイナー、ちゃんちー（@chihirooo0707）さん。デモ動画では、Twitterの公式クライアントの画面を、瞬時にSlack風に切り替えています。画像などの表示を簡略化しつつ、ツイートの入力枠は下方にと、インターフェースはすっかりチャットツール風に。それでいて、検索やメッセージなど、Twitterの操作はひと通りできるようになっています。 タイムラインが瞬時にSlack風に。画像表示が省略されて、画面あたりの情報量が増えるメリットも 「天
もう縦スクロールって疲れません？進化する私たちの指と視野｜ワカモノのトリセツ
こんにちは！現役女子大生二人組による若者の今を伝えるメディア「ワカモノのトリセツ」です。 春休み満喫中の私たちは、自然と携帯を見る時間が増えました。 そんな時に、 「あれ？最近縦スクロールするのがもう嫌になってきたぞ？！」と思うようになったことに気づいたのをきっかけに、今回は縦スクロールについて私たちの最近の価値観をお話しします。 ■ 縦スクロールで満足できていた時代縦スクロールコンテンツで代表的なものはこちら。 ・Instagramのフィード投稿 ・コスメやファッション、旅行系のキュレーションメディア ・Twitterのタイムライン ・クックパッド ・Safari、Chromeなどのウェブブラウザたち 昨年の夏頃までは、まだ縦スクロールへのストレスが薄かった気がします。20件、30件とインスタのフィード投稿を見るのが全く辛いと感じませんでした。コスメやファッション、旅行系のキュレーション
新卒が先輩から教わった仕事効率化のためのMac設定やツールを紹介！！ - Yukihy Life
社会人になり、1ヶ月半ほどたちました。その間にいろんな先輩からPCの設定やツールなどを教えていただき、仕事効率化を進めてきたので紹介したいと思います！ GoogleクロームのコマンドQを解除 設定方法 Spotlightの内容を絞る 設定方法 マウスの速度は最速に 設定方法 キーボード入力補助 設定方法 通常業務で使う系 記号系 Excelやスプレッドシートで使う系 ファイル名の最初に日付を入れる スニペットツールを使ったフォーマット登録 設定からショートカットを追加 設定方法 BetterTouchToolを使ってショートカットを追加 まとめ オススメ書籍 注：今回の記事はMacを使っていることをメインに書いています。Windowsでも一部使えるところはあるかと思いますが、使えないところは代替ツールなどを探していただければと思います。 GoogleクロームのコマンドQを解除 個人的に一番
ヘッドレス Chrome スタートガイド | Blog | Chrome for Developers
要約 ヘッドレス Chrome は Chrome 59 でリリースされます。Chrome ブラウザをヘッドレス環境で実行する方法です。基本的には Chrome を使わずに Chrome を実行しますこれにより、Chromium と Blink レンダリング エンジンが提供する最新のウェブ プラットフォーム機能がすべてコマンドラインに組み込まれます。 なぜこれが有用なのでしょうか ヘッドレス ブラウザは、UI シェルを表示する必要のない自動テストやサーバー環境に最適なツールです。たとえば、実際のウェブページに対してテストを実行したり、そのウェブページを PDF 化したりできます。また、ブラウザが URL をどのようにレンダリングするかを検査することもできます。 Headless（CLI）の起動 ヘッドレス モードを開始する最も簡単な方法は、コマンドラインから Chrome バイナリを開くこと
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
