タグ React
人気順 5 users 10 users 50 users 500 users 1000 usersReact への依存を最小にするフロントエンド設計
2024/11/23
128 users
最小
依存
フロントエンド設計
JSConf JP 2024 での発表資料です 続きを読む
【React】知らなかったReact Developer Tools、20分で手軽に８つReact コンポーネントのデバッグテクニックをマスターする - Qiita
2024/11/13
199 users
Qiita
デバッグテクニック
Props
コンポーネント
前書き React Developer ToolsはReactの公式開発者ツールであり、日常的なコンポーネント開発において、属性やファイルの位置特定、propsのトラブルシューティングなど様々なシーンで重要な役割を果たしています。熟練したReact Developer Toolsの使用は日常の開発をより効率的にすることができます。 この記事では、Rea... 続きを読む
今Reactを使うならピュアなCSSをサポートするUIフレームワークやライブラリを選定するのがマルそうと思った話
2024/11/09
129 users
UIフレームワーク
ライブラリ
マル
最近個人開発でNext.jsの環境を立ち上げた際に、スタイリングをどうやってやろうかなと迷ったので初心に帰って最近のスタイリングについて調べ直してみました。結構面白かったので、記事にまとめることにしたので、よかったら読んでみてください。 本記事では以下に触れます。 React界隈におけるスタイリング方法の歴史... 続きを読む
【無料公開】560万円かけて開発したサービスのソースコード
2024/11/04
428 users
ソースコード
サービス
無料公開
TypeScript
両方
※月単価80万円を基準に、7ヶ月分の工数として560万円相当と換算しています。 最初に こんにちは！ 普段はIT企業でWebエンジニアとして働いています。 現在はフリーランスとして活動し、Ruby（Ruby on Rails）、TypeScript（Next.js, React）、Pythonなどを使って、フロントエンドとバックエンドの両方に携わっています。... 続きを読む
Reactのレンダリングとメモ化についてようやく理解したので書く - Qiita
2024/10/10
115 users
Qiita
Props
レンダリング
ユーティリティ関数
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? レンダリングとメモ化についてようやく理解したので書く なぜこの記事を書こうと思ったのか Reactを学び始めてから、props の渡し方、配列処理のメソッド、ユーティリティ関数の使... 続きを読む
Rules of React を経典に React を書いて心の安寧を保つべし - Qiita
2024/10/04
144 users
Qiita
安寧
hook
経典
パク
こんにちは、とまだです。 React は Hook の効果もあり、書けばとりあえず動いてくれるので楽しいですよね！！！！！！！ ただ、本当に正しいコードを書いているか不安になったことはありませんか？ React は自由度が高い分、書き方によってはバグが発生しやすかったり、パフォーマンスが低下することもあります。 （そ... 続きを読む
【完全版】これ1本でReactの基本がマスターできる！初心者チュートリアル！ - Qiita
2024/08/19
319 users
Qiita
フレームワーク
Sicut_study
完全版
はじめに Reactの人気はどんどん加速しています。これからフレームワークを学ぶならReactを選ぶのは賢い選択でしょう こんにちは、Watanabe Jin(@Sicut_study)です。 今回はReactをこれから学んでいこうと思っている方に向けて、初心者チュートリアルを作成しました。 このチュートリアルではReactを書く上で欠かせない... 続きを読む
【React】リッチテキストエディタ（Quill、Tiptap、Slate...）の考え方や前提知識
2024/08/13
234 users
Quill
リッチテキストエディタ
slate
既存
移行
概要 4年ほどProductionで使っていたリッチテキストエディタ（Quill on Nuxt.js v2）をTiptap on Next.jsに移行しました。 既存のQuillエディタの使い勝手をTiptapで再現しつつ、改善できるところは改善しつつ、既存の4年分のリッチテキストデータが正しく編集できるようにしなければいけませんでした。 本記事では移行... 続きを読む
React 研修 (2024)
2024/08/09
265 users
2024年度リクルート エンジニアコース新人研修の講義資料です 続きを読む
React / Remix への依存を最小にするフロントエンド設計 - 一休.com Developers Blog
2024/08/05
177 users
Remix
ＣＴＯ
恩田
最小
フロントエンド
CTO 室の恩田(@takashi_onda)です。 一休レストランのフロントエンドアーキテクトを担当しています。 Intro 一休レストランでは、以前ご紹介したようにフロントエンドで React / Remix を利用しています。 user-first.ikyu.co.jp 一方、設計方針としては、React / Remix への依存が最小になるように心掛けています。 今... 続きを読む
【2024年最新版】0からReactを勉強するならこのロードマップに従え！ - Qiita
2024/07/14
246 users
Qiita
Sicut_study
えん
プログラミング
去年
はじめに こんにちは@Sicut_study (Watanabe Jin)です。 去年の10月頃にReactのロードマップを投稿しておかげさまで1000いいねもすぐそこになりました そこから私自身も状況がかなり変わり、大好きなReactを使ってプログラミングを教えるスクールを運営しております。 エンジニアになりたい完全未経験の方や、すでにエン... 続きを読む
結局 useEffect はいつ使えばいいのか
2024/07/11
116 users
useEffect
タイミング
開発
目的
経験
useEffectはReactの中でも扱いの難しいフックとして知られています。Reactで開発を行う中でuseEffectを検討するタイミングや適切な使い方について悩んだ経験のある方も多いのではないでしょうか。 本記事では、useEffectの目的を把握し、どのような場合にuseEffectの使用を検討すべきかについて考えていきたいと思います... 続きを読む
React 19を概念から理解する
2024-05-29うひょさんに聞く！ React 19アップデートの勘所 #React19_Findy 続きを読む
「Bluesky」「Python」「Vim」「404」「ぬるぽ」などIT関連のかわいい高品質ロゴを作りまくる人物現る、BlueskyやReact公式が早速ロゴを実装するなど爆発的な盛り上がり
2024/05/01
287 users
Bluesky
vim
GitHubリポジトリ
プログラマー
IT関連の高品質な自作ロゴを大量に含むGitHubリポジトリが、プログラマーやゆっくり実況者として活動するさわらつき氏によって公開されました。当該リポジトリは公開直後から大きな注目を集めており、すでにBlueskyでは「Kawaiiモード」の実装が進んでいるほか、Reactの公式サイトにもさわらつき氏のロゴを表示する隠し... 続きを読む
React のルール – React
2024/04/21
136 users
セクション
アプリケーション
概念
プログラミング言語
ルール
様々な概念を表現する方法がプログラミング言語によってそれぞれ異なるように、React にも、理解しやすい方法でパターンを表現し高品質なアプリケーションを産み出すための慣用的な記法、ないしルールが存在します。 このセクションでは、自然な React コードを書くために従うべきルールを説明します。自然な React コー... 続きを読む
Reactを使ってプロダクト開発している開発者だけでなく、マネージャにも読んでほしい「Fluent React」 - ROUTE06 Tech Blog
2024/03/25
250 users
マネージャ
フレームワーク
ライブラリ
プロダクト
技術選定
チームでReactを使って開発していると、コードレビューをする際に、「この書き方はしない方がいいが、それを説明するには800文字くらい必要。図も描きたい。でもそれらを準備する時間はない。」ということが度々ありました。 また、フレームワークやライブラリの技術選定をする際、マネージャに「どうして技術選定が必要... 続きを読む
【2024年】React, Tailwind CSSでメルカリクローンサイトを作ろう【入門】
2024/03/23
317 users
Tailwind CSS
入門
メルカリのクローンサイトを作りながら、React・Tailwind CSSが学べる本です。 続きを読む
Reactは悪い意味でも現在のjQueryだし、それを受け止めないと前に進めないということ
2024/03/18
166 users
jQuery
htmx
珠玉
CEO
エッセイ
HTMXのCEOに就任したので[1]、記念に記事を書きたいと思います。 HTMXサイトのエッセイ[2]はどれも珠玉の出来で評判ですが、それらを読んでもわかるとおり、HTMXは「Webはこうあるべき」という主義主張のあるライブラリです。その主義主張のかなり初歩的な前提を書きたいと思います。 Reactはなぜだめか、という話です。... 続きを読む
【2024年】React, TypeScript, Tailwind CSSでTodoアプリを作ろう
2024/03/12
130 users
TypeScript
ToDoアプリ
Todoアプリを作りながら、React, TypeScript, Tailwind CSSが学べる本です。 続きを読む
Reactはなぜそんなに人気なのか？翳りは訪れるのか？
2024/03/03
110 users
フレームワーク
好奇心
導入
実際
理由
導入 現在、ReactをはじめとするVueやSvelteなど多様なWebフロントエンドフレームワークが存在しますが、Reactが特に人気を博している理由について、単純な好奇心から自分なりに考察してみることにしました。 Reactの人気 Reactの人気の理由について考察するにあたり、まず、他のフレームワークと比較してReactが実際に... 続きを読む
新しい UI テストの手法を提供するテストライブラリ SafeTest
2024/02/25
100 users
angular
Jest
Svelte
playwright
新しい UI テストの手法を提供するテストライブラリ SafeTest 2024.02.25 SafeTest は Playwright と Jest/Vitest を組み合わせた UI テストライブラリです。特定のライブラリに依存せず、React, Vue, Angular, Svelte などのフレームワークに対応しています。SafeTest は単体テストと Playwright を使った E2E テストの... 続きを読む
フロントエンドを Vue.js から React にリプレイスしたお話 (前編) - NTT Communications Engineers' Blog
2024/02/18
125 users
Vue.js
フロントエンド
Blog
前編
はじめての方、はじめまして。久しぶりの方、お久しぶりです。 イノベーションセンターの何縫ねの。(@nenoMake)です。 普段の業務ではソフトウェアエンジニアとして Node-AI という WEB アプリケーションの開発をしています。 パブリックな活動としては、好きな言語である C# 関係の OSS 開発や技術ブログの投稿、登壇な... 続きを読む
コストをかけずにWebサービスを公開するための構成例 - Qiita
2024/01/21
140 users
Qiita
Heroku
PostgreSQL
コスト
構成例
はじめに 個人でフロントエンド(react)、バックエンド(node.js)、データベース(postgreSQL)を利用したWebサービスを公開したいと考えていました。 まずはテスト的に無料で外部公開できるサービスがないか調査しましたが、2022年8月に有料化されたHerokuの記事ばかりヒットしてしました。 結果的には無料で使用できる構成... 続きを読む
useEffect: 基礎から使用すべきでない例まで
2024/01/04
215 users
useEffect
effect
レンダリング
基礎
要素
はじめに useEffect について、きっちり調べようと思い調べてみた。公式ドキュメントのまとめ記事になっている。 useEffect 基礎編 useEffect とは Effect を用いるとレンダリングの後にコードを走らせることができ、React 外のシステムの要素と同期することが可能になる。 なぜ必要か まず、React コンポーネントの二種... 続きを読む
【TypeScript と友達に】Type Challenges を全問解いたのでエッセンスと推し問題を紹介してみる - 前編
2023/12/10
102 users
Flutter
TypeScript
モバイルアプリ
修士
はじめに 自己紹介 初めまして、@kakekakemiya と申します。 現在は東京大学大学院学際情報学府の修士 1 年で、フロントエンドエンジニアとして活動しています（25 卒の就活生です）。TypeScript × React × Next.js が主戦場ですが、Flutter でモバイルアプリを開発するときもあります。 今回は自分の TypeScript 力の向... 続きを読む