a11y を強化する ReactComponent の型推論
次の Button は tag の指定により、HTML 要素を出し分ける Component です。出力結果は下段のとおりです。この Component を通し a11y を強化する型注釈を考察したので、メモとして投稿します。 <Button tag="button">+1</Button> <Button tag="a" role="button">+1</Button> <Button tag="input" type="button" value="+1" />
次の Button は tag の指定により、HTML 要素を出し分ける Component です。出力結果は下段のとおりです。この Component を通し a11y を強化する型注釈を考察したので、メモとして投稿します。 <Button tag="button">+1</Button> <Button tag="a" role="button">+1</Button> <Button tag="input" type="button" value="+1" />
Github Actions のテスト実行時間を速くするためにやったこと - Uzabase for Engineers
本記事は、NewsPicks Advent Calendar 2022 の 12/18 公開分の記事になります。 NewsPicks Web Reader Experience Unit でフロントエンドエンジニアをしているじゆんきち(@junkisai)です。 弊チームでは、ここ1年間くらいWeb 版のNewsPicksを新しい基盤に置き換えつつ、見ためも刷新するプロジェクト（以下リニューアルプロジェクト）を進めています。 Web 版 NewsPicks は、jest でロジックの単体テスト、コンポーネントのレンダリングテスト、 a11y テストを Github Actions 上で実行しています。しかし、コードの規模が大きくなるにつれ、テストの実行時間が最大で 10 分程度かかるようになってしまい、開発体験を阻害してしまっていました。 今回は、最大 10 分程度かかっていたテストの実行
January brings us Firefox 85 – Mozilla Hacks - the Web developer blog
To wrap up January, we are proud to bring you the release of Firefox 85. In this version we are bringing you support for the :focus-visible pseudo-class in CSS and associated devtools, <link rel="preload">, and the complete removal of Flash support from Firefox. We’d also like to invite you to preview two exciting new JavaScript features in the current Firefox Nightly — top-level await and relativ
About this plugin The A11y - Focus Order plugin lets you add accessibility annotations over your designs for the interactive elements of desktop, website, and mobile applications. You can share these annotations with engineers as part of your design. Accessibility is critical for good desig...
A11yAutomation
A11y Automation Tracker A more thorough way to track the potential accessibility violations and the automated linters and tests currently available. Accessibility Automation Catch potential a11y violations faster. It can be hard to keep track of the potential accessibility violations in your code. More automation is being created for linting rules and tests-- and now there is a single site to trac
記事のターゲット 基本的に私です Storybookを触ってみたは良いけど公式アドオンの選定に迷っている人 公式アドオン各々の利点がわかっていない人 フロントエンド初心者だけどStorybook知ってそうな雰囲気出してドヤりたい人 Storybook とは UIコンポーネントを分離して開発するためのオープンソースツールで、Web上のサンドボックス環境を提供してくれます。 ローカルホストで立ち上げ、ブラウザ上で細かな動作確認を行えるので細かいコンポーネント単位で開発がしやすくなります。 また、サンドボックスではUIコンポーネントのカタログを検索・閲覧する機能を提供することでUIの再利用性を高めることができます。 ビジネスロジックに寄らないコンポーネント実装やMockingもお手軽なのでAtomicDesignベースの開発では必需品かもしれません。 ただし、サンドボックス環境も開発者の手でコン
週刊Railsウォッチ（20210419前編）RailsのN+1クエリを定番以外の方法で修正する、GitLabのセキュリティ修正リリースほか｜TechRacho by BPS株式会社
こんにちは、hachi8833です。RailsConf 2021をすっかり見逃してました😇。 We must and will do better in the future. pic.twitter.com/qYTF7ljUX5 — RailsConf (@railsconf) April 9, 2021 つっつきボイス:「RailsConf 2021、そういえば開催時期だったか」「つっつき中の今日（04/15）がラス日でした🙇」「キーノートのページにコミットでよく見かける顔が並んでますね」 サイト: RailsConf 2021 セッション: Sessions | RailsConf 2021 - 60件 ワークショップ: Workshops | RailsConf 2021 -- 11件 「RailsConf 2021のfaqを見た感じでは有料イベントのようですね」「あ、そうでし
文学フリマ（以下、文フリ）がこれだけ盛況なのに対して、文フリで出品されているようなZINE、同人誌、文芸誌などの電子化ってまだまだ進んでいないよなあと考えたりしている。小説『ハンチバック』で芥川賞を獲った市川沙央さんが問題提起したように、書籍全体として電子化が遅れているようなので、出版社にはもっと頑張ってほしいと思うのだが、その一方で、個人や小規模のサークルなどが制作しているZINE、同人誌、文芸誌なども電子化を進められたらいいなあと思う。 ［……］『ハンチバック』を書くきっかけは、通っていた通信課程大学での卒論リサーチです。障害者や差別の歴史を調べていて、いらだちを感じることが多々ありました。 とくに、日本の読書バリアフリー環境の遅れは目につきました。障害者の読書を想定せず、電子化されていないものが多い。重度障害者だってもちろん本を読むということに気づいてもらうために、いろんなものを書く
「既存プロダクトのWebアクセシビリティ改善ことはじめ」は、既存プロダクトのアクセシビリティー改善の具体的な取り組みの進め方について、freee株式会社が発見を紹介するイベントです。伊原氏と中根氏は、「freeeアクセシビリティー・ガイドライン」と「アクセシビリティー・チェックリスト」について発表しました。全2回。前半は、伊原氏が、既存プロダクトのアクセシビリティー改善のサイクルについて話しました。 社内アクセシビリティ向上活動がはじまるパターン 伊原力也氏：私から「既存プロダクトのアクセシビリティー改善の第1歩」というところで、前説をお話しします。 アクセシビリティ向上の活動について、初めの1歩と言っているのですが、その初めの1歩の手前で「だいたいこういうふうに事が起こるよね」みたいなことをちょっと書いてみました。 これが社内アクセシビリティ向上活動の始まりパターンです。何社さんかに聞い
a11y由来のスタイリング考察
aria属性 や role属性 を用いたスタリング実例は、まだあまり聞くことがありません。例えば CSS Modules の場合次の様な指定が可能であり、a11yとスタイリングを両立できるため、アプローチとして良さそうと考えています。 .text { color: #000; } .text[aria-invalid=true] { color: #f00; /* エラーの表現とか */ } .menu[aria-expanded=false] { display: none; /* メニューの開閉表現とか */ } .menu[aria-expanded=true] { display: block; /* メニューの開閉表現とか */ }
同僚の @wadackel とウェブアクセシビリティの検証ツール acot （アコット）を作っていて、まだまだ途中だけど、Webアクセシビリティ Advent Calendar 2020の18日目になってしまったのでご紹介。 https://github.com/acot-a11y/acot すでにWeb アクセシビリティの検証ツール acot を作ってる - wadackel.meで詳しく紹介されているので、私の記事では補足的にacotを作るモチベーションや経緯、アイデア、どんなルールが書けるかなどを紹介する。 モチベーションとか経緯とか 以前に @wadackel と開発していたWINTICKETというサービスでは、ウェブアクセシビリティに関する開発ポリシーとコードレビュー、そしてeslint-plugin-jsx-a11yによって一定の品質が保たれていた。 ウェブアクセシビリティ -
MDN Web Docs: Editorial strategy and community participation – Mozilla Hacks - the Web developer blog
We’ve made a lot of progress on moving forward with MDN Web Docs in the last couple of months, and we wanted to share where we are headed in the short- to mid-term, starting with our editorial strategy and renewed efforts around community participation. New editorial strategy Our updated editorial strategy has two main parts: the creation of content pillars and an editorial calendar. The MDN write
GitHub - acot-a11y/acot: :gem: Accessibility Testing Framework. More accessible web, all over the world.
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
これは フェンリル デザインとテクノロジー Advent Calendar 2023 15日目の記事です。 こんにちは。大西です。年に一度くらいしか書かないnote、今年も一度しか書かずに終わりそうです。 私は視覚科学を勉強しています。特に文字の認識に関する研究が好きです。 文字について考えるのが楽しすぎて、博士号をとりました。今回は久しぶりに自分の専門領域の話を書きます。 IT業、しかもHCDを掲げて仕事をしている身ではありますが、実は私、WCAG関連の話題があまり好きではありません（個人的な見解です）。中でも、「4.5:1以上のコントラスト比がないとアクセシビリティ対応が不十分」のようにいわれがちな、コントラストチェッカーの結果を見るのが一番苦手です。チェッカーでの計算に限界があることを理解して使ってほしい、結果に一喜一憂するくらいなら輝度を実測しちゃえばいいのに、などと歯がゆい思いを
State of Storybook 2019
Storybook is the most popular UI component workshop on the planet. It powers front-end development for teams at Airbnb, Lyft, Slack, Twitter, and thousands more companies. It’s used to build top design systems like Shopify Polaris, IBM Carbon, and Salesforce Lightning. Thanks to our vibrant community, the project is growing like gangbusters by every measure. Our product is improving rapidly and on
Firefox 79: The safe return of shared memory, new tooling, and platform updates – Mozilla Hacks - the Web developer blog
Firefox 79: The safe return of shared memory, new tooling, and platform updates A new stable version of Firefox brings July to a close with the return of shared memory! Firefox 79 also offers a new Promise method, more secure target=_blank links, logical assignment operators, and other updates of interest to web developers. This blog post provides merely a set of highlights; for all the details, c
こんにちは。フロントエンドエンジニアの yamanoku と申します。 最近久々に出社しましたが、どうやら半年以上も出社していなかったことに驚愕しました。自分自身が違和感なくリモート作業やれているのかもなぁという気づきにもなりました。 前回の記事では東京都 新型コロナウイルス対策サイトの Web アクセシビリティチェックをしたという話をしました。 engineer.crowdworks.jp 今回の記事では、チーム内でクラウドワークスの Web アクセシビリティチェックを実施してみた話をします。 Webアクセシビリティとは？ Accessibilityは「アクセスできる・アクセスしやすさ」と翻訳されます。そしてWebアクセシビリティはWebにある情報やコンテンツに、あらゆる人がアクセスできようにすることを指します。 あらゆる人がアクセスできるようにする、とはどういうことか。以下はその対応例
axe DevToolsを使用したアクセシビリティー・チェック — freeeアクセシビリティー・ガイドライン Ver. 202403.1-RELEASE+4.3.7
axe DevToolsは非常によく使われているアクセシビリティー・チェック・ツールです。基本機能がaxe-coreとして実装されているため様々な方法で使用することができますが、ここではブラウザー拡張機能として利用して、出来上がっているWebページのアクセシビリティーの対応状況をチェックする方法を紹介します。 なお、axe DevToolsを用いた具体的なチェックの実施方法については、axe DevToolsを用いたチェック実施方法の例を参照してください。また、axe DevToolsのルールと当ガイドラインの対応も合わせて参照してください。 axe DevToolsのインストールと起動の仕方 ChromeウェブストアからChrome拡張をインストールできます。 axe DevTools - Web Accessibility Testing - Chrome ウェブストア axe Dev
チェック実施用Googleスプレッドシート — freeeアクセシビリティー・ガイドライン Ver. 202404.0-RELEASE+4.3.7
各チェック内容ごとの情報をまとめたGoogleスプレッドシートを公開しています。 アクセシビリティー・チェック・リスト一般公開用 Google Drive上でこのスプレッドシートのコピーを作成してご利用ください。 アクセシビリティー・チェック・リストのバージョン番号について アクセシビリティー・チェック・リストには便宜上バージョン番号を記載しています。本稿執筆時点の最新版では、一枚目のシートのセルA10に記載しています。 V3.0.0以降、バージョン番号は、メジャー・バージョン番号、マイナー・バージョン番号、リビジョン番号の3つの数字をピリオド（.）で区切って記しています。例えば、バージョン番号が3.0.1の場合、メジャー・バージョン番号が3、マイナー・バージョン番号が0、リビジョン番号が1です。 それぞれの番号は、以下に示す方針で更新しています。 メジャー・バージョンチェック・リストの構
NextAuth.js for client-side authentication in Next.js | LogRocket Blog
Ejiro Asiuwhu Software engineer with a drive for building highly scalable and performant web applications. Heavily interested in module federation, micro frontends, state machines, TDD, and system designs. Big on web performance and optimization, advanced component design patterns, a11y, SSR, SSG, ISR, and state management. Expert at crafting highly reusable TypeScript-heavy component libraries. E
JSer.info #654 - Riot.js v9.0.0がリリースされました。 Release Evergreen · riot/riot このリリースでは、Riot.jsとcompilerなどのバージョンを合わせるため、v8はスキップしてv9.0.0としてリリースされています。 Node.js 14/16のサポート終了、BabelでのTranspileをしないように変更、boolean属性の挙動変更などが含まれています。 Firefox 116がリリースされました。 Firefox 116.0, See All New Features, Updates and Fixes Firefox 116 for developers - Mozilla | MDN HTTP/2のアップロードパフォーマンスの改善、CSP3 external hashesをサポート。 FetchのgetRe
ただリンクにしたいときにhref="url"の代わりにonClick="location.href = 'url'"的なことをすると体験を損ねます - Qiita
ただリンクにしたいときにhref="url"の代わりにonClick="location.href = 'url'"的なことをすると体験を損ねますHTMLアクセシビリティa11y ただのページ遷移をしたいだけなのに、（主に手抜きという）実装の都合で JS の location.href になってることはありませんか？ 実はそれ、体験を損ねているかもしれませんよ。 起こる出来事 マウスのホイールクリック（ミドルクリック）で別のタブで開けません。 Mac にはマウスホイールなんてついてないだろ？ 実は Cmd+クリックも同様に別のタブで開けないんですよ。 スマホだったら長押しに相当すると思います。 したがって、意図して別タブで開かせたくない場合を除いて、location.href での遷移は避けるべきです。 厳密には JS の処理内での遷移させるのを避けよう、というべきですね。 なので Rou
Firefox 70 — a bountiful release for all – Mozilla Hacks - the Web developer blog
Firefox 70 is released today, and includes great new features such as secure password generation with Lockwise and the new Firefox Privacy Protection Report; you can read the full details in the Firefox 70 Release Notes. Amazing user features and protections aside, we’ve also got plenty of cool additions for developers in this release. These include DOM mutation breakpoints and inactive CSS rule i
ESLint のススメ
まとめ ESLint とは 「どっちでも書ける記述方法のうちこっちにして」と決めたルールセットとそれに違反しているかどうかを自動検出(リント)・訂正(フォーマット)するツール。 つまり、いわゆる静的解析ツール、またの名をリンター。フォーマッターも兼ねられ プラグイン方式でチェックできることを増やすことができる。 ESLint の良いところ 人によってバラバラになってしまいがちな記述方式に一定の統一感を出せる。コードを読む速度が上がる。 どっちでもいい時に迷わなくて済む。時短。 変更合戦になりにくくなる。これも時短。 ルールの追加などをプラグイン方式で行うので、チームで好きにルールの厳しさを決められる。 プラグインはルールセットなんだけど、その中でも個別にオンオフできるし、全部オンとか、react/recommended などおすすめルールセットもある。 みんな使ってる。（情報少ないとかでは
Welcoming Mozilla to Matrix!
Hi all, We’re incredibly excited that Mozilla just announced that they’ve selected Matrix as the successor to IRC as the communication platform for the public Mozilla community!! This comes off the back of a formal 1-month trial in September to evaluate various options side by side, and now New Vector will be helping Mozilla get their homeserver up and running on the Modular.im hosting platform ov
2023年5月31日 そのaria-labelは本当に必要ですか？ チーフアクセシビリティエンジニア 黒澤 アクセシビリティ対応には複数の方法がありますが、方法によって運用負荷はさまざまです。 私はお客様に、aria-labelを設定するのではなく、画面に表示されているテキストで情報が伝わるようにすると運用負荷を抑えられますよ、という話をすることがあります。 aria-labelは指定をミスするとほぼ確実にアクセシビリティの問題につながりますが、画面に表示されないため、作業漏れが生じやすく、指定ミスに気がつきにくい性質があります。 実際、お客様サイト・サービスの現状把握や競合調査の業務ではaria-labelの作業漏れや指定ミスによるアクセシビリティの問題を多数見てきました。 この記事では実際の問題例をサイト・サービスが特定されないように調整したうえで紹介していきます。 紹介した例はいずれ
Posted by Karen Ng, Director, Product Management Today, we’re releasing the alpha of Jetpack Compose, our modern UI toolkit designed to help you quickly and easily build beautiful apps across all Android platforms, with native access to the platform APIs. Bring your app to life with dramatically less code, interactive tools, and intuitive Kotlin APIs. No matter where you’re working from -- whether
3系swiper、4系swiperのオプション記事を以前書いたんだけど、また久しぶりに公式見たら6系まで進んでたから再々記事。 ※この記事は実装方法が解説しているというよりは、オプションを実際触ってみてその効果をひたすら書いた記事になります。 以前のバージョンの記事も需要ありそうだから残しておく。 【4系】こちら 【3系】こちら ※2系以前と5系は記事にしてないです。許して。 5系についてはオススメサイトのリンクを貼っておくのでよければこちら参考に！ Web Design Leaves様の5系に関する記事 swiper.jsってなんぞ？ swiper.jsの公式サイト 簡単に言うと、スライダー系のJSプラグイン。スライダーはswiper以外にもいくつかあるけど、中でもオプションが多く、更新も多い個人的にはかなり熱いプラグイン。 このswiper.jsのメリットデメリットはこんな感じ。 メリ
あかるいブランドカラーとコントラストの話〈テキスト版〉
2020年12月23日に開催された Accessibility Step Vol.07 オンライン で「今年取り組んだアクセシビリティ」としてライトニングトークを行いました。使用したスライドはこちらです。 自己紹介 高知在住フリーランスデザイナー印刷物とウェブのデザイン地域の小規模案件と東京の案件 半々くらいアクセシビリティが要件に入ってきたことは今のところない勉強して、できるところから取り入れている 今年取り組んだもうひとつのお話として「アイコンと用途・代替テキスト対応表を作った話」という記事を書いています。 コントラストについて コントラスト比とは、色同士の明るさ（相対輝度）の比率のことをいいます。コントラスト比が最大になるのは黒と白の組み合わせで 21：1。明度の差が小さいと、コントラスト比も小さくなり、文字や形が分かりづらくなります。 デザインする環境では見えていても、見る人の状況
はじめにフロントエンド開発をしている中でUIライブラリを用いて開発することってありますよね。 機能や見た目、A11Yへの配慮など色々な役割を担ってくれますが、その中でも見た目に関しては独自で定義したいことが多いのではないでしょうか。 そんな時に便利な「Radix UI」というヘッドレスUIの1つをご紹介できればと思います！ ヘッドレスUIについてRadixUIについて紹介する前にヘッドレスUIについて少し説明させてください。 ヘッドレスUIとはUI要素やインタラクションのロジック、状態、処理、APIを提供し、マークアップやスタイルを提供しないライブラリやユーティリティを指す言葉です。 そのためプロダクトごとのデザインやブランドカラーと完全に合うようにカスタマイズして採用することができます。 そして、ヘッドレスUIと言われるライブラリにはcomponentベースとhooksベースがあります。
こんにちは、フロントエンドエンジニアの樫福です。 タイミーのフロントエンドの開発に関わるエンジニアの人数が増えてきました。大人数で開発しながら品質を高い状態に保つには、品質に対する共通認識を作ることが大切です。 このたび、チームでフロイントエンドの単体テストについての勉強会を開催しました。 testing-library というフロントエンドのテストに使うライブラリを例に挙げ、具体的な手法よりも、テストを実装する前に抑えておきたい思想についてフォーカスしました。 フロントエンドでテストしたい項目 フロントエンドの単体テストを難しくする要因 testing-library を使って壊れにくいテストを作る方法 要素を見つけるクエリ ユーザの動作をシミュレーションする user-event 要素の状態を検査する jest-dom 実際にテストを書いてみる テストが書けないケース 運用するときの注
JSer.info #522 - @sindresorhusによるNode.jsライブラリのESM(ECMAScript Module)対応についてのdiscussionsが作られています。 @sindresorhusはさまざまNode.jsライブラリを作成しているため、Node.jsのESM対応に関係してきます。 The ESM move · Discussion #15 · sindresorhus/meta 2021-04-30でNode.js 10のLTSが終了し、Node.js 12以上のみが対象となります。 Node.js 12.xにはECMAScript modules(.mjsや"type": "module"など)の対応が含まれています。 nodejs/Release: Node.js Release Working Group Modules: ECMAScript m
■マジ価値サマリー（このお知らせでお伝えしたいこと） ・freeeが社内向けに開催したアクセシビリティ研修動画（技術職向け編）をfreee公式アクセシビリティYouTubeにて公開しました ・今年２月に全職種を対象とした動画を公開しましたが、新たに技術職向けの基本が学べる「Basic」、応用が学べる「Advanced」を公開しました ・freeeは今後も誰でも使えるアクセシブルな製品開発ができるように取り組んでまいります freee株式会社は、アクセシビリティ研修動画の技術職向け編を公開したことをお知らせします。昨年、freeeエンジニアによるブログ「freee Developers Blog（ https://developers.freee.co.jp/entry/a11y-training ）」で社内向けに使用しているアクセシビリティ研修資料を無料公開したところ大変多くの反響をいただ
Intro 2023/12/16(土) に、 3 回目となる「次世代 Web カンファレンス」を開催します。 次世代 Web カンファレンス 2023 - connpass 名称: 次世代 Web カンファレンス 2023 日時: 2023/12/16(土) 11:00-20:00 場所: サイボウズ 参加費: 無料 配信: なし アーカイブ: 未定 懇親会: なし 入場規制: あり ハッシュタグ(全体): #nwc_all Schedule [x] 10/23: 日程告知 [x] 11/01: 詳細公開 [x] 11/16: 募集開始 [ ] 11/30: 抽選終了 [ ] 12/16: 本番当日 Motivation 「Web について話す場」 というか「Web そのものをテーマにした場」というのが、意外と少ないなとずっと思っていました。 (もちろん、結果として Web について話して
サイボウズ デザイン&リサーチ の西藤（さいとう）です。 私は、Poca11y（ポカリ）というチームで、全盲やロービジョンの方と一緒に、プログラミングをはじめいろんな活動をしています。 Poca11y（ポカリ）チームとは サイボウズ デザイン&リサーチの中にあるチームの1つで、「アクセシビリティ（A11y）」や「研究開発（PoC）」に関する活動を専門的に行うチームです。 （PoC + A11y = Poca11y = ポカリ）というネーミングですこの記事は、一緒にプログラミングをする中で、気づいたことをまとめてみました。 「視覚障害のある方と一緒にプログラミングをする」と言われたら、あなたはどのようなことを考えますか？私は、こんなことを考えていました。 『専用エディタを用意しないといけない？』 『自分が書いている内容を全部読み上げないと伝わらない？』 実際働いてみると、この考えていたこと
OKLCH in CSS: why we moved from RGB and HSL—Martian Chronicles, Evil Martians’ team blog
The new CSS Color 4 specification has added the new oklch() notation for declaring colors. In this article, we explain why this is important for design systems and color palettes. The extremely short version oklch() is a new way to define CSS colors. In oklch(L C H) or oklch(L C H / a) each item corresponds as follows: L is perceived lightness (0%-100%). “Perceived” means that it has consistent li
アクセシビリティー研修 for All freeers
freee株式会社の入社時研修として実施している、「アクセシビリティー研修 for All freeers」の動画版です。 アクセシビリティー研修について、詳しくは以下のブログ記事をご覧ください https://developers.freee.co.jp/entry/a11y-training 動画内で使用しているスライドはこちらです https://docs.google.com/presentation/d/1HvkDi5B5xaApz_5wxx8jw7yC8bY-9-kioHbK7J0i2d0/edit?usp=sharing 00:00 イントロダクション 00:02 アクセシビリティーとは？ 08:24 障害者とアクセシビリティー 20:32 デモ:スクリーン・リーダーってこんな感じ 25:06 freeeとアクセシビリティー 35:05 あなたも今日からできるアクセシ
JSer.info #571 - npm 8.3.0がリリースされました。 Release v8.3.0 · npm/cli package.jsonのoverridesフィールドによって、依存のバージョン指定を強制的に変更できるようになっています。 これは、Yarnのresolutionsとよく似た機能となっています。 rfcs/0036-overrides.md at main · npm/rfcs polyfillライブラリであるcore-js 3.20.0がリリースされました。 Release 3.20.0 - 2021.12.16 · zloirock/core-js structuredCloneとDOMExceptionのpolyfillが追加されています。(structuredCloneがDOMExceptionに依存しているため、DOMExceptionも実装された) s
JSConf EU 2019に行ってきました
2019/6/1~6/2 の二日間ドイツのベルリンにて開催されたJSConf EU 2019に行ってきたのでレポートを書きます。 トーク以外にもイベント運営としてのクオリティの高さや JSConf ブランドに関してとかドイツ観光とか色々と感動したもの得たものが多くて書ききれないので、詳しくはお会いすることがあればお酒の肴にでも聞いてあげてください。 トークの概要だけ知りたい方は 1,2 日目まとめのあたりを読んで下さい。 何しに行ったの JS 界隈の世界的にトップレベルのエンジニアたちのトークを聞きたい 懇親会とかで英語で交流してみたい 海外のカンファレンス行ったことなくビビってる自分を打破するために行って成功体験を積みたい 海外の大きなカンファレンスで喋れそうかどうかテーマやレベル感、空気感を知りたい JSConf JP のスタッフなので本家 EU のすごさを知って JSConf JP
eslintを最大限活用してTypeScriptの型安全を少しずつ高める方法 - ITANDI Engineer Blog
はじめに あけましておめでとうございます！ OHEYAGOの開発の田渕です。 OHEYAGOではTypeScriptを導入し、少しでもバグが発生しにくい状態を心がけています。 しかし、リリース直後(昨年9月末)にはTypeScriptの良さを活かしきれていない状態でした。具体的には、 型を明示していない箇所が多かった any型が横行していた という状態でした。 そこで、リリース後に追加開発をこなしながら、コツコツTypeScriptの型システムの恩恵を受けやすいようリファクタリングを進めたので、その記録を書き留めておきます。 実際にTypeScriptを使っているけれどあまり秩序が保てていない、という方や、これからTypeScriptのプロジェクトを始めるけれど、eslintの設定をどうしようと思っている方などの参考になれば嬉しいです。 方針 typescript-eslintを活用して、
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
A11y - Focus Order | Figma Community
Storybook公式アドオンをまとめてみた - Qiita
ZINEの電子化についての雑多なメモ【追記あり】 - にげにげ日記
有効打は「把握・検討・改善・評価」のサイクル 散発的になりがちな既存プロダクトのアクセシビリティ改善
Web アクセシビリティの検証ツール「acot」 / masuP.net
視覚科学者がAPCAについて考えてみた｜Madoka Ohnishi
クラウドワークスのWebアクセシビリティチェックを始めてみた - クラウドワークス エンジニアブログ
2023-08-03のJS: Riot.js v9.0.0、Firefox 116、React Server Componentsへの移行
そのaria-labelは本当に必要ですか？ | アクセシビリティBlog | ミツエーリンクス
Announcing Jetpack Compose Alpha!
swiper.js6系使ってみたからそのオプションについて(v6.0.4) | なんかいろいろデザインする人
UIライブラリの「機能」は欲しいけど「見た目」はカスタマイズしたいを叶えるRadix UI
フロントエンドの単体テストについて勉強会を開催しました - Timee Product Team Blog
2021-01-12のJS: Node.jsライブラリのESM対応の計画、TypeScriptとJSDocでJavaScriptの型チェック
freeeアクセシビリティ研修動画、新たに技術職向け編を公開 | プレスリリース | フリー株式会社
次世代 Web カンファレンス 2023 開催告知 | blog.jxck.io
視覚障害のある方とプログラミングをする｜【アカウント移行済】KazuMax(Kazuma Saito)
2021-12-20のJS: npm v8.3.0、core-js 3.20.0、 The State of CSS 2021