Daiki Urata
Table of Contents
はじめに
みなさんこんにちは、チーム「Flair」の浦田です。 「Fusicフロントエンド座談会」は、Fusicのフロントエンドエンジニアが、チーム内で気になった記事や技術情報を共有し、ちょっとだけ深ぼりしていく会です。
前回から2ヶ月ほど空いてしまい、話題がたくさん溜まってしまったので、今回コメントは控えめでサクッとご紹介していければと思います!
前回の記事
Fusicフロントエンド座談会 2024/10/09
「Fusicフロントエンド座談会」は、Fusicのフロントエンドエンジニアが集まって気になった記事や技術情報を共有し、ちょっとだけ深ぼりしていく会です。
UI/UX
ダッシュボードづくりの教科書
x.com
- Fusicでは管理画面とかよく作るので良さそう
作図ツール自作記事
そして世界に作図ツールがまたひとつ
- draw.ioのようなものを自作している記事
- yjsを使ってCRDT(コンフリクトしないデータ)を実現している
第1回『モバイルアプリアクセシビリティ入門』公開読書会
第1回『モバイルアプリアクセシビリティ入門』公開読書会 (2024/12/03 13:00〜)
新刊書籍『モバイルアプリアクセシビリティ入門』をみんなで読み、感想を共有したり、質疑応答をしていく定期的な読書会を開催します! 書籍を通して、モバイルアプリのアクセシビリティ向上の基礎となる知識や考え方を身につけましょう! * * * ## 今回の対象範囲 今回は以下を実施してください。 ※会の進め方やドキュメントについては後述します。 * 会の開催までに、書籍を入手する * 会の開催までに、「はじめに」および「第1章 モバイルアプリのアクセシビリティとは」の「1.1 アクセシビリティとは」までを読み進める * 会の開催までに、ドキュメントに感想や質問を記載する ...
ランタイム/プログラミング言語
Deno2
Announcing Deno 2
Our next major version of Deno combines the simplicity, security, and performance of Deno 1 with full Node and npm backwards compatibility, and much more.
- package.jsonやnode_modulesサポートなどNode.js互換になった
- LTSが出たので、企業でも使うところが増えそう!?
- 今日(12/4)時点では2.1が出てる模様
Node.js 23
Node.js 23 Now Available | OpenJS Foundation
- v22がLTSとなる
- ESMがデフォルト有効になる
TypeScript 5.7
Announcing TypeScript 5.7 - TypeScript
Today we excited to announce the availability of TypeScript 5.7! If you’re not familiar with TypeScript, it’s a language that builds on JavaScript by adding syntax for type declarations and annotations. This syntax can be used by the TypeScript compiler to type-check our code, and it can also be erased to emit clean, idiomatic JavaScript […]
React
Next.js 15
Next.js 15
Next.js 15 introduces React 19 support, caching improvements, a stable release for Turbopack in development, new APIs, and more.
- Amplify Gen2が対応中っぽいので、Amplify案件ではちょっと様子見だけどそろそろ使えそう
Next.jsのOrganizationがGitHubに登場
Next.js
Next.js has 10 repositories available. Follow their code on GitHub.
- Vercel以外のデプロイサンプルコード(Render/Railway/Google Cloud Runなど)が置かれている
Next.jsのuse cache
ディレクティブ
Our Journey with Caching
Learn about our journey with caching in Next.js App Router.
use cache
ディレクティブが出てきて、ページ単位でキャッシュ制御ができるようになるかも
Next.jsのセキュリティ
Next.js App Router セキュリティ
- Next.jsのセキュリティで気をつけるポイントがまとまっている
小規模プロダクトにおけるReact状態管理ライブラリ選定
小規模プロダクトにおける React 状態管理ライブラリ選定 in 2024 - バイセル Tech Blog
はじめに こんにちは! テクノロジー戦略本部24年新卒の高橋です。 2023年の10月から内定者インターンを経験し、現在は開発3部CRMチームでフロントエンド(以後、FE)エンジニアとして働いております。 チーム内でFEの状態管理ライブラリを選定する機会があり、調査していく中で得た知見を共有したく、執筆に至りました。 少しでも状態管理ライブラリの選定に困っているFEエンジニアの参考になればと考えています。 はじめに 概要 前提 課題感 Context APIの思想とのズレ Context APIの記述量の多さ 状態管理ライブラリに求める要素 小さい単位で取り扱い可能 ボイラーテンプレートが少な…
-
自分がなんとなく小規模プロジェクトではJotaiが良いかなと思っていて、それがいい感じに言語化されていた
-
最近は小規模ならContext API使わず、最初からJotaiを導入するようにしている
React Router v7(Remix)
React Router v7
React Router v7 brings all the great things you love from Remix back to React Router
- Remixと統合されたReact Router v7がリリースされた
- 今後はReact Routerをライブラリまたはフレームワークとして使用することができる
React Native/Expo
React Native 0.76
x.com
New Architecture is here · React Native
React Native 0.76 with the New Architecture by default is now available on npm!
- New Architectureがデフォルト有効になった
Expo SDK 52
Expo SDK 52 - Expo Changelog
Learn about the changes and how to upgrade
- React Native 0.76
- ここはまたいつものようにExpoキャッチアップ会を開催して詳しく見ていきます
Storybook 8.4
x.com
- ついにReact NativeでもStorybook8が使えるようになった
Expo Router RSC
Beta: Universal React Server Components in Expo Router
This is a developer preview of universal React Server Components. For the first time ever, you can use React Server Components & Server Actions in native apps.
x.com
- React Native + Expo RouterでReact Server Componentsが動くようになる
- これで
use server
/use dom
/use client
の3種類のコンポーネントが使える
Ubieが2024年にReact Nativeを選ぶ理由
Ubieが2024年にReact Nativeを選ぶ理由
- Fusicでも2020年からReact Native/Expoを採用していますが、CNGの恩恵をかなり受けていますので、これからもベットしていきたいですね!
Vue
Nuxt 3.14
- https://nuxt.com/blog/v3-14
- ビルドツールとしてrspackが採用されている
TSバックエンド
Honoを使ったSQLインジェクション解説記事
- https://zenn.dev/kaazzu/articles/138ac520c6d473
- SQLインジェクションの教材として良さそう
OpenAPIスキーマが生成できるHonoプラグイン
GitHub - rhinobase/hono-openapi: A plugin for Hono to generate OpenAPI Swagger documentation
A plugin for Hono to generate OpenAPI Swagger documentation - rhinobase/hono-openapi
- すでに同じような
@hono/zod-openapi
というものがあるが、hono-openapi
の方は純粋なzodスキーマで書けるし、ValibotやTypeBoxにも対応している
Prisma 6
Prisma 6: Better Performance, More Flexibility & Type-Safe SQL
Today, we are releasing Prisma v6! Since the last major version, we have been hard at work incorporating user feedback, making Prisma ORM faster and more flexible, and adding amazing features like type-safe raw SQL queries.
- v6の特徴としてパフォーマンスの向上やType-Safe SQLがある
その他
Chrome DevToolsのAIアシスタントパネル
- https://developer.chrome.com/docs/devtools/ai-assistance?hl=ja
- DevToolsでGeminiにレイアウトについてなど色々聞けるようになる
書籍「[作って学ぶ]ブラウザのしくみ」
- https://gihyo.jp/book/2024/978-4-297-14546-0
- シンプルなブラウザをRustで実装してみる
Playwrightを参考にブラウザ内テキスト検索を高速化する
Info.plistのMDItemKeywordsフィールド
x.com
mizchiさんによる 「LAPRAS 公開パフォーマンスチューニング 」調査編
【再-増枠】mizchiさんによる 「LAPRAS 公開パフォーマンスチューニング 」~調査編~ (2024/12/02 18:00〜)
# 当イベントのアーカイブは コチラ から見られます! ※参加枠について : オンラインイベントですので参加を希望される方の人数に応じて増枠していきますので、満席表示となっている場合でもそのままお申し込みください! # イベントについて mizchiさんによるWebフロントエンド・パフォーマンスチューニングのデモンストレーションイベントです。 外部から計測可能な情報のみでパフォーマンス調査を行いつつ、内部情報を知る人との対話を通じてボトルネックを特定するというプロセスを、実際に稼働しているサービス LAPRAS を対象に試し切りしていただきます。 mizchiさんの解説を見なが...
TS Kaigi 2025開催決定
x.com
- 今回は2日間と大規模になりました
Android 16 Preview
The First Developer Preview of Android 16
The first Developer Preview of Android 16 is available now, featuring faster API releases, new API level constants, an embedded photo picker and more.
書籍「詳解 Jetpack Compose 基礎から学ぶAndroidアプリの宣言的U」
x.com
「こちらをクリック」などのリンクがあるとLighthouseの減点対象に
x.com
- 使いがちなので気をつけたい