React Router v7でコードを書いてくれSonnet
Claude 3.7 Sonnetに代表される現在の主力なコーディングモデルやソフトウェア開発タスクの自動化に利用されるLLMは、知識のカットオフにより2024年後半頃までにネット上に存在する情報をもとにしたソースコードしか書くことができない。例えばAnthropicのAPIを直接利用して確認すると、「React Routerの最新バージョンはv6です」と返答が来る。しかし、最新版はv7だ。v7.0.0はちょうどこの時期にリリースされたため境界にあり、つまりv7の実践的な知識はない。これに限らず、LLMの世界ではNext.jsはv14、Flaskはv2、Railsはv7と一世代遅れたバージョンを認識していることになっている。 これらのアップデートによって入った変更は、既存のソースコードに記述していればLLMが空気を読んで従う。加えて、ユーザーがカスタムルールとしてエディタ側で追加情報を設定
builder.ioでのLLMを使ったサービス開発の実際 - laiso
builder.ioのSteve Sewell(CEO)が書いた「まだChat Completions APIで消耗してるの？」というトーンの記事を読んだ builder.ioはQwikの開発元で知られるCMS SaaS(Qwikの話は出てこない) www.builder.io www.builder.io 記事はVisual CopilotというFigmaのデザインをReactコンポーネント等のコードに変換する機能の裏側について解説している 「FigmaをReactコンポーネントに変換！」だけだとプロ驚き屋アカウントに消費されて右から左に流れていきそうなニュースバリューだけど、昨今のLLMs App開発についての実践的なアーキテクチャの話とopinionatedなことが書かれているのが面白かったので紹介します この2つの記事で言いたいことは「ChatGPTというハンマーが万能過ぎてすべて
React Context を用いた簡易 Store
課題 redux を引っ張り出すと大仰になる。Context 下に共有ステートを持ってそこに setState できるだけでよい。 なので、次の 2 つを用意する 現在の state を参照する const appState = useAppState() 現在の state を更新する関数を返す const setAppState = useSetAppState() React.useState() と違って分割している理由は、主にパフォーマンス上の理由 大域な参照なので、可能な限りステートを参照したくない setState() の API は (prevState: State) => State も取れるので、状態更新用途に限ってはそもそも useAppState() せずに済むことが多い でも毎回書いてるけどボイラープレート感強い上に忘れるのでここにメモする 毎回書いてるボイラー
Next.js に対する Kent C. Dodds の批判と、Lee Robinson のアンサーの要約
Next.js に対する Kent C. Dodds の批判と、Lee Robinson のアンサーの要約 はじめに 10 月 26 日に Next.js Conf が開催されましたが、それと前後して Kent C. Dodds (以下 kentcdodds と呼びます) と Lee Robinson (以下 leerob と呼びます) がそれぞれ という記事を公開しました。前者はタイトルの通り、Testing Library の作者であり、Remix の共同創業者の一人でもある開発者兼教育者 kentcdodds が、Next.js を使わない理由について述べたものです。そして後者は、Vercel の VP of Developer Experience である leerob が、主に前者に対する反論を述べたものです。筆者は両方の記事を公開後すぐに面白く読み、そしてどちらにも頷けるところ
How React 18 Improves Application Performance - Vercel
Learn how concurrent features like Transitions, Suspense, and React Server Components improve application performance. React 18 has introduced concurrent features that fundamentally change the way React applications can be rendered. We'll explore how these latest features impact and improve your application's performance. First, let's take a small step back to understand the basics of long tasks a
GitHub - Shopify/remote-dom
Remote DOM lets you take a tree of DOM elements created in a sandboxed JavaScript environment, and render them to the DOM in a different JavaScript environment. This allows you to isolate potentially-untrusted code off the main thread, but still allow that code to render a controlled set of UI elements to the main page. The easiest way to use Remote DOM is to synchronize elements between a hidden
GitHub - vercel/swr: React Hooks for Data Fetching
SWR is a React Hooks library for data fetching. The name “SWR” is derived from stale-while-revalidate, a cache invalidation strategy popularized by HTTP RFC 5861. SWR first returns the data from cache (stale), then sends the request (revalidate), and finally comes with the up-to-date data again. With just one hook, you can significantly simplify the data fetching logic in your project. And it also
GitHub - typescript-cheatsheets/react: Cheatsheets for experienced React developers getting started with TypeScript
Cheatsheet for using React with TypeScript. Web docs | Contribute! | Ask! 👋 This repo is maintained by @eps1lon and @filiptammergard. We're so happy you want to try out React with TypeScript! If you see anything wrong or missing, please file an issue! 👍 | The Basic Cheatsheet is focused on helping React devs just start using TS in React apps Focus on opinionated best practices, copy+pastable exa
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Onlook – Cursor for Designers
GitHub - onlook-dev/onlook: The open source Cursor for Designers. Design directly in your live React app and publish your changes to code.
Next.js 13で開発方法はどう変わる？
Utopia
Figma to React Component | Figma
GitHub - contiamo/restful-react: A consistent, declarative way of interacting with RESTful backends, featuring code-generation from Swagger and OpenAPI specs 🔥
GitHub - remotion-dev/remotion: 🎥 Make videos programmatically with React
GitHub - pmndrs/jotai: 👻 Primitive and flexible state management for React
GitHub - uber/react-vis: Data Visualization Components
GitHub - maxchehab/phelia: ⚡ A reactive Slack application framework.
Learn to code with Scrimba
CodePushとReact Nativeで緊急OTAリリース！了解！
