First-class Support for TypeScript · React Native
With the release of 0.71, React Native is investing in the TypeScript experience with the following changes: New app template is TypeScript by default TypeScript declarations shipped with React Native React Native documentation is TypeScript First In this post we’ll cover what these changes mean for you as a TypeScript or Flow user. New App Template is TypeScript By Default Starting with 0.71, wh
Mixing It Up: Remix Joins Shopify to Push the Web Forward - Shopify
Mixing It Up: Remix Joins Shopify to Push the Web ForwardAt Shopify, the Remix open-source community has a strong sponsor and supporter that will enable the web framework to accelerate its roadmap. We are very excited to announce that the open-source web framework Remix and its team are joining Shopify. Why? The web is always evolving—and we’re entering a new era. First, we had the document web, a
「Remix」という哲学を学ぼう──学習コストを最小限に抑えるReactベースの注目フレームワークを解説！
対象読者 RemixがNext.jsなどとはどんなところが違うのか知りたいJavaScriptエンジニア WebブラウザとNode.jsという異なるランタイムをそれぞれキャッチアップするのが辛くなってきたエンジニア 前提環境 筆者の検証環境は以下の通りです。 macOS Monterey 12.5.1 Remix 1.7.1 Webフロントエンド技術の広がり Webブラウザ上で動くアプリケーション周辺のエンジニアリング分野は、JavaScriptの進化とともにサーバーサイドの責務から分離され、「Webフロントエンド」という名前で呼ばれることが多くなりました。この分野は、Webブラウザをランタイムとしてリッチなアプリケーションを効率良く開発し、ユーザーに良い体験を与えることを主な目的としていると、筆者は認識しています。 ここで着目したいのが、このWebフロントエンド分野においては「Webブラ
Turbopack: High-performance bundler for React Server Components and TypeScript codebases - Vercel
Vercel's mission is to provide the speed and reliability innovators need to create at the moment of inspiration. Last year, we focused on speeding up the way Next.js bundles your apps. Each time we moved from a JavaScript-based tool to a Rust-based one, we saw enormous improvements. We migrated away from Babel, which resulted in 17x faster transpilation. We replaced Terser, which resulted in 6x fa
Fastly で Next.js アプリケーションを実行 | Fastly
そして、Web ブラウザが http://localhost:3000/ にアクセスするようにします。 素晴らしいでしょう？大したことないように見えるかもしれませんが、これは本当によくできています。React を使用して完全な開発環境をセットアップできました。ただ単に pages/index.js にファイルを作成するだけで、Next.js サーバーによって React コンポーネントがレンダリングされ、その出力がブラウザに表示されたのです。 これで、React の機能をフルに活用できるようになりました。カスタムコンポーネントを作成することも、以前に作成したコンポーネントを使用することも、サードパーティのコンポーネントを読み込むこともできます。さらに、この pages/index.js ファイルを編集すると、変更内容がホットリロードされるため、開発中にブラウザ内で即時にフィードバックを得る
React Flow めっちゃいいぜ
はじめに 今回の記事の結論はタイトル通り『React Flowめっちゃいいぜ』です。 こんにちは。株式会社Red Frascoの根本(github: tkcel )と申します。普段はフロントエンドを主に担当することが多いです。 この前個人開発中に以下の壁にぶち当たりました。 React（Next）でぐりぐりできるフローチャートみたいなものを作るにはどうすればいいのか？ 描画系のサービスはcanvasで作る方がいいのか？DOMに落とし込む方がいいのか？ 同じような悩みを持っている方がたくさんいる気がする（？）のですが、なかなか日本語検索でヒットしないので、今回記事を書こうと思いました。 React Flowとは？ まずは、公式サイトからの翻訳から。 ノードベースのエディターとインタラクティブなダイアグラムを構築するための高度にカスタマイズ可能な React コンポーネント MIT ライセンス
Using Ultra, the new React web framework - LogRocket Blog
Table of Contents What is Ultra? Features of Ultra Ultra vs Aleph.js The drawbacks to using Ultra Getting started with Ultra Building components in Ultra Deploying an Ultra app In the world of frontend development, React is one of the most popular libraries for developing components for web applications. React v18 includes new features, such as concurrent rendering, and it supports SSR with React
React v18.0 – React
For React Native users, React 18 will ship in React Native with the New React Native Architecture. For more information, see the React Conf keynote here. What is Concurrent React? The most important addition in React 18 is something we hope you never have to think about: concurrency. We think this is largely true for application developers, though the story may be a bit more complicated for librar
Introducing Zero-Bundle-Size React Server Components – React Blog
This blog site has been archived. Go to react.dev/blog to see the recent posts. 2020 has been a long year. As it comes to an end we wanted to share a special Holiday Update on our research into zero-bundle-size React Server Components. To introduce React Server Components, we have prepared a talk and a demo. If you want, you can check them out during the holidays, or later when work picks back up
究極のReact向けルーターライブラリ「Rocon」を作った - uhyo/blog
こんにちは。先月くらいからReact向けのルーターライブラリ「Rocon」を作っていて、この度alphaリリースという形で公開まで漕ぎ着けたので宣伝します。 現在のところ、以下のURLでチュートリアルを読むことができます。 このチュートリアルサイトはRoconを用いて作られています。 Roconチュートリアル: https://rocon.uhyohyo.net/Roconの特徴は非常に型安全であることです。 何よりも型安全性・型周りの快適性を優先してAPIが設計されています。 当然、TypeScriptと一緒に使うことが前提です。 また、Roconはreact-router-domの代替となることを意図しています。 そのため、Roconを使うべきとき・使うべきでないときをまとめると以下のようになります。 Roconを使うべきとき: 今react-router-dom等を使ってSPAを作っ
TypeScript で書く React コンポーネントを基礎から理解する - Qiita
この記事は Recruit Engineers Advent Calendar 2019 の 23日目の記事です。 TypeScript のプロジェクトで React コンポーネントを書いていると、コンパイラに怒られることがたびたびあります。ネット上にあるサンプルコンポーネントが JavaScript で書かれていると、プロジェクトにもってきたときにコンパイルできないということはよくあるんじゃないでしょうか。any でコンパイラを黙らせることもできますが、せっかく TypeScript を使っているので、安全に解決したいよねってことでこのような記事を書きました。 型定義は @types/react@16.9.17 にしたがっています。目次をみて、この程度のことはもう知っているよという方は react-typescript-cheatsheet をみてください。React + TypeScr
🎊Reactの2種類の新フック「useTransition」と「useDeferredValue」を最速で理解する（プレビュー版） - Qiita
10月25日、Reactの新機能であるConcurrent Modeのプレビュー版が発表されました。この中には、Concurrent Modeの恩恵を得るために必要となる新しいAPIが含まれています。 これらのAPIの中心となるのが、Suspenseと2種類の新しいフックuseTransitionとuseDeferredValueです。この記事ではこの2種類のフックに焦点を当てて、これらが何をしてくれるのか、どのようにこれらが新しいのかを解説します。 要するに、Reactの公式ドキュメントを読んでまとめましたということです。特に、ガイドを一通り読んで理解しないとこれらのフックが何をしているのか理解しにくいため、最速で理解できるように要点をまとめ直しました。 なお、当該ドキュメントの最初にでかでかと書いてあるように、これらのAPIはまだプレビュー版であり、この記事に書いてあることからまったく
Introducing Concurrent Mode (Experimental) – React
Caution: This page is somewhat outdated and only exists for historical purposes. React 18 was released with support for concurrency. However, there is no “mode” anymore, and the new behavior is fully opt-in and only enabled when you use the new features. For up-to-date high-level information, refer to: React 18 Announcement Upgrading to React 18 React Conf 2021 Videos For details about concurrent
🎉React 16.8: 正式版となったReact Hooksを今さら総ざらいする - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 来たる 2 月 4 日、ついに React 16.8 の正式版がリリースされます。この React 16.8 には、アルファ版が公開されて以来常に React ユーザーたちの関心をほしいままにしてきたReact Hooksが正式版となって追加されます。 ※追記：アメリカ時間で 2 月 5 日になっても React 16.8 がリリースされませんでした。事前情報で 2 月 4 日と言ってたのに……。いつになったらリリースされるのかはよく分かりません。2 月 6 日に React 16.8 がリリースされました！ 熱心な React ユーザ
React-axe で React アプリケーションのアクセシビリティを向上させる | メルカリエンジニアリング
こんにちは、この 4 月にメルカリに新卒入社したフロントエンドエンジニアの @karszawa です。 この頃は Google I/O 2019 のキーノートでアクセシビリティが大きく取り上げられたり、Safari に Audit タブが追加されアクセシビリティに関する様々なテストできるようになったりと、フロントエンド界隈におけるアクセシビリティへの関心の高まりを感じます。 本記事では React アプリケーションのアクセシビリティをチェックするためのライブラリである React-axe と、その中心技術である axe-core を応用した様々なツールをご紹介します。 React-axe とは React-axe は React アプリケーションのアクセシビリティをチェックするためのツールです。チェックの結果は Chrome DevTools に表示され、開発中にアクセシビリティの問題に気
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
React Email
Lexical
React Native for Webのこれまでから読み解くReact GUIのこれから
CodeSandbox SSE Discontinued
hiroppy's site