igtm, tmr, ymdarake

火曜日のおフロ

Education JA ↓ 80 episodes

@igtm, @t-gyo, @ymdarake が、ゆるーくフロントエンド周りの気になった記事を紹介しながらお届けします。おフロは「フロントエンド」から来てます。毎週土曜日更新。https://tue-ofuro.vercel.app/

Author

igtm, tmr, ymdarake

Episodes

Chrome DevTools for designers, Web Fontが重い話 React Component Pattern 29.05.2021 2:17:43

Chrome DevTools for designers | Session - YouTube https://www.youtube.com/watch?v=yNwwEu3Kcbs マイクロソフトはGPT-3を使い自然言語でコードを書けるようにする | TechCrunch Japan https://jp.techcrunch.com/2021/05/26/2021-05-25-microsoft-uses-gpt-3-to-let-you-code-in-natural-language/ ここ🌸自由を愛するWebデザイナー / Twitter https://twitter.com/cococo_design/status/1395130151768371206 深沢幸治郎｜ウェ...

Google I/O 2021について 22.05.2021 2:17:44

Google I/O 2021 https://events.google.com/io/ A few things to know from Google I/O 2021 in under 9 minutes. - YouTube https://www.youtube.com/watch?v=L7c4wS7T_T8 Apple event in 51 seconds - YouTube https://www.youtube.com/watch?v=Gz8vBoEFArA Google Workspaceを大幅強化するアップデート「Smart canvas」 - GIGAZINE https://gigazine.net/news/20210519-google-workspace-smart-canvas/ Twitter、TL上の画像表...

Chrome 91, Javascriptで書けるシェルスクリプト "zx", SSRF, useRefのRefObjectとMutableRefObject, Google DocsがCanvas移行 15.05.2021 1:55:08

［速報］マイクロソフト、無料でRPA機能「Power Automate Desktop」をWindows 10ユーザーに提供開始。Microsoft Ignite 2021 － Publickey https://www.publickey1.jp/blog/21/rpapower_automate_desktop_for_windows_10microsoft_ignite_2021.html GitHub security update: A bug related to handling of authenticated sessions | The GitHub Blog https://github.blog/2021-03-08-github-security-update-a-bug-related-to-hand...

【Live Coding】Next.jsでホームページ作ってみる（音声のみ） 27.02.2021 2:29:19

【Live Coding】Next.jsでホームページ作ってみる（音声のみ）

Browser built-in Dark Mode color scheme、WebAssembly Summit 2021、Apple Platform Security などについて 20.02.2021 1:49:37

CSS Variables を JavaScript から操作する | スマホ神 – JavaScript 受託開発 – http://smart.ataglance.jp/2016-06-02-manipulate-css-variables-from-javascript/ Browsers have a built-in Dark Mode color scheme https://twitter.com/bramus/status/1358093784001740801 color-scheme Demo https://color-scheme-demo.glitch.me/ Improving Progressive Web App offline support detection https://twitter.com/agektmr/stat...

Tailwind CSSが私には合わなかった理由, 「WebRTC」が正式な標準仕様に到達、WebTransport、App Tracking Transparency、FLoCなどについて 06.02.2021 2:29:45

【悲劇】初期不良系ユーチューバー、自作PCでとんでもないミスをやらかす。 - YouTube https://www.youtube.com/watch?v=czbWkGbujgM Tailwind CSSが私には合わなかった理由 | コリス https://coliss.com/articles/build-websites/operation/css/why-tailwind-css-is-not-for-me.html アクセシビリティを重視したオープンソースの新デザインシステムをOktaがローンチ | TechCrunch Japan https://jp.techcrunch.com/2021/02/05/202...

TypeScript 4.2 Beta、Chrome 88(CSS aspect-ratio)、ホワイトハウスのウェブサイト、WCAG 3.0、content-visibility: auto; とページ内リンク 23.01.2021 2:07:41

Announcing TypeScript 4.2 Beta | TypeScript <a href="https://devblogs.microsoft.com/typescript/announcing-typescript-4-2-beta/">https://devblogs.microsoft.com/typescript/announcing-typescript-4-2-beta/</a> New in Chrome 88 - Chrome Developers <a href="https://developer.chrome.com/blog/new-in-chrome-88/">https://dev...

State of JS 2020、Scroll-linked Animations、Web アプリの反応速度について 16.01.2021 2:09:51

24:00  State of JS 2020 1:31:20  CSS Scroll-Linked Animations State of JS 2020 https://2020.stateofjs.com/en-US/ Developer Roadmaps https://roadmap.sh/roadmaps 2021年版、フロントエンドとバックエンドのデベロッパーに必要なスキルやツールをまとめたロードマップ | コリス https://coliss.com/articles/build-websites/operation/developer-roadmaps-for-2021.html CSS Scroll-Linked Animations https://t...

React Server Components, レスポンシブデザインでデバイスごとのブレイクポイントをどこで切るか, content-fit, 明度７：１の法則などについて 09.01.2021 2:03:57

Introducing Zero-Bundle-Size React Server Components – React Blog https://reactjs.org/blog/2020/12/21/data-fetching-with-react-server-components.html レスポンシブデザインのブレイクポイントの細かすぎる新解釈 [2021最新版] - webのあれこれ https://hashimotosan.hatenablog.jp/entry/2020/12/06/182327 最新の手法でブラウザのタブに表示される「Favicon(ファビコン)」を作成するとこうなる - GIGAZINE https://giga...

Chrome Dev Summit Recap 2020, Houdini, Privacy Budget, Web Vitals, Nuxt Tailwind, Centering in CSS 19.12.2020 1:53:26

15:20 Chrome Dev Summit Recap 2020 1:15:25 Nuxt Tailwind v3.4.0 is out with the config viewer ✨ 1:23:40 Centering in CSS (CSSで要素を中央に配置する５つの方法) Google Developers Japan: Chrome Dev Summit Recap 2020を開催しました https://developers-jp.googleblog.com/2020/12/chrome-dev-summit-recap-2020-report.html Houdini.how https://houdini.how/ Introducing the Privacy Budget - YouTube https://www....

2020年はTailwindの年（The State of CSS）、SSRでDarkmode対応する方法、font-family: system-ui について、Github Universe 2020 12.12.2020 1:56:15

06:58 M1 Mac 23:25 2020年はTailwindの年 (The State of CSS 2020) 49:30 font-family: system-uiの挙動 1:21:30 input type="number" のハマりどころ 1:29:00 inactive-css 1:33:20 Github Universe 2020 1:43:10 GitHubで最も使われている言語はJavaScript　TypeScriptが急上昇でPHPは下落 New – Use Amazon EC2 Mac Instances to Build & Test macOS, iOS, iPadOS, tvOS, and watchOS Apps | AWS News Blog https://aws.am...

次世代画像形式 WebP2とAVIF、JavaScriptの奇妙な挙動（型が異なる値の比較など）、Chrome88で "_blank"時に"rel=noopener"不要に 28.11.2020 2:41:03

東京在住の@igtm, @tmr とニュージランド在住の@ymdarakeが、ゆるーくフロントエンド周りの気になった記事を紹介しながらお届けします 1:25 Manjaro Linux 25:55 スクラムガイド2020のアップデート 39:00 次世代画像形式のWebP2、AVIF 1:04:57 Tailwind CSS v2.0  1:43:55 JavaScriptの奇妙な挙動：Why Is {} > []?  2:20:10 「火曜日のお風呂」による、最強 font-family 2021年決定版（proposal v0.1） Manjaro - e...

Apple M1チップとソフト対応状況、Google Chrome 87正式版リリース、GridとFlexboxの違い、Font-Familyって結局何指定したらいいの？について 21.11.2020 3:04:22

16:45 Apple M1チップとソフト対応状況 46:20 Google Chrome 87正式版リリース 54:20 GridとFlexboxの違い 1:51:15 Font-Familyって結局何指定したらいいの？ Apple SiliconことM1チップ対応Chromeブラウザー、再び公開 - Engadget 日本版 https://japanese.engadget.com/apple-silicon-m1-chrome-re-release-062002736.html Docker社、Appleシリコン搭載Mac用の「Docker Desktop」を開発中と表明。Rosetta 2による変換では十分に...

Firebase Summit 2020, AppleM1チップ, オススメのChrome Extension, 最強のFont-familyについて 14.11.2020 2:12:29

9:55 Firebase Summit 2020 22:02 Apple M1 チップ Firebase Summit 2020のまとめと所感 https://nabettu.com/9359dcae953248e0b001046b0b49459c Apple、M1チップを発表 - Apple (日本) https://www.apple.com/jp/newsroom/2020/11/apple-unleashes-m1/ Adobe Apps Not Officially Supported on Apple Silicon Running Rosetta 2 https://petapixel.com/2020/11/13/adobe-apps-not-officially-supported-on-apple-silicon-running-...

Next.jsの状態管理、ReactのRecoilとFlutterのbinder、仮想スクロールとcontent-visibility、占星術、座禅、フルーツティー、サウンドセラピーなどについて 07.11.2020 2:14:15

Next.js の状態管理 2020 https://zenn.dev/takepepe/articles/state-manegement-in-nextjs-2020 Next.js 4年目の知見：SSRはもう古い、VercelにAPIサーバを置くな - Qiita https://qiita.com/jagaapple/items/faf125e28f8c2860269c Recoil https://recoiljs.org/ binder | Flutter Package https://pub.dev/packages/binder 週刊 Dart & Flutter インプット 43. 毎週金曜日に、@ntaoo がインプットした Dart & Flutter… | by ntao...

ブラウザがbold,italicなFontを自動で作っちゃう件（@font-face）,プロポーショナルメトリクス,自動カーニング,Web Assembly(Rust), Next.js 10 31.10.2020 1:09:26

yewstack/yew: Rust / Wasm framework for building client web apps https://github.com/yewstack/yew React v17.0 – React Blog https://reactjs.org/blog/2020/10/20/react-v17.html Blog - Next.js 10 | Next.js https://nextjs.org/blog/next-10 Say No to Faux Bold – A List Apart https://alistapart.com/article/say-no-to-faux-bold/ Web フォントを使うときの注意点 https://gyo.gitlab.io/ui-alm/web-font/ 【真夜中の...

Webpack 5、iPhone 12、ドバイのバーチャル・ワーキング・プログラム、AgriTech、カーソルブラウジングとF7、占星術の使い方、自作PCのその後、などについて 17.10.2020 1:51:16

Webpack 5 release (2020-10-10) | webpack https://webpack.js.org/blog/2020-10-10-webpack-5-release/ evanw/esbuild: An extremely fast JavaScript bundler and minifier https://github.com/evanw/esbuild iPhone 12とiPhone 12 mini - Apple（日本） https://www.apple.com/jp/iphone-12/ Google Pixel スマートフォン - Google ストア https://store.google.com/jp/magazine/compare_pixel ドバイに移住しリモート環境で働...

自作PC紹介、竜王戦と将棋ソフト、スクロールアンカリング、Chrome 86、CSS in JS、Flash終了、について 10.10.2020 2:11:15

00:05:20 自作PC 00:53:00 将棋ソフト・竜王戦第一局 01:20:10 Chromeのバージョン84以降で「もっと見る」の挙動が変な件 01:35:10 New in Chrome 86 01:47:10 CSS in JS/Shadow DOM 02:03:50 Flashゲーム GPU：GeForce RTX 3080 https://amzn.to/2GSugMx CPU：Ryzen 9 RTX 3900X https://amzn.to/2SJuNTI マザーボード：X570 STEEL LEGEND https://amzn.to/3lpphBM CPUクーラー：NH-U12a https://kakaku.com/item/K0001152530/ 電...

NoCodeツール、神戸市の副業人材公募、Google Pixel 5、imgタグ decoding="async、.comドメイン、自作PCについて 03.10.2020 2:10:38

TikTok ダウンロード禁止一時的に差し止める命令米裁判所 | アメリカ大統領選 | NHKニュース https://www3.nhk.or.jp/news/html/20200928/k10012637931000.html YouTubeがTikTok似のショートビデオ機能「YouTube Shorts」を搭載、まずはインドで提供 https://jp.techcrunch.com/2020/09/15/2020-09-14-youtube-launches-its-tiktok-rival-youtube-shorts-initially-in-india/ 優良運転講習オンラインで　行政デジタル化、試行へ...

Vue.js 3.0、React17-rc、Typescript4.1-beta、ts-sql、占星学、自作PCについて 26.09.2020 2:29:19

00:01:40 Vue.js 3.0 00:49:07 React 17-rc 01:21:21 TypeScript 4.1-beta 01:56:59 占星学 02:18:30 自作PC Release v3.0.0 One Piece · vuejs/vue-next https://github.com/vuejs/vue-next/releases/tag/v3.0.0 Vue's Darkest Day - DEV https://dev.to/danielelkington/vue-s-darkest-day-3fgh Vue 3 – A roundup of infos about the new version of Vue.js - Made with Vue.js https://madewithvuejs.com/blog/vue-3-roundup A...

「ISUCON10で惨敗」「Moment.jsの幕引き」「iOS14, Safari14」「ドコモ口座」などについて 19.09.2020 1:21:44

ISUCON10 まとめ : ISUCON公式Blog http://isucon.net/archives/54704557.html Moment.js | Docs https://momentjs.com/docs/#/-project-status/ Intl - JavaScript | MDN https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Intl Temporal documentation https://tc39.es/proposal-temporal/docs/index.html iOS14で大きく進化 iPhoneの標準ブラウザ「Safari」変更点10個 - ライブドアニュース http...

「新疑似クラス :focus-visible について」「Typescript: Template string types and mapped type 'as' clauses」「色覚に配慮した UI 設計」「Apple、IDFA許可制を 2021 年に延期」「GitHub Container Registry」「言語と行為」などについて 05.09.2020 1:51:18

ロシアにて OS とマーケットを分離する法案提出。App Store や Google Play など手数料上限 20%、外部アプリストアの自由化案が盛り込まれる http://www.gamecast-blog.com/archives/65968502.html Apple 曰く、ペアレンタルコントロールアプリの削除理由は「MDM と呼ばれる高度に侵入する技術」の使用 | スラドデベロッパー https://developers.srad.jp/story/19/05/02/0455217/ アップル、ターゲティング広告を制限する「iOS」...

パッケージマネージャーpnpm、GitHub Default Branch「main」、Vue.js 3、Google Chrome 85正式版リリース、言語と行為について 29.08.2020 1:31:11

パッケージマネージャーpnpm、GitHub Default Branch「main」、Vue.js 3、Google Chrome 85正式版リリース、言語と行為について話しました - 中国が国内用のGitHubとして代替サービス「Gitee」を構築中 | TechCrunch Japan https://jp.techcrunch.com/2020/08/22/2020-08-21-china-is-building-its-github-alternative-gitee/ - ziglang/zig: General-purpose programming language and toolchain for maintaining robust, optimal...

Airbnbのts-migrate、フォートナイトの開発者アカウント停止通告、占星術などについて 22.08.2020 1:48:31

Airbnbのts-migrate、フォートナイトの開発者アカウント停止通告、占星術などについて話しました -  Apple、8月28日までに『フォートナイト』を正しい状態で復帰させなければEpic Games開発者アカウント停止を通告。実施されればUnreal EngineのAppleプラットフォーム提供が困難に http://www.gamecast-blog.com/archives/65967747.html -「フォートナイト」、App Storeに続きGoogle Playストアからも削除 - ITmedia NEWS htt...

Rome Frontend Toolchain, Node v14.8 Top Level Async/Await, グラフ理論, 政治学, 現代貨幣理論などについて 15.08.2020 1:28:40

Rome Frontend Toolchain, Node v14.8 Top Level Async/Await, グラフ理論, 政治学, 現代貨幣理論などについて話しました - ローソンPB新パッケージの「わかりにくすぎる」という問題　ユニバーサルデザインの専門家に訊く - wzzy｜ウェジhttps://wezz-y.com/archives/77514 - Rome Frontend Toolchain https://romefrontend.dev/#getting-started - Node v14.8 Top Level Async/Await now available https://itnext.io/node-js-sc...