タグ React Server Components
人気順 5 users 50 users 100 users 500 users 1000 usersEmotionからCSS Modulesへの移行！React Server ComponentsのCSS対応 - Findy Tech Blog
2024/09/09
23 users
Emotion
CSS Modules
代替ライブラリ
展望
こんにちは。エンジニアの佐藤(@t0m0h1r0x)です。 今回は、弊社で現在進めているEmotionからCSS Modulesへの移行について紹介します。 移行の背景、検討した代替ライブラリ、そして最終的な決定について話していきます。 移行の検討理由 代替ライブラリの検討 Panda CSS Pigment CSS CSS Modulesへの移行 今後の展望 ま... 続きを読む
React Server Components で時限式コンポーネントを作る - mizdra's blog
2024/08/27
14 users
mizdra's blog
Components
特定
普段
特定の時間になったらコンテンツをページに出したい、ということがあると思う。漫画サービスなら「ゴールデンウィーク限定！全話無料キャンペーン！」みたいなのとか。 普段の業務ではこうしたことを実現するために、時限式コンポーネントや、ScheduledComponent などと呼ばれるものを作ってる *1。 // components/Sched... 続きを読む
React Server Components の疑問を解き明かす
builderscon 2024 で発表した資料です。 --- React Server Component は、サーバーサイド上でレンダリングされる React コンポーネントです。React Server Component を用いると、コンポーネントの中から DB にアクセスしたり、フ… 続きを読む
Next.js App Router / React Server Components(RSC)を紐解いてみた - estie inside blog
2024/08/05
11 users
RSC
estie inside blog
デザインエンジニアの表(@HirokiOmote)です。 Next.jsでApp Routerがリリースされて、1年が過ぎました。 弊社では、@hiroppyさんを技術顧問に迎え、Frontendを中心とした長期的な技術選定にご協力いただきました。 本日は、そこで得た学びをご紹介したいと思います。 App Routerについて 2023年5月にNext.js 13.4がstabl... 続きを読む
React Server Componentsを理解したい
2024/06/27
74 users
RSC
React
アーキテクチャ
App Router
開発
はじめに App Router はこれまでの React や Pages Router による書き方と大きく異なります。これは、React Server Components（RSC） というアーキテクチャが導入され、開発の考え方が大きく変化したからです。そのため、App Router を理解するためには RSC の理解が必要になります。 しかし、私は RSC の理解に苦戦し... 続きを読む
Next.jsのApp Routerを学ぶ際、shadcn/uiが参考になったという話 - Qiita
2024/05/11
58 users
Qiita
shadcn
RSC
Reactコンポーネント
Next.jsのApp Routerを学ぶ際に、UIライブラリを探していたところ、shadcn/uiが参考になったので紹介します。 shadcn/uiは、フレームワークやライブラリではなく、コピペで利用できるReactコンポーネントのサンプル集という立ち位置になっています。Tailwind CSSでデザインされており、React Server Components(RSC)にも... 続きを読む
React Server Components を使うためのミニマムなフレームワーク Waku
2024/03/02
13 users
ミニマム
localhost
React
コンポーネント
http://localhost:3000/ にアクセスすると、Waku のデフォルトのページが表示されます。 React Server Components 冒頭で述べたように、Waku は React Server Components に対応しています。React Server Components は React の新しいパラダイムであり、サーバー上でのみ実行されるコンポーネントを提供します。サーバ... 続きを読む
Backend エンジニア視点からの GraphQL / GraphQL from a perspective of backend engineer
2024/02/08
103 users
GraphQL
companies
Rails
LayerX
"LayerX、スタディサプリ、SHEと考える GraphQLが向いている現場とは？運用実践LT" で登壇した資料です。 引用した資料 [Rails アプリに RESTful API のレールを敷いて生産性が大きく上がった話 | Wantedly Engineer Blog](https://www.wantedly.com/companies/wantedly/post_articles/85098) [React Server Components... 続きを読む
React Server Components と GraphQL のアナロジー
2023/12/25
65 users
アナロジー
RSC
GraphQL
App Router
案件
Next.js の App Router が安定版となり、React Server Components (以下 RSC) を実際に試す環境が整ってきた。 実際、今年はやれどこそこのプロダクトが Next.js を採用しただのやっぱり捨てだのといった話題が尽きなかったように思う。 かくいう自分自身も、今年は App Router の案件に取り組んで RSC と格闘する日々を... 続きを読む
React Server Components のテスト手法
2023/11/26
51 users
テスト手法
コンポーネント
Testing Library
React Server Components のテスト手法 2023.11.26 現代におけるコンポーネントのテストは Testing Library を用いてテストを行うことが一般的です。しかし、2023 年 11 月現在、Testing Library はまだ Server Components のテストを十分にサポートしていません。そのため、Server Components のテストを行うには、別... 続きを読む
GitHub - alvarlagerlof/rsc-parser: A parser for the React Server components when sent over the network
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. 続きを読む
React 18とSuspenseの基本 ─ フレームワークの選択やReact Server Componentsなど新しいベストプラクティスを学ぶ - エンジニアHub｜Webエンジニアのキャリアを考える！
2023/07/14
127 users
Suspense
群雄割拠
フレームワーク
エンジニアHub
エンジニアHub > 記事一覧 > React 18とSuspenseの基本 ─ フレームワークの選択やReact Server Componentsなど新しいベストプラクティスを学ぶ React 18とSuspenseの基本 ─ フレームワークの選択やReact Server Componentsなど新しいベストプラクティスを学ぶ 群雄割拠のフロントエンドフレームワーク界でも、一歩抜きん... 続きを読む
Next.jsから学ぶWebレンダリング ~React誕生以前からApp Router with RSCまでの流れ~
2023/06/14
140 users
why
箇条書き
How
What
RSC
最近話題のReact Server ComponentsやIslands Architectureが何を解決しようとしてるか知るまでの簡単なWebレンダリングの流れを記載しました。 社内勉強会のために作成した資料となるため箇条書きになっておりますが、なるべくHowやWhatではなくWhyやトレードオフを記述するようにしています。（読みにくい or 誤った記... 続きを読む
一言で理解するReact Server Components
この記事はReact公式の内容を翻訳・紹介するものではありません。筆者の解釈や理解を伝えるものであり、Reactの公式見解と一致しているとは限りません。あらかじめご了承ください。 皆さんこんにちは。最近Next.js 13.4がリリースされ、App Routerがstable扱いになりました。App RouterはReact Server Component (RSC) ... 続きを読む
React Server ComponentsとGraphQLは競合するか - cockscomblog?
2023/01/10
16 users
cockscomblog
GraphQL
RFC
重要度
魅力
Next.jsのapp directoryについて話していて、GraphQLを使う場面ではServer Componentsの魅力がいくらか落ちるよな、と思った。裏を返せば、Server Componentsが活用されるような時代ではGraphQLの重要度が下がるかもしれない。 現にServer ComponentsのRFCの「Credits and Prior Art」を見ると次のように書いてある。 Re... 続きを読む
React Server Componentsの仕組み：詳細ガイド | POSTD
2022/07/27
99 users
POSTD
RSC
React
バンドルサイズ
ビルダー
React Server Components（RSC）は、ページの読み込みパフォーマンスやバンドルサイズのほか、Reactアプリケーションの書き方に近い将来大きな影響を与えることになる、素晴らしい新機能です。 Plasmicでは、Reactのビジュアルビルダーを開発しており、Reactのパフォーマンスには大きな関心を持もっています。 当社のク... 続きを読む
(Next.js 12 コラム追加版)2021年からReactを始めるなら React Server Components 一択ではないか？
2021/10/28
29 users
React
おまえたち
SWC
ミドルウェア
コラ
さすが 約113億円を資金調達 したVercel。Rust製コンパイラ（swc）を採用してビルドを高速化したり、ミドルウェア（エッジ関数等）導入でIaaSらしいことをしたりと目が離せません。「おまえたちはフロントに集中しろ！それ以外は俺たちがやってやる」って感じでしょうか。 Next.js 12 について 先にNext12についてのコラ... 続きを読む
React Server Components 総まとめ
2021/02/11
75 users
コンポーネン
サーバーサイド
Reactコンポーネント
デモ
先日、React Server Componentsについてまとめる機会がありました。 この記事では、React Server Componentsの概要と、デモを触る中で感じたことについてご紹介します。 React Server Componentsとは React Server Componentsは、Reactコンポーネントをサーバーサイドでレンダーする新しい技術です。 一部のコンポーネン... 続きを読む
React Server Componentsは再びIsormorphicの夢を見るか - vtecx
2021/01/08
12 users
室見川“Web フロントエンド”の悲しみと明るい未来という記事を読みました。 これについては全く同感です。 next.js が vercel を提供して CDNからサーバーサイドでの処理までをワンストップに提供しているとか、 firebase がクライアントサイドでの SDK と Cloud Functions をなるべく一貫した体験で提供しようとしてい... 続きを読む
React Server Componentsに感じたフロントエンドの消失
2021/01/05
137 users
消失
フロントエンド
はじめに 新年早々に面白そうな記事を見つけました。ReactでのAPI呼出しを最適化するために「部分的にサーバサイドで実行するコンポーネントを作る」というもののようです。 あるいは去年の記事ですが気になってたものとしてBlitz.jsでReactベースのFWであるnext.jsに永続化層を持たせてRailsのようなFWにしようというア... 続きを読む
React Server Components はウェブ開発を変えるゲームチェンジングな技術である
2021/01/03
291 users
Facebook
React
ウェブ開発
激震
ツッコミ
去年末に Facebook の人達が出した React Server Components というものが、React 界隈に激震を及ぼしていますが、速報以外でこの技術について言及している国内のブログが見当たらないため、この記事で解説してみます。間違いや分かりづらい部分があればぜひツッコミをお願いします。 React Server Components は、ただ... 続きを読む
React界隈で話題になっている「React Server Components」についてまとめました！ | Developers.IO
2020/12/22
224 users
React界隈
Developers.IO
https
話題
React界隈で話題になっている「React Server Components」についてまとめました！ どうもReact大好きCX事業部の片岡です！ 今回はReact界隈で話題になっている「React Server Components」についての内容を意訳してみました。 元ネタ 話題になっているこちらの記事が元ネタです。 https://reactjs.org/blog/2020/12/21/d... 続きを読む