Dan氏によるCreate React Appの将来、およびReactとフレームワークの関係性についてのコメントの翻訳
Create React App(以下「CRA」という)の将来、およびReactとフレームワークの関係性についてDan氏がGitHubのIssueのコメントで語った内容の翻訳です。非常に長いコメントですが、Reactユーザーであれば一読に値する内容だと思ったので翻訳してみました。参考になれば幸いです。 原文 翻訳 みなさん、こんにちは。 CRAの現状については以前から痛いほどわかっており、それに対処するための提案に取り組んでいるところです。このプルリクエストは議論を始めることを目的にしていたので、私たちがCRAの将来について考えているいくつかの背景を説明する良い機会だと思います。私たちが考慮している理由とトレードオフについて明確にしたいので、いくつかのセクションからなる長いコメントになりそうです。もし全てを読む気になれないなら、最後のセクションまでスクロールして私たちが提案する今後の方法を
最近のフロントエンドフレームワークに対する認識とお気持ちの整理 - console.lealog();
久しぶりに、いわゆるポエムを。 新規・運用ヘルプを問わず、受託や副業でよくフロントエンドをやってるWeb屋の見解、そして手札のお悩み。 この先、また技術選定する際なんかにも参考になるかと思ったので。 React 「いまフロントエンドやるなら最初に覚えるべき！」は、もう過去の話かなーと個人的には思ってる。 Reactは`UI = fn(state)`なのが良い！とか言われるけど、あなたが必要としてるのは`UI = Component(props)`かもよって。 一昔前までは、たしかにあらゆる面で頭一つ抜けてる印象はあったけど、今はそうでもないか、その差はだいぶ埋まってきてると思ってる。（もちろん先行者利益みたいなところで、エコシステムはまだまだ優位な差があるかもしれんけど、それもあまり実感できたことはないし、いまからはじめる人はそんなんで困らんやろうし） 原初の時代からReactな案件をそれ
[Twitter] React ユーザーが Vue を選ばない理由
概要 本記事は、 Vue.js コアチームメンバーである @antfu7 氏の以下ツイートに対する回答を個人的にまとめたものです。 React ユーザーの皆さん、 好奇心で聞くのですが、Vue を使ったり試したりするのを妨げているブロッカーや欠点は何ですか？ 注意事項 対立煽りっぽいタイトルにはなっていますが、個人的な好奇心がモチベーションとなっており、特定の技術を贔屓、批判する意図はありません。 私自身は長らく Vue を愛用しており、業務でも大規模 Vue アプリのメンテに携わっている一方で、React は小規模プロジェクトや個人開発でしか利用していません。そのため、理解度に差がある状態であるため、改めて Vue と React の対比やそれぞれの良さを実感したいと思い、一通りのツイートに目を通した次第です。 また、 Vue.js の生みの親である Evan You氏が以下のようにツイ
![[Twitter] React ユーザーが Vue を選ばない理由](https://cdn-ak-scissors.b.st-hatena.com/image/square/050cb810e4b79fc48a4bc3fe8753540d585f1720/height=288;version=1;width=512/https%3A%2F%2Fres.cloudinary.com%2Fzenn%2Fimage%2Fupload%2Fs--QTloU7Jr--%2Fc_fit%252Cg_north_west%252Cl_text%3Anotosansjp-medium.otf_55%3A%25255BTwitter%25255D%252520React%252520%2525E3%252583%2525A6%2525E3%252583%2525BC%2525E3%252582%2525B6%2525E3%252583%2525BC%2525E3%252581%25258C%252520Vue%252520%2525E3%252582%252592%2525E9%252581%2525B8%2525E3%252581%2525B0%2525E3%252581%2525AA%2525E3%252581%252584%2525E7%252590%252586%2525E7%252594%2525B1%252Cw_1010%252Cx_90%252Cy_100%2Fg_south_west%252Cl_text%3Anotosansjp-medium.otf_37%3Ashingo.sasaki%252Cx_203%252Cy_121%2Fg_south_west%252Ch_90%252Cl_fetch%3AaHR0cHM6Ly9zdG9yYWdlLmdvb2dsZWFwaXMuY29tL3plbm4tdXNlci11cGxvYWQvYXZhdGFyLzg0NWZhNzViYTguanBlZw%3D%3D%252Cr_max%252Cw_90%252Cx_87%252Cy_95%2Fv1627283836%2Fdefault%2Fog-base-w1200-v2.png)
Reactの今まであまり触れてこなかった機能について試したことのまとめ
react18.2で検証 createPortal 以下はドキュメントの引用 ポータル (portal) は、親コンポーネントの DOM 階層外にある DOM ノードに対して子コンポーネントをレンダーするための公式の仕組みを提供します。 ポータルを使うと<div id="app">以下に書かれた<Modal>コンポーネントがDOM上では<div id="portal">以下にレンダリングされる。ただし、イベントは<div id="app">にバブリング(子要素で発生したイベントが親要素に伝搬)する。 import { FC, useState, ReactNode, useEffect } from "react"; import { createPortal } from "react-dom"; const Modal: FC<{ children: ReactNode }> = ({
実装例から見る React のテストの書き方 - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは！フロントエンドエキスパートチームの@nus3_です。 kintone のフロントエンド刷新プロジェクト（フロリア）では、品質を保ったまま開発を加速させるためにフロントエンドのテストを積極的に行っています。 今回はそんなフロントエンドのテストの実装例をいくつか紹介します。この記事がフロントエンドのテストを行う上での参考になれば幸いです。 テストに使用する主なパッケージ コンポーネントのテスト 補足: Testing Library の記法をチェックしてくれるeslint-plugin-testing-library カスタムフックのテスト 補足: React v18 では @testing-library/react の renderHook を使う 参考リンク 色々なテスト事例 setTimeout を使うコンポーネントのテスト 補足: Storybook の story を使
書評『TypeScriptとReact/Next.jsでつくる 実践Webアプリケーション開発』 - uhyo/blog
皆さんこんにちは。今回は、2022年7月25発売の『TypeScriptとReact/Next.jsでつくる 実践Webアプリケーション開発』を読み終わったので、書評という形で感想と紹介を述べたいと思います。筆者はもともと技術書を読まず「ネットでいいやん」派だったのですが、このたびTypeScript入門書を出版したこともあり、それを過去の話として葬り去るべく技術書を読んでいくことにしました。せっかくなので、読んだ技術書の感想等を紹介します。 おことわり: この記事では、「筆者」とはこの書評を書いた人を指し、『TypeScriptとReact/Next.jsでつくる 実践Webアプリケーション開発』を書いた人たちのことは「著者ら」と呼びます。また、この記事の内容はすべて筆者の個人的な見解であり、本の内容や本を読んで得られる知識について何らかの保証をするものではありません。 筆者について筆者
1年以上にわたる初めての技術書の商業執筆活動を終えての感想と今後挑戦したいという方へ -TypeScriptとReact/Next.jsでつくる実践Webアプリケーション開発 -｜たまにゃん📘 Next.js実践本7/25発売
1年以上にわたる初めての技術書の商業執筆活動を終えての感想と今後挑戦したいという方へ -TypeScriptとReact/Next.jsでつくる実践Webアプリケーション開発 - 2022年7月25日より「TypeScriptとReact/Next.jsでつくる実践Webアプリケーション開発」が技術評論社より発売されました。3人の著者（@tejitak, @Kourin1996, @tamanyan55）、編集者（@nodawep）、レビュワーの方々が1年以上にわたり執筆に携わった本で紆余曲折しながらもゴールした技術書となっています。本を手にとっていただいた皆様のおかげで非常に好調な滑り出しとなり、早くも増刷が決定となりました。Amazonでの評価もよくソフトウェア開発・言語のカテゴリーで1位を取ることができました。 私自身初めての商業執筆という事で勝手が分からないながらも最後までやり遂げ
【入門】フロントエンドのテスト手法まとめ - Qiita
はじめに 自分は2021年に新卒でweb系の開発会社にフロントエンジニアとして入社し2022年で2年目になります。 実務ではReact×TypeScriptを利用したフロント周りの開発をメインで行なっていなす。 今回は実務でNext.jsプロジェクトにテストを導入することになり「React-Testing-Library」と「Jest」について改めて学び直したのでその内容を紹介します。 はじめに「React-Testing-Library」と「Jest」の概要を説明しその上で具体的なテストコードを何パターンか書いていきます。 この記事の対象者 フロントエンドのテストの概要を知りたい人 React-Testing-LibraryとJestについて知りたい人 具体的なテストの書き方を学びたい人 なお本記事では、React-Testing-Libraryの具体的な書き方についてをメインにしている
ゆめみのフロントエンドコーディング試験の題材で React の勉強をしました - Mitsuyuki.Shiiba
ちょっと前にツイッターで見かけた、ゆめみのフロントエンドコーディング試験 フロントエンドコーディング試験 「RESAS API を使用して、都道府県別の総人口推移グラフを表示するSPAを作る」っていうお題 React の勉強をするのにちょうどいい題材だなぁって思ったのでやってみた。課題を公開してるってことは「やってみてもいいよ」ってことかなと思ってるんだけど、もし違ったら GitHub のリポジトリーを private にするので連絡ください 1週間でやらないといけないところを2ヶ月近くやってるし、コミットログも特に何も考えずにポイポイ書いたから、全然だめなんだけど、でも、色々勉強になったので、とてもよかった。楽しかったー！ つくったもの こんな感じ これでおわりにするー pic.twitter.com/K8zhrRUp54— Mitsuyuki Shiiba (@bufferings)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
https://x.com/uhyo_/status/1800017146912948259?s=12&t=suYC6B2IhN7jv0qU5zDxmQ
React 19を概念から理解する
https://x.com/mizchi/status/1784225465559093754?s=12&t=suYC6B2IhN7jv0qU5zDxmQ
JavaScript is not available.
https://x.com/horikawatokiya/status/1704852004777206206?s=12&t=suYC6B2IhN7jv0qU5zDxmQ
https://twitter.com/q42_engineer/status/1642837396957048832?s=12&t=suYC6B2IhN7jv0qU5zDxmQ
https://twitter.com/uhyo_/status/1640297664154828800?s=12&t=suYC6B2IhN7jv0qU5zDxmQ
https://twitter.com/okunokentaro/status/1640237080755458049?s=12&t=suYC6B2IhN7jv0qU5zDxmQ
池田 泰延 on Twitter: "Reactを扱うフロントエンドエンジニアにとって良い記事。 コンポーネントをアロー関数式で宣言するか、function関数宣言で行うか。 スタイルガイドでもfunction関数宣言が推奨されていたり、速度面の(わずかな)優位差… https://t.co/5MtpBFjRln"
https://twitter.com/HNTweets/status/1576232988647514112
Reactコンポーネントにおけるテスト手法の選択肢
