Getting Started with Front End Testing — JavaScript January
This article is brought to you by Amy Kapernick. Amy is a Microsoft MVP, Twilio Champion, speaker, and community organizer. We all know that testing is important, your project can't be run unless all your unit and integration tests are written (and pass), but we often forget about testing the front end. There are so many different tests we need to be running on the front end - accessibility testin
Biome では、現在約 150 個程度の JavaScript・TypeScript に関する lint ルールを実装しています。 これらのルール多くは既存の ESLint 関連で実装されているルールと同じものになっているのですが、ルールの名前が異なることもあり、その対応関係がわかりにくくなっています。 そこでこの記事では、フロントエンド開発をする場合によく設定していそうな次の lint ルールについて、Biome で実装されているかどうかの対応表を紹介します。 eslint (eslint:recommended) typescript-eslint (plugin:@typescript-eslint/recommended) eslint-plugin-jsx-a11y (plugin:jsx-a11y/recommended) eslint-plugin-react (plugi
2020年、サイバーエージェントのアクセシビリティを振り返る | CyberAgent Developers Blog
こんにちは、メディア事業本部の @masuP9 です。今年はこのアクセシビリティを振り返る、やらない気でいたのですが、アクセシビリティやっていき企業仲間が振り返っているのを見てやはりやらねばなるまいと思い直し今年も振り返りたいと思います。 昨年、2019年のサイバーエージェントの振り返り 2020年、freeeのアクセシビリティを振り返る 2020年、サイボウズのアクセシビリティを振り返る アクセシビリティを気にし出したきっかけと、2020年の振り返り（トレタ） 新規サービスのアクセシビリティ水準は高く WINTICKET 昨年、リリースした競輪・オートレースネット投票サービス WINTICKETは開発当初から高い品質を目標に開発されウェブアクセシビリティについても一定の品質に到達することができました。（参考: ウェブアクセシビリティについて） そのおかげか高いアクセシビリティを必要として
皆さま、はじめまして。私は、20年度新卒で入社したアクセシビリティ・エンジニアの大塚と申します。本Blogに登場するのは初めてですので、まずは簡単に自己紹介をさせてください。 私は生まれつき視覚障害があり全盲です。私を含め全盲のユーザーの多くは、画面上のテキスト情報を音声で読み上げるスクリーンリーダーとキーボードを使用してPCを利用しています。今書いているこの文章も、入力している文字や、漢字の変換が正しく行われているかなどの確認をスクリーンリーダーで行いながら作成しています。 私は中学に入ったころに本格的にPCを使い始めたのですが、スクリーンリーダーを利用し、Web上の様々な情報に単独でアクセスできることに感動したことをよく覚えています。そのことをきっかけに、視覚障害者を含め多様なユーザーがWebをより利用しやすい環境を作ることに貢献したい気持ちが強くなりました。そして、Webアクセシビリ
Xboxがサイコロの各面を自由にカスタマイズしたりサイコロ同士をつなげたりして自分だけのコントローラーを作り出せるモジュール式コントローラー「Proteusコントローラー」を発表
Xboxが各面を自由にカスタマイズできるサイコロ状のモジュールを複数つないでコントローラーとして使うことができるという、従来のコントローラーとは一線を画する見た目とカスタマイズ性のモジュール式コントローラー「Proteusコントローラー」を発表しました。 Proteus Controller Kit VIP Price https://www.byowave.com/product/proteus-controller-kit-vip We are super excited to be featured in @XboxWire 's article on the upcoming accessibility updates for Xbox! Thanks to the Xbox team for supporting us on this journey to making game
こんにちは、最近バチェラーseason1を見始めたら止まらなくなり気づいたら土日をフルに使って全話見終えていました、フロントエンドエンジニアの荒田です。 スペースマーケットではスタイリングされたコンポーネントを確認するためにStorybookを導入しています。 (Storybookについては以前書いた記事をご参照ください) 今回はそのStorybookの便利なaddon機能について紹介したいと思います。 addonの基本的な導入方法 まず、導入したいaddon機能をインストールします。 （例） npm i -D @storybook/addon-viewport .storybook/addons.jsファイルを作成し、導入したいaddonを読み込みます。 import '@storybook/addon-viewport/register'; どのaddonも導入方法は基本的に同じになり
こんにちは。プロダクトエンジニアのatsushimと言います。 社内ではプロダクトを開発する傍ら、アクセシビリティを高めるための改善や仕組みづくりを進めています。 この記事ではSmartHR独自のESLintのルールを作っている話をしたいと思います。 SmartHRでは アクセシビリティ（以降a11y） を考慮したアプリの開発・改善を行っており、過去記事でその様子をご確認いただけます。 SmartHR Tech Blog: アクセシビリティ の検索結果 ただ普段の開発中、a11yを意識しつつ開発を行うことは、エンジニアにかなりの負荷がかかります。 フロントエンドの経験が少なく基本的なマークアップの知識が足りていない アクセシビリティを意識してね！といわれても何をすればいいのかわからない そのため、SmartHRでは独自のESLint ルールを作成し、CIに組み込むことでa11yを担保、改善
コンテンツデザインから始めるWebアクセシビリティ
理解という名のアクセシビリティ Web アクセシビリティの課題には大きく分けて 2 種類あります。ひとつは、色、形状、動きといった視覚に関わること。そしてもうひとつは、マークアップをはじめとしたマシンリーダブルに関わることです。マークアップが正しく記述されていて、視覚的にも分かりやすいことは Web アクセシビリティの確保において必須ですが、これらとは別に『第三の課題』のようなものがあると考えています。 それは利用者が理解できるコンテンツを制作・配信するという課題です。正しくマークアップされていたとしても、そのマークアップされたコンテンツが人にとって理解しにくいものであればどうなるでしょう。利用者はタスクを達成することができないでしょうし、情報を求めて彷徨うことになるかもしれません。 単に情報へアクセスできるだけでなく、意味のある情報へアクセスできるようにする必要があります。利用者の目的が
【書き起こし】Merpay Tech Talk〜Monorepo開発におけるツール選定〜 #merpay_techtalk | メルカリエンジニアリング
【書き起こし】Merpay Tech Talk〜Monorepo開発におけるツール選定〜 #merpay_techtalk 2022年4月21日に、メルペイ・メルコインのエンジニアたちによる「Merpay Tech Talk〜Monorepo開発におけるツール選定〜」を開催しました。 Monorepo開発を進めるにあたって、メルコインではNx、メルペイではTurborepoを利用しています。Monorepo開発を導入した背景やツール選定の理由、実際に導入した所感などをご紹介します。 アーカイブはこちら！ https://www.youtube.com/watch?v=I0Wxr1JCvhs 登壇者紹介 @tokuda109 / 株式会社メルペイ Frontend Engineer 2019年10月に入社し、クーポン機能のフロントエンド開発を担当後、パフォーマンスやテスト等のフロントエンドの
VimでESLintをグローバルインストールせずに、Syntastic+ESLintでES2015の構文チェックをする - dackdive's blog
（2016/10/24追記） しばらく Syntastic を使ってましたが、Neomake というより快適なプラグインが見つかったので今はそちらを使ってます。 （追記ここまで） はじめに vim で ES2015 を書いていると、構文チェックもコーディングと並行して行いたいと感じるようになります。 Syntastic はそのための vim のプラグインで、JavaScript に限らず様々な言語の構文チェックを行うことが可能です。 参考：以前 Python 用に設定した時の記事 今回は JavaScript の代表的な linter (syntax checker) である ESLint を使い、vim で ES2015 を書くときの構文チェック環境を構築してみます。 よく見る設定 「vim es6 syntastic」とかでググってよく見るのは以下のように、ESLint をグローバルイ
アクセシビリティを担保するプロセス作り この記事は Web Accessibility Advent Calendar 2016 - Adventar の 12 日目の記事です。 UI 実装の再考と a11y - Frontrend Vol.8 LT でも述べましたが、Accessibility is a Process, Not a Project ということでアクセシビリティ対応するプロジェクトではなく、アクセシビリティを担保するプロセスを作りましょうということで、チェックツールをいくつか並べて俯瞰してみます。対象読者は自分と同じようなクライアントサイドの Web アプリケーション屋さんということにしておきます。 ちなみにアクセシビリティ評価ツールについては 3 日目のアクセシビリティ方針、報告書、試験支援ツールa11ycのご紹介 (Web Accessibility Advent C
公開日2018-12-24タグAdvent CalendaraccessibilityWeb アクセシビリティ Advent Calendarの 24 日目。 僕にとってはウェブはだいたい HTML で、仕事もウェブ制作なので、そこ視点の話になります。あと「Web」でも「WEB」でもなく「ウェブ」派なのでそう書いてます。 これの下書きはひと月以上書いては消し書いては消し、足したり引いたりし続けました。触ってる間はずっとしんどかったです。かなりポエムになったので、あえて口語調にしてみました。喋ってるのを文字起こししたものだと思うとちょっと読みやすいかもしれません。 ちなみにこのブログの記念すべき 100 記事目です。 僕とウェブ制作 受託のウェブ制作会社でコーディングをしていると「自分がやらなかったら後ろに誰もいないやんけ」って思うことが多いんですよね。 受託のなかでも自分は、デザインが完成
Firefox 65: WebP support, Flexbox Inspector, new tooling & platform updates – Mozilla Hacks - the Web developer blog
Firefox 65: WebP support, Flexbox Inspector, new tooling & platform updates Well now, there’s no better way to usher out the first month of the year than with a great new Firefox release. It’s winter for many of us, but that means more at-home time to install Firefox version 65, and check out some of the great new browser and web platform features we’ve included within. Unless you’d rather be donn
この記事は BASE Advent Calendar 2021 の6日目の記事です。 フロントエンドエンジニアの @rry です。 今年の4月に BASE にジョインしてから、アクセシビリティに関する取り組みを少しずつ行ってきました。 BASE ではこれまでアクセシビリティに関する取り組みは局所的にしか行われておらず、また私自身もアクセシビリティについて知見が全くない状態でした。このような状態からアクセシビリティやっていきを具体的にどのようにして進めているかについてご紹介したいと思います。 アクセシビリティとは？何故アクセシビリティに取り組むのか？ アクセシビリティとは | ウェブアクセシビリティ基盤委員会（WAIC） 一般にアクセシビリティとは、アクセスのしやすさを意味します。転じて、製品やサービスの利用しやすさという意味でも使われます。 似た意味をもつ言葉にユーザビリティがありますが、
Frontrend Vol.10 - 夏の終わりに納涼パフォーマンス話 に行ってきた - dackdive's blog
行ってきました。 絶対ブログ書く人類枠だったのでブログ書きます。 ハッシュタグは #frontrend。また動画が FRESH! で観られます。 https://freshlive.tv/tech-conference/151511 FRESH! クライアントサイドパフォーマンス改善 FRESH! 鈴木雅佳 ( @sutiwo_ ) さん FRESH! 生放送動画見放題の映像配信プラットフォーム アクセシビリティガイドラインも公開してるらしい https://openfresh.github.io/a11y-guidelines/ 話すこと Service Worker で静的アセットのキャッシュ Intersection Observer で遅延ロード SVG スプライトやめてプログレッシブなロード 1. SW で静的アセットのキャッシュ 設計方針と実装方法 キャッシュがあればキャッシュ
A11Y Style Guide
This application is a living style guide or pattern library, generated from KSS documented styles...with an accessibility twist. No matter your level of development or accessibility expertise, there are ways to help contribute to the a11y style guide. Why did this project start? We wear a lot of hats as front-end developers. Depending on the client or company you work for, you may be the designer,
※最初の1分ほど音声が入っていません。 Speaker: 中根 雅文: freee株式会社 阿部 諒: freee株式会社 松本 康男 山本 伶: freee株式会社 Japan Accessibility Conference - digital information vol.2 https://japan-a11y-conf.com/vol2/session/#Freee ---- 字幕の校正＠ブラインドライターズ http://blindwriters.co.jp/
最近、Boshen さんが開発している Oxc に注目しています。 社内で Oxc の近況を slack に投稿していたところ、「Oxc は Rome で話題になっていますか？」や「Oxc はうまくいくと思いますか？」と聞かれたことで Rome の現状を整理するいいきっかけになったので、記事に残しておこうかなと思います。 Rome と Oxc の違い Rome と Oxc はどちらも linter、formatter、transpiler などを提供するつもりではあるので、ユーザーからみた違いは分かりにくいかなとは思います。現時点での大きな違いは、次の２点だと思っています。 プロジェクトのスコープ Rome: JS/TS に限らず Web 開発に関連する言語全般にツールを提供することを試みている Oxc: JS/TS に関するツールにフォーカスしている 提供するツールの拡張性に対する考え方
create-react-app 3.0にしたのでついでにTSLintからESLintに移行した - ninjinkun's diary
経緯 BlogFeedbackで使っているcreate-react-appを3.0に上げたらTypeScriptにもLintが効くようになっていたが、そのせいでいきなりビルドが止まるようになってしまった 元々TSLintを入れてエディタとCIでTSLintを実行していた create-react-app 3.0からyarn startやyarn buildでESLintが実行される TypeScriptには@typescript-eslintで対応してるみたい 新しく入ったESLintは無設定状態だとデフォルトのルール (eslint-config-react-app)で実行されるので、TSLintで設定していなかったいくつかのルールで引っかかるようになって、CIでyarn buildが止まっていた eslint-config-react-appにはjsx-a11y react-hooks
freeeアクセシビリティー・ガイドラインVer. 202105.0を公開しました - freee Developers Hub
こんにちは、freeeのアクセシビリティーおじさん、中根です。今年もどこにも出掛けない連休を過ごしました。家でだらだらするのは嫌いではないのですが、さすがにそろそろ飽きてしまいました。 さて、今回もfreeeアクセシビリティー・ガイドラインの更新情報をお送りします。 とはいえ、今回は更新内容が少ないので、今回の更新に関連してfreeeアクセシビリティー・ガイドラインで紹介しているブックマークレットをまとめて掲載します。 そして前回の更新情報でお知らせしたイベントについて、関連資料や当日の動画アーカイブを紹介します。 freeeアクセシビリティー・ガイドライン Ver. 202105.0リリース・ノート グレースケール表示のためのブックマークレットを追加 誤字の修正を除くと、今回の唯一の変更はグレースケール表示をするためのブックマークレットの追加です。 これまで、参考情報の「グレースケール表
Video.js Blog
Video.js 7.4It's time to have an overview of Video.js 7.4, first released early December. The big new feature for this release is a UI that allows you to seek during live streams. We updated focus-visible to work with our Menus, added more translations, added a replay option to the Play/Pause button, and many, many fixes, multiple of which are accessibility related. We also dropped our usage of Gr
@axe-core/playwright によるアクセシビリティテストの自動化 2024.08.18 axe-core は axe というアクセシビリティテストツールのコアエンジンで、オープンソースとして提供されています。この記事では、E2E テストフレームワークの Playwright と axe-core を組み合わせて使用して、アクセシビリティテストを自動化する方法について紹介します。 今書いているコードがアクセシビリティ上の問題を持っていないかどうかを確認するために、Lint ツールによる機械チェックが有効です。eslint-plugin-jsx-a11y や Markuplint といったツールを導入することで、コンポーネント単位で静的にコードを解析してアクセシビリティの問題を検出できます。このような Lint ツールは、code を書いている最中に即座にフィードバックを受けるこ
ARIA Validatorを利用したWAI-ARIAの検証 | アクセシビリティBlog | ミツエーリンクス
WAI-ARIAを使ってアクセシブルなコンテンツを作成したいと考えていても、WAI-ARIAの指定方法に問題がないかどうか不安、という方も多いと思います。そのような場合には、まずはWAI-ARIAの仕様に従っているかどうかを確認すると良いと、私は考えています。というのも、明白なミスを防ぐことができる制約がWAI-ARIAの仕様にはいくつか定められているためです。この記事では、ARIA Validatorを使った検証方法とWAI-ARIAの仕様で定められている制約のいくつかを紹介します。 ARIA ValidatorはページがWAI-ARIAの仕様に従っているかどうかをチェックするGoogle Chromeの拡張機能です。記事執筆段階での最新版は0.10です。 現時点ではまだベータ段階とのことですが、閲覧中のページに対して様々な検証を行うことができます。ただし、ARIA Validatorは
Frontrend Vol.9 - 春の新人歓迎 マークアップ/アクセシビリティのキホン #frontrend
2017年4月30日 著 4月28日の覚え書き。オシャンティーな渋谷プライムプラザ 4F Creative Loungeで催されたイベント、Frontrend Vol.9 - 春の新人歓迎 マークアップ/アクセシビリティのキホンにブログ絶対に書くパーソン枠で参加したので、以下に感想など徒然なるままに書こうと思います。ちなみにブログ絶対に書くパーソン枠で参加しておきながらブログ書かなかったら何が起こるのかというのに個人的興味があったけど、社会人としてどうかと思うので、書きます。 継続的にアクセシビリティを高めるために 〜まずは無理なく基本を押さえる〜 サイバーエージェントでアクセシビリティおじさんを務めるますぴーさんのプレゼン。担当されているサービス、FRESH!（本イベントの録画も同サービスで公開されています）での取り組みを「まずはできるところから」「みんなでやる」の2種類に大別して紹介さ
Verizon: Wireless, Internet, TV and Phone Services | Official Site
Get iPhone 16 on us with select Unlimited Plans. Online Only. | Shop now. Or get up to $540 when you bring your own phone. | Details ", "nextArrow":"", "responsive":[{"breakpoint": 767, "settings": {"touchThreshold": 500, "slidesToShow": 4, "slidesToScroll": 3}}, {"breakpoint": 991, "settings": "unslick"}]}'> Phones Bring a device Mobile plans Free phones Tablets Smart watches ", "nextArrow":"", "
Intro 2019/4/28 - 5/1 の 4 日間で、 mozaic bootcamp 2019 というひたすら Web 技術を叩き込むイベントを開催した。 その内容やモチベーションについては、以下で話している。 ep48 Monthly Web 201901 | mozaic.fm このイベントの概要と目的について記録する。 概要 Web に限らず、初学者を対象とした書籍, イベント, 動画, 研修など、最初のステップを踏むためのコンテンツは幸いなことに充実してきている。 一方、そうしたコンテンツを修め、基礎的な部分をある程度理解した人が、次のステップに進むためのコンテンツは途端に減り、どうすればより成長できるのかで悩む時期があるように感じている(筆者がそうだった)。 自分でなんとかするしか無いといえばそうだが、そうした迷える中級者に対しても、もう少しできることがあるのではないかと
Firefox のコンテキストメニューを編集する
Firefox57 以降、旧アドオン廃止により使用できなくなった Menu Wizard の代替えについて考えます。残念ながら、 WebExtensions API では、コンテキストメニュー編集の拡張機能を作成できないため、自分なりに代替えしました。 実現方法これまでは、 Menu Wizard を使用してコンテキストメニューを編集していました。ですが、よくよく考えるとコンテキストメニュー（右クリックメニュー）の削除（非表示）しかしていませんでした。削除だけであれば、 userChrome.css による CSS の FirefoxUI 編集で実現できます。なので、 userChrome.css で実現します。 実現結果変更前変更後userChrome.css への追加コード下記の追加コードを userChrome.css に導入することでコンテキストメニュー編集を実現できます。 利用者
2023年5月、Vivaldiの日本先行でのiOS版プレビューリリース発表のためヨンが来日したことをきっかけに、インターネットの将来やアクセシビリティについて語る対談の機会が設けられました。 Vivaldiブラウザの創業者ヨン・フォン・テッツナーは、'90年代から長きにわたりWebブラウザ開発に携わってきた、ブラウザ業界のキーパーソンの一人です。彼のブラウザ開発のコアには、ユーザ一人ひとりのニーズに合わせた非常に柔軟なカスタマイズ性や、プライバシー保護があります。また、一部ビックテック企業によるユーザ行動の監視から逃れ、インターネットの安全性を高めるためのオープン標準規格やルール作りなどに貢献する活動も行っています。 聞き手は、ミツエーリンクス社でWeb標準技術の策定やアクセシビリティの啓発に携わってきた木達一仁氏です。 左から木達氏、ヨン、冨田 2023年のホットトピックから～生成系AI
高知こどもの図書館サイトとアクセシビリティ
2022年5月5日こどもの日に、デザイナーとして関わった 高知こどもの図書館のウェブサイト がリニューアル公開されました。 この記事では、高知こどもの図書館ウェブサイトの制作時にアクセシビリティに関して取り組んだことを紹介します。 プロジェクトの背景 行けなくても訪ねられる図書館！ こどもの本の世界を拓くWebサイト 「高知こどもの図書館」は、NPOで運営されているこどもの本の専門図書館です。今回のプロジェクトでは、クラウドファンディングで全国から200名以上の方の支援を得てウェブサイトの全面リニューアルが行われました。 来館することが前提の従来の形から、図書館に来られない方々に対して「もう一つの扉」を開きたい。インターネットツールを活用することで、より多くのこどもたちに、本の世界の入り口への道先案内ができないだろうか。 高知こどもの図書館クラウドファンディングページより コロナ禍で図書館
EPUBのアクセシビリティ要件をまとめたJIS X 23761:2022がISO/IEC 23761:2021に対応する規格として8月22日に制定されました。 日本産業規格（JIS）を制定・改正しました（2022年8月分） （METI/経済産業省） JIS X 23761:2022 EPUBアクセシビリティ― EPUB出版物の適合性及び発見可能性の要求事項 | 日本規格協会 JSA Group Webdesk JIS X 23761:2022は、 上のJSAサイトで購入できるほか、閲覧のみであれば、日本産業標準調査会（JISC）で可能です（なぜ日本規格協会のHPでは部分的にしか見られないのか・・）。 JIS X 23761は、2017年に策定されたIDPFのEPUB Accessibility 1.0 に由来しています。このEPUB Accessibility 1.0がベースとなり、国際規
スケーラブルで保守性の高いモジュラーディレクトリ構成へのフロントエンドリポジトリ移行 | メルカリエンジニアリング
Merpay Advent Calendar 2022 の9日目は、メルペイ フロントエンドエンジニアの @tokuda109 がお届けします。 この記事は、メルペイ フロントエンドチームで保守しているリポジトリを複数のディレクトリに分割し、スケーラブルで保守性の高いコードベースに再構築する方法を紹介します。 記事の内容は『Merpay Tech Talk 〜Monorepo開発におけるツール選定〜』のイベントで一度紹介したものになりますが、この記事ではさらに詳しく説明します。 フロントエンドチームは今後 Nuxt 3 への移行作業を控えていて、今回紹介するリポジトリ移行が Nuxt 3 への移行に与える効果についても紹介します。 抱えていた課題 フロントエンドチームは、メルペイのサービスリリース時からカスタマーサポート業務を行う社内向け管理画面や加盟店さま向け管理画面など、様々なマイクロ
一箇所にないと忘れてしまうので 画像 iconfinder アイコン検索サイト http://www.websiteicons.net/ アイコン famfamfam.com: Home アイコン http://www.ndesign-studio.com/resources/mini-pixel-icons/ アイコン2006/10/03追加 Mini Icons | urlgreyhot アイコン2006/11/04追加 Bullet Madness - free bullets project at Stylegala いろんな人が作ったアイコン2006/11/04追加 Sweetie | Free icon set アイコン2006/11/04追加 graphicPUSH: Free icons and free icon sets for web designers. アイコン2
2019年、サイバーエージェントのアクセシビリティを振り返る | CyberAgent Developers Blog
こんにちは、サイバーエージェントの@masuP9（ますぴー）こと桝田です。CATSという組織でウェブフロントエンド開発と「でもやるんだよ勢」として社内外でウェブアクセシビリティ推進啓蒙をしています。 この記事は「2019年、freeeのアクセシビリティを振り返る」の記事にインスパイアされ、主に当社メディア事業部でのアクセシビリティ関連の出来事を振り返ります。 ※アクセシビリティの向上とは、障害者高齢者を含めた幅広いユーザーに利用方法の選択肢を提供し、使える状況を広げる取り組みを指します。 こえのブログリリース 今年最初の大きな話としては、「こえのブログ」のリリースでした。こえのブログは、「喋るだけでブログになる」ということで、喋った内容が音声で聞けるだけでなく自動で書き起こしされテキストでも提供されるというサービスです。 アクセシビリティの観点から企画がスタートしたわけではありませんが、サ
� ��KV 0 �KV p+m�KV @���KV @&I�KV
こんにちは。フロントエンド開発センター(UIT) 岡﨑です。"IU Web"というLINEが保有する膨大なデータを安全かつ効率的に利活用できるデータポータルのデザインとフロントエンド開発を担当しています。その傍らでUIT Accessibility TF(タスクフォース)に所属し、社内にアクセシビリティを啓蒙する活動を行っています。 Tech-Verse 2022とは？ LINEとヤフーが合同で開催する技術カンファレンスです。これまで両社がそれぞれ開催していたLINE DEVELOPER DAYとYahoo! JAPAN Tech Conferenceが1つになりました。3カ国語(日本語、英語、韓国)で合計88のセッションをLINE LIVEによるライブストリーミング配信を通じ、これまで各社の開発・研究が積み重ねてきた挑戦や得られた知見、そして現在活用している最先端の技術などを伝えることを
April 2022 (version 1.67) Update 1.67.1: The update addresses this security issue. Update 1.67.2: The update addresses these issues. Downloads: Windows: x64 Arm64 | Mac: Universal Intel silicon | Linux: deb rpm tarball Arm snap Welcome to the April 2022 release of Visual Studio Code. There are many updates in this version that we hope you'll like, some of the key highlights include: Explorer file
tacamy--blog
JavaScriptでAlgoliaのAPIを叩くときに、APP IDとAPIのKEYを引数に渡す必要があるんだけど、それらを外部ファイルにして、Gitにコミットしないようにしたかったけど、webpackの設定をどう書けばいいのかよくわかんなくてつらかったのでメモ。 Vue.jsをwebpack v4でビルドしてる環境です。 dotenvのインストール $ npm install dotenv --save ほかにもdotenv-webpackとかいろいろあって、どれをつかえば…！ってなってた。 .envの作成 ルート直下に.envという名前のファイルを作成して、以下のような感じで保存する。 APP_ID=***** API_KEY=***** .envをignore .envをGit管理化から除外するために、.gitignoreに.envを追記する。 webpackの設定 webpack
Bugzilla@Mozilla で、Gecko レンダリングエンジンにおける blink 要素と CSS の text-decoration: blink; のサポート廃止が提案され、それが承認されたようです。 大昔の名残で、Netscape 系ブラウザと Opera しかサポートしていませんので、今どき使っている人の方が珍しいどころか、知ってる人も少ないんじゃないかとは思いますが （携帯サイト作ってる人とかだと使うのかな...）、Bugzilla@Mozilla で、Gecko レンダリングエンジンにおける blink 要素と CSS の text-decoration プロパティに対する blink 値指定のサポート （点滅エフェクト） をやめようぜっていう提案がされ、それが承認されて、今後リリースされるバージョンに反映されることが確定したみたいですね。 857820 - Drop
Full featured demo: Including Premium Plugins | TinyMCE Documentation
Character strings to demonstrate some of the Advanced Typography plugin’s features Select the characters in the list below and choose Tools → Typography → Enhance. Not really an arrow glyph: -> "Double tear-drop quotation marks and apostrophes aren't typographically elegant." But they should be honored in a code-fragment: "true". (c) symbol (tm) symbol 30C is 86F 🤖 Try out AI Assistant! Below are
ESLint2からESLint3に上げて関連プラグインもアップデートした話 - Wondershake 開発者ブログ
こんにちは。フロントエンドエンジニアの佐々木です。 先日、ESLintまわりを最新にアップデートしたのですが、結構修正することが多かったので備忘録も兼ねて残しておきます。 ちょっと古いですが、ESLintの導入に関してはこちらの記事でご紹介しました。 engineering.wondershake.com ESLint3へのアップデート ESLint導入時には下記のバージョンを使っていました。 "eslint": "^2.9.0", "eslint-config-airbnb": "^9.0.1", "eslint-plugin-import": "^1.12.0", "eslint-plugin-jsx-a11y": "^1.2.0", "eslint-plugin-react": "^5.1.1", "babel-eslint": "^6.0.4", それぞれ最新のバージョンを調べてイ
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Biome と ESLint の lint ルールの互換性
新卒研修とアクセシビリティ | アクセシビリティBlog | ミツエーリンクス
Storybookの便利なaddon機能のご紹介 | スペースマーケットブログ
アクセシビリティを担保するためにESLintの独自ルールを作っている話 - SmartHR Tech Blog
Web アクセシビリティ向け Node.js 製の自動チェックツールや DevTools 用の拡張機能など
アクセシビリティはあなたビリティ - dskd
2021年に行ったアクセシビリティやっていき - BASEプロダクトチームブログ
全盲エンジニアがiOS/Android/WebUIエンジニアにダメ出しした結果 - JAC vol.2
Rome の contributor からみた Oxc の印象
@axe-core/playwright によるアクセシビリティテストの自動化
mozaic bootcamp 2019 | blog.jxck.io
AI時代のWebブラウザから考えるWebアクセシビリティの本質 ――Vivaldiのアプローチから | gihyo.jp
JIS X 23761:2022（EPUBアクセシビリティ）が制定 | kzakza
デザイン系ツールまとめ - devworks
UI 実装の再考と a11y - Frontrend Vol.8 LT
"Tech-Verse 2022"ウェブにおけるアクセシビリティ改善の取り組み
Visual Studio Code April 2022
text-decoration: blink; と blink 要素終了のお知らせ