# フロントエンドTech Cafe

## 前半戦

### Chrome (伊藤)

- **v114** popover API
- https://developer.chrome.com/en/blog/introducing-popover-api/
- [MDN](https://developer.mozilla.org/ja/docs/Web/API/Popover_API)
- **v116** Document Picture-in-Picture API
- [Picture-in-Picture for any Element, not just \<video\>](https://developer.chrome.com/docs/web-platform/document-picture-in-picture/)
- **v113** HTTPヘッダ上書き
- https://blog.hog.as/entry/2023/05/11/181952
- **v111** View Transitions API
- https://developer.chrome.com/docs/web-platform/view-transitions/
- https://ics.media/entry/230510/
- **v118** LightHouse
- [11.0.0](https://github.com/GoogleChrome/lighthouse/releases/tag/v11.0.0)
- Chrome 118でリリース
- Node v16をサポートから削除
- **v116** [CSSでスムーズなアニメーションを実現する4つの新しい機能](https://coliss.com/articles/build-websites/operation/css/4-new-css-features-for-smooth-animations.html)

### TypeScript (田口)
- [5.1](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-5-1.html)
- [5.2](https://devblogs.microsoft.com/typescript/announcing-typescript-5-2/)
- using宣言の追加
- [解説記事](https://zenn.dev/ventus/articles/ts5_2-using-preview)
- [typescript-eslint v6](https://typescript-eslint.io/blog/announcing-typescript-eslint-v6/)
- [mosya<TC>](https://mosya.dev/type-challenges)
- [Type Challenges](https://github.com/type-challenges/type-challenges)の為の学習サイト
- https://zenn.dev/steelydylan/articles/mosyatc-development

---

## LT会:　テーマ「上半期でやったことを語るLT（個人開発/新しく触れたFE技術）」 (関)

### SuspenseとSWRについて（松浦さん）

React v18で追加になったSuspenseとVercel社から公開されているSWRのライブラリによってコンポーネントのあるべき姿が大きく変わりつつあります。SuspenseとSWRを駆使することで、何が変わっていくのかを紹介します！

### ChatGPT APIを使ってゲームレビューの要約アプリを作った話（斉藤さん）

ChatGPT API x Steam API x React x FramerMotionを使ってゲームのレビューアプリを作ったので紹介します！

---

## 後半戦 (伊藤)

### deno
- v1.33で[Deno KV](https://deno.com/kv)が正式にアナウンス
- 9/5に[Deno Deployでの利用がオープンベータ](https://deno.com/blog/kv-open-beta)に

### Astro
- [3.0](https://astro.build/blog/astro-3/)
- View Transitions APIをサポート
- https://developer.chrome.com/blog/astro-view-transitions/
- 画像、パフォーマンス、ビルドの最適化
- Vercelとの提携により、SSRの強化
- JSXのHMR安定化
- [Astro Studioの予告](https://studio.astro.build/)

### React
- Next.js
- [13.4](https://nextjs.org/blog/next-13-4)
- app router stabledになった
- server actionsがalpha版として追加
- Redwood
- [6.0.0](https://community.redwoodjs.com/t/redwood-v6-0-0-is-now-available/5165)
- viteがデフォルトに
- Suspenseのリファクタリングが行われ、RSCの対応が可能に
- useHooks
- 色々便利なhookを提供しているライブラリ
- https://usehooks.com/

### State of CSS 2023
- https://2023.stateofcss.com/ja-JP/
- OpenProps
- https://open-props.style/
- Panda CSS（初登場）
- https://panda-css.com/

### Prettier
- [3.0](https://prettier.io/blog/2023/07/05/3.0.0.html)
- メンテナの方の記事
- [Prettier 3.0 をリリースしました](https://sosukesuzuki.dev/posts/prettier-3.0/)
- [Prettier 3.0 に含まれる予定の変更を紹介します](https://sosukesuzuki.dev/advent/2022/12/)

### Bun
- [1.0](https://bun.sh/blog/bun-v1.0)
- [Youtubeリンク](https://www.youtube.com/watch?v=BsnCpESUEqM)

---

Vue
- [3.3](https://blog.vuejs.org/posts/vue-3-3)
- v-tokyo #18
- [Vue.jsエコシステムの動向](https://speakerdeck.com/kazupon/vue-dot-jsekosisutemudong-xiang-2023)
- Nuxt
- [3.7](https://nuxt.com/blog/v3-7)

Svelte
- 本体
- [4.0](https://github.com/sveltejs/svelte/releases/tag/svelte%404.0.0)
- 大きな変更はなく、v5.0へ向けたメンテナンスリリースがメイン

Angular
- 本体
- [16](https://blog.angular.io/angular-v16-is-here-4d7a28ec680d)
- Signalsをサポート
- [解説記事](https://qiita.com/tronicboy/items/00633a52c7814e7c8ad6)

- Storybook
- [7.0](https://storybook.js.org/blog/storybook-7-0/)
- Viteをファーストクラスサポート
- CSF3がデフォルトフォーマットに
- Vite、NextJS、SvelteKit等をゼロコンフィグでサポート
- [7.1](https://storybook.js.org/blog/storybook-7-1/)
- Tailwind、MUI、styled-components、Emotionをゼロコンフィグでサポート
- Figmaとパートナーシップを締結
- Node
- v16のEOLが2023/9/11
- v20がリリース
- LTSは2024/10/22から
- [変更内容](https://shisama.hatenablog.com/entry/2023/04/24/083000)
- [パフォーマンス比較](https://blog.rafaelgss.dev/state-of-nodejs-performance-2023)
- Qwik
- [1.0](https://www.builder.io/blog/qwik-v1)

- VanJS（初登場）
- https://vanjs.org/
- NestJS
- [10.0](https://trilon.io/blog/nestjs-10-is-now-available)
- swc（Rust製のTSコンパイラ）をサポート
- ECMA Script
- [2023の新機能](https://ics.media/entry/220610/)
- prisma
- [5.0](https://github.com/prisma/prisma/releases/tag/5.0.0)
- [解説記事](https://zenn.dev/monicle/articles/7046898b7a27fc)