これ何なの？ もともと私が社内メンバー向けに書いていたドキュメントで、 UIパーツ毎のアクセシビリティを考慮したHTMLコーディングTips集です。 社内のドキュメント置き場に眠っていたものですが、知見として社外にも共有出来る内容だなと思ったのと、アクセシビリティをこれからやっていこう！という方の参考になればと思い共有させて頂きます。 ※そもそもアクセシビリティって何なの？という方は、ウェブアクセシビリティ基盤委員会のサイトを見てみてください🔍 目次 おすすめVSCode拡張機能 🕹ボタン 📷 画像 🔍 ナビゲーション 💻 フォーム おすすめVSCode拡張機能 axe Accessibility Linter をインストールしておくとimgタグのalt忘れなど警告が表示されるので、アクセシブルでない書き方を未然に防げるので便利です！ 🕹ボタン buttun タグを使いましょう
HIGHBALL PTE. LTD. は9月11日（月）、自分の好きなアバターと声でビデオ通話できる「Vme!」を正式リリースした。 本ツールは、基本無料で自分の好きなアバターと声でビデオ通話に参加できるGoogle Chromeの拡張機能で、対応ツールはDiscordとGoogle Meetとなっている。HIGHBALL PTE. LTD.によるWeb3×VTuberプロジェクト「Vhigh!」のひとつで、同プロジェクトではファンとクリエイターが一体となってVTuberを制作する「分散型」への変革を掲げている。 また、カメラの映像だけではなく声も変えられることが大きな特徴。公開されているサンプル映像では男性の声が「ずんだもん」のキュートな声に変化している様子が確認できる。なお、リアルタイムのボイスチェンジャーで遅延が気になる場合は、声のピッチのみを変更する機能を使用することで遅延を軽減し
始めに ddc.vim, ddu.vim の開発が一通り終了し、次に作成するプラグインについて考えていました。 バイナリ編集プラグイン ddx.vim の開発を進めることも考えていたのですが、dein.vim の開発から長い時間がたっており新たなプラグインマネージャーも出てきているので、そろそろ作り直すべきではないかと考えました。 プラグインマネージャーの機能がどんどん複雑化する昨今、プラグインマネージャーに必要な機能とは何か考えたときに、「拡張可能なプラグインマネージャーが求められている」と思ったのです。 そして今回作成したプラグインマネージャーは dpp.vim です。 dpp.vim は作成したばかりで完成度はまだ低く、dein.vim ユーザーが乗り換える機能のレベルや安定性にはなっていません。 しかし、その設計思想とインタフェースは十分固まったといえるので今回記事を書くことにしま
Webブラウザー「Chrome」の拡張機能「アマゾン注文履歴フィルタ」は、Amazonで購入した商品の領収書を、まとめて出力できるようになる“神”ツールです。通常のやり方では個々の注文ごとに出力や印刷が必要なのに対し、この拡張機能では注文日や品名などの属性で注文履歴を絞り込み、一発で出力できてしまいます。特に、確定申告には欠かせないこのツールの使い方を、今回は徹底紹介します。 多くの人が利用しているAmazon。購入した商品の領収書をまとめて出力できる確定申告の必須ツールの便利さを紹介しましょう 確定申告、無料で使えるChrome専用の拡張機能に注目 今年も確定申告のシーズンがやってきました。新型コロナウイルスの余波で〆切が3月16日から4月15日へと順延されたとはいえ、作業量そのものが減るわけではありません。「1カ月延びたから余裕余裕」と思っていても、気づいたら例年と同じように、直前にな
VS Codeには便利な機能拡張がたくさんありますが、その中から特にHTMLを書いたり、修正する時に役立つ機能拡張を紹介します。 VS Code Extensions for HTML by Chris Coyier 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに HTMLを書いたり、修正する時に役立つVS Codeの機能拡張 はじめに HTMLを書いたり、修正する時に役立つVS Codeの機能拡張を紹介します。すべてを気に入るとは思いませんが、自分が抱えていない問題を解決したり、必要以上の機能を備えているかもしれません。それでも構いません。ここで紹介するのは、私が実際に使用し、気に入っている機能拡張です。 VS Codeの機能拡張を紹介する前に、Emmetから始めたいと思います。これは機能拡張ではありませんが、VS
ウェブブラウザ・Firefoxを展開するMozillaが独自のVPNサービス「Mozilla VPN」の正式リリースを発表しました。このサービスはFirefoxのアドオンとしてベータテストが行われてきた「Firefox Private Network」がもとになっています。 Introducing Firefox Private Network VPN’s Official Product - the Mozilla VPN - Future Releases https://blog.mozilla.org/futurereleases/2020/06/18/introducing-firefox-private-network-vpns-official-product-the-mozilla-vpn/ Mozillaは2019年9月に、インターネットブラウジングをよりセキュアに楽しめ
React Inspector というChrome拡張機能を作りました。 Chrome上でインスペクタを起動し、クリックしたReactコンポーネントのソースコードをピンポイントでエディターで開きます。(現在はVSCodeのみ対応) 追記: ↑2022/09/12 オプションページから "Open in Editor URL" を設定できるようにし任意のエディターのURLスキーマで開くことができるようになりました...! Chrome web store: https://chrome.google.com/webstore/detail/react-inspector/gkkcgbepkkhfnnjolcaggogkjodmlpkh GitHub: https://github.com/hand-dot/react-inspector Reactのソースコードに直接ジャンプできるのでUIか
はじめに こんにちは、普段は機械学習エンジニアをしているfkubotaです。 今回は僕が普段行っているブックマーク管理術を紹介したいと思います。 ブラウザはchromeやvivaldiなどの chrome拡張 が使える環境を想定しています。 記事を読むモチベーションをあげるために僕がブックマークにアクセスしている様子をここで一度見てほしいです。 1. 以前書いたQiitaの記事 2. portfolio 3. wifiの速度測定 という順番で開いています。 めちゃ早いというのがわかっていただけるとウレシイです。 ブックマーク管理がしんどかった時 過去にブックマークの管理がとてもしんどかった時期がありました。 すぐにアクセスできるブックマークバーが便利でどんどん追加していくと量がすごくなってしまいました。 フォルダ管理を始めました。フォルダ管理で構造化すると今度はアクセスが遅くなりました。
平素よりはてなブックマークをご利用いただきありがとうございます。 2020年3月2日（月）12時ごろにリリースした「はてなブックマークiOSアプリ」の最新バージョン（v4.6）で、App Extension（他アプリからの連携機能）が利用できない不具合が発生しています。 現在原因を調査し、対応中です。申し訳ございませんが、対応までしばらくお待ちください。 追記（2020/3/4 12:59） 3月4日（水）12時ごろにリリースした最新バージョン（4.7）で、上記の不具合を修正しております。 原因はアプリケーションの不具合でした。ご迷惑をおかけして、大変申し訳ございませんでした。再発防止に努めてまいります。 お手数ですが、アプリストアから最新版へアップデートをお願いいたします。 ▽ - iOSアプリをアップデートする
ChatGPTプラグインの「Notable」を使って、データ分析コンペに挑戦してみたところ、想像以上の結果を出してくれたので共有します。 今回は人間は簡単な指示を出すだけで、ほとんど全てをChatGPTに任せる方針で行なっています。 こちらの記事のように上位6.5％に入りました！という華やかな結果にはなりませんでしたが、予想以上の結果にはなったのでぜひ最後まで読んでみてください！！ データサイエンティストがChatGPTを活用するための記事をまとめているので、こちらもぜひ参考にしてみてください。 ChatGPTプラグインとは ChatGPTプラグインは、ChatGPTをサードパーティのアプリケーションと連携させるツールです。 これは、GoogleスプレッドシートのアドオンやGoogle Chromeの拡張機能と同様に、公式だけでなく第三者の開発者が作成した機能をChatGPTに追加すること
「Chromeウェブストア」から拡張機能をインストールすると、ブラウジングを快適にしてくれる機能を簡単にChromeに導入可能ですが、中には便利なツールを装って不正な動作をする拡張機能も存在しており、過去には200個もの拡張機能が一斉に削除されたこともあります。今回新たに、合計500個以上のChrome拡張機能が不正に個人情報を入手していたことが、セキュリティ研究者らの調べにより発覚しました。 Security researchers partner with Chrome to take down browser extension fraud network affecting millions of users. | Duo Security https://duo.com/labs/research/crxcavator-malvertising-2020 500 Chrome E
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
この記事について 先日、@catnoseさんがカメラ映像の代わりに絵文字(Emoji)を配信するためのサービスを公開されました。凄く完成度が高くて良いサービスだと思ったので、さっそく使ってみたのですが、仮想カメラとして使用するためには OBS Studio が必要でした。[1] サービスを使うには全然申し分無いのですが、「 もっと簡単にできたらなぁ～ 」と思ってしまうのが私の悪い所で、すぐさまブラウザのみでどうにかできないかと調べてみると、色々な制約はありますが、Chrome 拡張を使うことで OBS Studio を使わずとも仮想カメラを使用できることが分かりました。 実装も簡単にできるので、 今回は Google Meet で、画面キャプチャを仮想カメラとして表示する Chrome 拡張を作って行こうと思います 💪 今回作るモノについて 今回この記事で作る Chrome 拡張は、上記
人工知能（AI）の開発に重要な役割を果たすのが「データ」だ。注目のプログラミング言語「Python」と開発環境「Visual Studio Code（VSCode）」を使ってデータの加工や分析を行う方法を解説する。 【応用編】コードを整理する データ分析の作業でJupyterを使うと、一部のコードを何度も修正して試したり、途中にコードを追加して実行したりできるので、とても便利です。一方、あとで改めて実行し直そうとしたときに、無駄なコードが残ったままで、実行に時間がかかってしまうこともあります。 この問題を助けてくれる、VSCodeのJupyter用拡張機能である「Gather」を紹介します。 拡張機能「Gather」 Gatherは、ボタン1つでノートブックのセルの実行結果を解析します。そして、その実行結果を出すのに必要なコードだけを集めて新しいノートブックにコピーします。つまり、散らかっ
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに はじめまして、@nkato_です！ 普段は機械学習寄りのソフトウェアエンジニアとして、PythonでMLパイプラインを記述したりGoでバックエンド処理を記述しています。 便利アプリや各種ツールの拡張機能が好きで、これまでにも様々な機能を取り入れて試してきました。 自社エンジニア向けにそういったツールを共有したいと思ったのですが、どうせなら公開情報としてQiitaに投稿しようと思い立ち、まとめてみることにしました。 量は多いですが、どれもおすすめです！ アプリ Alfred ショートカットキーで検索窓を開いて、アプリ名で検索して
なか子こんにちは！ 起業支援をしている なか子（⇒プロフィール）です^^ 大学生の頃バイトが見つからず困ったあげく 起業して 月収50万達成しました。 最速で物販だけで食べる情報を無料公開しています！ 物販に取り組んでいると、 商品のリサーチや仕入れに一番時間を使いますよね。 物販では仕入れて倉庫に納品するだけなので リサーチの効率化が一番大事です。 今回は、私がAmazon物販で使っているリサーチツール、 chrome拡張機能（すべて無料）をご紹介します。 ページ速度が遅くならない、一番シンプルな機能だけをご紹介します。 「chrome拡張機能、どれがいいのか迷う…」 「重くなるから、あんまり入れたくない…」 と、思った方も必見です＾＾ ページ速度を重視した結果 多機能な拡張機能は、ほとんど使っていません。 色んな機能を知りたい！という場合は、 別の記事を参照ください。 あわせて読みたい
みなさん、こんにちは。サイオステクノロジー武井です。今回は、導入がカンタンで開発効率爆上げなVisual Studio Code拡張機能をご紹介したいと思います。 ※ 本記事は技術評論社出版の「Software Design」2022年10月号(詳細はこちら)に私が寄稿した「エディタこそ開発の要 ［最大活用］Visual Studio Code」の記事をベースとしております。是非、Software Designの方も合わせてご覧ください！！ はじめに Visual Studio Code はインストール初期でも機能は豊富であり、かつインタフェースもシンプル、そして拡張機能により利用者の環境に合わせて自由にカスタマイズできることが、大きな魅力となっております。 一方で、その機能の豊富さにより、どの機能を使ってよいのかと迷われる方もいると思います。 そこで本記事では、「導入がカンタンで開発効率
ウェブ記事のテキストに直リンクが張れるChrome拡張機能が完全に神！2020.06.22 13:0031,751 Victoria Song - Gizmodo US ［原文］ （ そうこ ） 考えた人、神寄りの人。 え…、もしかしたら、人寄りの神なの？ とんでもなく便利な拡張機能がChromeにやってきました。｢Link to Text Fragment ｣は、ウェブ記事のテキストに直リンクできる機能。記事のページへのリンクじゃないですよ、記事中の特定箇所をハイライトし、そこに直接飛ばせるURLを作れる機能なんです。しかも、使い方がめちゃくちゃ簡単。 1：リンクをつくる拡張機能をインストール後、リンクを張りたいテキストをハイライトして右クリック。オプションに表示されるLink to Text Fragmentのアイコンと｢Copy Link to Selected Text｣をクリック
Version 1.93 is now available! Read about the new features and fixes from August. vscode.dev(!) October 20, 2021 by Chris Dias, @chrisdias Back in 2019, when the .dev top-level domain opened, we picked up vscode.dev and quickly parked it, pointing at our website code.visualstudio.com (or, if you are from the Boston area like me, we "pahked it"). Like a lot of people who buy a .dev domain, we had n
Microsoft製テキストエディタ「Visual Studio Code(VSCode)」は拡張機能を導入することで機能を追加したり外観をカスタムしたりできます。セキュリティ研究者らが「人気拡張機能にコードを挿入した偽拡張機能」を公開した結果、短期間で大企業やセキュリティ企業を含む多くのユーザーのマシンにインストールされたとのこと。セキュリティ研究者らはVisual Studio Codeの拡張機能システムの欠陥を指摘し、警鐘を鳴らしています。 1/6 | How We Hacked Multi-Billion Dollar Companies in 30 Minutes Using a Fake VSCode Extension | by Amit Assaraf | May, 2024 | Medium https://medium.com/@amitassaraf/the-stor
非アクティブ状態のタブを一時停止してくれる拡張機能「The Great Suspender」が、新たな所有者のもとで不審な更新が行われたということが指摘されており、ソフトウェア開発者のデビッド・フォスター氏が対策を示しています。 I no longer trust The Great Suspender | DaFoster https://dafoster.net/articles/2021/01/20/i-no-longer-trust-the-great-suspender/ I no longer trust The Great Suspender | Hacker News https://news.ycombinator.com/item?id=25846504 [Open Source Development] The Great Suspender Saga, or, “I
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? よくある運用 マスタデータの管理方法として多いのは、Excelなどの表計算ソフトを使ってデータを作成し、それをGitHubで管理しつつ、実際にDBなどへデプロイさせる方法かと思われます。 そしてこれを実現するにあたって、出来るだけエンジニアの負担を減らせるよう、データ作成者にGitクライアントの使い方やデプロイ方法をレクチャーします、が... マスタデータ管理ツールの誕生 ただ、そこで気になるのは、結果的にデータ作成者の負担が増えてしまうことです。 大体の場合、表計算ソフト以外のツールも触ることになり、もう少し手軽にできないかと考えてい
ウェブサービスへの新規登録やオンラインショッピングの際にメールアドレスを入力すると、メールアドレスの流出や悪用などの被害を受ける可能性があります。この問題に対応するべく公開されたFirefoxの開発元・Mozillaのメール転送用の捨てメールアドレス生成サービス「Firefox Relay」が、2022年3月10日(木)に「転送可能容量の増加」「Google Chrome向け拡張機能の提供」「メールマガジンのフィルタリング機能」などの新機能に対応しました。 Latest Firefox Relay includes bigger attachment size and filters for promotional emails https://blog.mozilla.org/en/mozilla/latest-firefox-relay-includes-bigger-attachme
押し寄せるEメールの洪水は、いつまでもとどまることがありません。 テレワークで時間ができたとしても、Gmailアカウントを整理して未読ゼロを達成するなんて幻想のように感じられる人が多いのではないでしょうか。 でも、ご安心を。サードパーティ製のブラウザ拡張機能があなたを助けてくれますよ。 しかも、ほぼ無料なのが嬉しいですね。 複数のカラム でメールを管理できる『Sortd』※大きな指マークは含まれません。Image: SortdGmailにEメールは、受信ボックスに蓄積されていきます。しかも、そのスパルタなインターフェースのせいで、受信トレイの整理は非常にとっつきにくいものとなっています。 そんなときは、Sortdの出番です。受信トレイをドラッグアンドドロップ方式のワークスペースに変え、未読メッセージが左側に並び、その右にいくつかのカラムが並びます。これらのカラムは、自由にカスタマイズが可能
ソースコードの複雑さ、不具合のリスクを定量化したコードメトリクス1というものがあります。 コードメトリクスは計算方法によっていくつか種類があり、メジャーなものだと以下のものがあります。 Cyclomatic Complexity（循環的複雑度） Cognitive Complexity（認知的複雑度） Maintainability Index（保守容易性指数） Lines of Code（コードの行数） これらのコードメトリクスを計算し、CodeLensに表示するVisual Studio拡張機能2を作成しました。 tackme31/howmessy: How messy is your code? 以下のようにコードメトリクスをもとにコードが複雑かどうかを判定し、CodeLensに表示してくれます（デフォルトではCognitive Complexityをもとに計算します）。 今のところ
ChatGPTユーザーであればぜひ入れておきたい 「Superpower ChatGPT」 今、大ブレイク中のChatGPTだが、UIがシンプルで使いやすいものの、いろいろと使い倒すには機能が足りないと感じることも多い。そんなChatGPTヘビーユーザーにお勧めなのが、ChatGPTを使いやすくしてくれる拡張機能だ。 通常、ブラウザの拡張機能と言うと、ひとつの機能に絞ったものが多いのだが、今回紹介する「Superpower ChatGPT」は多彩な機能を搭載し、ChatGPTを別物にしてくれるのが特徴。ChatGPTユーザーであればぜひ入れておきたい。 まずは、Chromeウェブストアから「Superpower ChatGPT」（https://chrome.google.com/webstore/detail/superpower-chatgpt/amhmeenmapldpjdedeka
Notionでの編集でちょくちょくとストレスを感じるシーンがありました。何か対策が取れないものかと設定を確認したものの、特に変更はできず。そこで拡張をストアで検索してみたところ、まさにそのものといった拡張がありました。 上記の様に色々と機能はあるのですが、とくにイチオシな機能を紹介します。 OUTLINEの表示 Headerを使っている場合、右上にToCが表示されるようになります。勿論単なる表示ではなく、該当する目次をクリックすることでジャンプします。 スペースでスラッシュコマンドをキャンセル スラッシュを単体で入力したい時にはとても役立ちます。 オフ オン うっかりを防止するためにはとても有効です。 テーブル内コンテンツをプレビューなしで開く 標準では「ページとして開く」のステップをはさみますが、これを挟まなくなります。 ページとして開いて編集したい場合は1ステップ挟まなくなるためとても
こんにちは、Mr.Moです。 下記の記事を見てVS CodeのPython拡張でJupyter Notebookが使えることを知り便利そうだなーとしばらく直感的に使っていましたが、そろそろちゃんと使いこなしたいので用意されているデータサイエンスチュートリアルを参考にしならが使い方をマスターしていきたいと思います！ Visual Studio CodeでJupyter Notebookを動かしてみた データサイエンスチュートリアルとは VS Codeの公式ページあるチュートリアルです。March 2020 (version 1.44)のアップデートで公開されたようですね。 https://code.visualstudio.com/docs/python/data-science-tutorial チュートリアルを参考にしながら使い方を確認していく さっそくチュートリアルを進めていきます。あ
![[VS Code Python拡張] データサイエンスチュートリアルをやりながらVS CodeでのJupyter Notebookの使い方をマスターする | DevelopersIO](https://cdn-ak-scissors.b.st-hatena.com/image/square/b3a3cd126b780dcd4cdffcaa7d018424e8c697cb/height=288;version=1;width=512/https%3A%2F%2Ffanyv88.com%3A443%2Fhttps%2Fdevio2023-media.developers.io%2Fwp-content%2Fuploads%2F2019%2F06%2Fvscode-2019-eyecatch-1200x630.png)
Language Reactor: your language learning toolbox. Discover, understand, and learn from native materials, including Netflix and YouTube. (Formerly called 'Language Learning with Netflix'.)
かわいくないワ...👁👄👁 これではテンション上がりません。コーディングに置いてモチベーションは最も大事な栄養素です。 テーマを変更してモチベを上げていきます。 テーマを変更 illusion お好みのテーマをダウンロードしてテーマを有効にします。 ...いいんじゃない？👁👄👁 まだそこまでかわいくありません。 コーディングにおいて、インデントは最も大事な要素です。そんなに重要なものが光っていないのは怠慢という言葉を禁じ得ません。インデントを光らせていきます。 indent-rainbow 拡張機能を有効にしたらこうなっているはずです。 トーンが暗いわネ...👁👄👁 setting.jsonでハイライトの色を変えていきます。 "indentRainbow.colors": [ "rgba(128, 64, 64, 0.5)", // 1インデント目の色 "rgba(128
こんにちは、ちょっと前に 3 ヶ月半の育児休業から復帰したくらさわです。 なんと今日で生まれてちょうど半年です！早い！！ こちらの記事は Gunosy Advent Calendar 2021 の 16 日目の記事です。 昨日の記事は yamaYu さんの『EKS Managed Node Group でカーネルパラメータを変更する 』でした。 今回は Visual Studio Code (以下 VS Code) の拡張機能を開発した話 + α を書きたいと思います。 タイトルが全てです。 はじめに 作成した拡張機能 拡張機能作成の流れ セットアップ Yeoman と VS Code Extension Generator をインストール Yeoman を実行 プロジェクトを開く コード contributes.commands activationEvents activate 関数
Amazon Prime Videoの映画、ドラマ、アニメで楽しく語学学習。もちろん無料です。
AIがコードを補完する。SublimeでもVisualStudio Codeでも 2021.06.12 Updated by Ryo Shimizu on June 12, 2021, 09:20 am JST AIがコード補完してくれる便利なサービスでtabnineというものがある。 これは内部でGPT-2モデルを使い、100万人の開発者による典型的なコードを学習させたAIが、コード補完をするというツールである。 プログラミング言語も、JavaScriptやJava、Python、Go、Rustなど幅広い言語に対応しており、使用できるエディタもプログラマーに人気のSublimeTextやVisualStudio Code、Emacs、Atom、Vimなど一通り網羅している。 無料でも使えるので早速試してみた。 この手のAIモノはまずは試さないことには何もわからない。 単純なFizzBaz
こんにちは、うみのです。 今回はVSCodeにて、よく使っている拡張機能や開発時のテンションを向上させる拡張機能を紹介したいと思います。 VSCode自体はここからダウンロードできます。 indent-rainbow indent-rainbowをインストールすると、ソースコードのインデントに色がついて見やすくなります。 ただインストールしただけでは色が薄いので、設定ファイルから自分好みの色に編集します。 最終的には下記のような色合いのインデントが作成できました。 インデントの色編集の詳しい説明は「虹色のVSCodeでテンション上げて開発する！」で書かれています。
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
