タグ「React Hooks」 - はてブログ

タグ React Hooks

新着順人気順 5 users 10 users 50 users 100 users 500 users 1000 users

(1 - 23 / 23件)

React Hooks ライブラリ SWR 2.0で追加されたuseSWRMutationを使ってみた | DevelopersIO

2023/01/01 10 users DevelopersIO SWR Vercel エントリ北川

こんにちは。データアナリティクス事業本部サービスソリューション部の北川です。 SWRとは SWRは、データの取得や更新に便利なReact Hooksライブラリになります。Next.jsを開発していることでも有名な、Vercelが提供しています。 developersIOでも以下のエントリが投稿されています。少し前にSWR 2.0が発表されました... 続きを読む

アソビュー流、SWRの使い方。可読性・保守性の高いhooks活用法 - asoview! TECH BLOG

2022/12/08 10 users SWR asoview アソビュー REST API 保守性

はじめにアソビュー！ Advent Calendar 2022の8日目です。 2019年ごろから基本的にReact hooksを使用しており、REST APIを呼ぶ際も以前紹介したこちらのようにhooksベースで行っています。今回はその中でSWRに着目してご紹介したいと思います。tech.asoview.co.jp SWRとは？ SWRとはstale-while-revalidateの考えに基づ... 続きを読む

Reactで作るアナログ時計

2022/09/21 11 users React アナログ時計時計勉強メモ JavaScript

2022年9月21日 JavaScript, React 以前よりReactの勉強がてら、1時間を40分で区切った36時間時計というのをモクモクと作っています。その中でReact Hooksの使い方などを学んでいるので、今回はよくあるアナログ時計を作りながら勉強メモとして残しておきます。こんな感じのアナログ時計作ってみたよくある時計ですね！... 続きを読む

React HooksとVue Composition APIの比較

2022/08/15 10 users Vue Composition API 比較

概要 Vueの作者であるEvan You氏は、Vueのデフォルトバージョンが2022年2月7日以降3.x系に切り替わる事を開発者ブログにおいて発表しました。それに伴い、Vue2.x系の最後のマイナーバージョンであるVue2.7が2022年7月1日にリリースされ、こちらの LTS (long-term support)はリリースから18ヶ月であることから、Vue2.x系... 続きを読む

保守性の高いReact hooksコードの指針

2022/03/31 120 users Tips 指針 API 反面教師原則

前提本記事は保守性の高いReact hooksコードの指針を記述します。指針はtipsに近いものから原則に近いものまで雑多に含まれます。総じてReact hooksの標準的なAPIを上手く扱う方法が多めです。これらは保守性の低いコードを反面教師とした私的な経験則に基づきます。（思い出し次第随時追加していきます）ご留意くだ... 続きを読む

React Hooks と TypeScript で簡単 TODO アプリ

2021/04/27 10 users ToDo TypeScript アプリ

$ npx create-react-app todo --template typescript Need to install the following packages: create-react-app Ok to proceed? (y) Creating a new React app in C:\Users\qiita\Downloads\todo. Installing packages. This might take a couple of minutes. Installing react, react-dom, and react-scripts with cr... 続きを読む

React Hooksのみでドラッグ＆ドロップの並び替えを実装する

2021/04/01 22 users ドラッグ＆ドロップ

この記事について上記のようなドラッグ&ドロップを使った並び替えの処理を自作したは良いものの、使うことが無くなってしまったので、供養の意味を込めて、その時に得た知見をこの記事で共有したいと思います? 実装する条件この記事で実装する処理は以下の条件のもと実装してきます。サードパーティ製のライブラリを... 続きを読む

【React+TypeScript】Netflixのクローンを作るチュートリアル

2021/01/22 458 users クローン Netflix React+TypeScript

React+TypeScriptを使ったNetflixの映画一覧を表示するアプリケーションのチュートリアルです。学べる事 - ReactのFunctionComponent（関数コンポーネント）とTypeScriptの使用 - React Hooksによるstate管理 - TypeScriptで外部APIを扱い、非同期通信でデータを取得 - movie-trailerにyoutubeを組み込む - Firebaseで... 続きを読む

【Vue.js】Composition API時代の便利ライブラリ「VueUse」を使ってみた - Qiita

2020/06/20 134 users ロジック Composition API API Qiita

Vue Composition API によって Vue.js にも React Hooks のようなロジックの再利用性の高い開発体験がもたらされようとしています。しかし、まだ「Composition API の良さをわかっていない」という方や「Composition API をうまく利用した書き方がわからない」という方も多いかと思います。本記事では Composition API... 続きを読む

僕のフロントエンド技術に対するスタンス｜erukiti｜note

2020/06/05 178 users TypeScript erukiti ボロクソ Note 日頃

僕は日頃からReact Hooks + TypeScript 最高だの言ってますけど、実のところ、それらを超えるモノが登場したら一瞬で「React Hooksなんて過去の技術だよねー、#にゃーん（社会性フィルター）」とか「TypeScript？へなにそれ？過去の言語ですよね」とかボロクソに言ってる自信があります。僕にとっては技術はただの道具... 続きを読む

おまえはReact hooksを知っているか - Qiita

2019/09/16 213 users React おまえ Vue Qiita Pwa

よく来たな。おれは毎日すごい量のコードを書いているが、誰にも読ませる気はない。しかし今回はReact hooks という真の男のためのAPIを発見したのでいてもたってもいられずQIITAに記事を書くことにした。（この記事の文体は、逆噴射聡一郎先生のパロディです。）お前は毎日VUEだとかREACTだとかPWAだとかBBBFFだとか... 続きを読む

宣言的UIはReact Hooksで完成に至り、現代的設計論が必須の時代になる - Qiita

2019/09/06 383 users Qiita React angular パラダイムシフト現代

現代のGUI開発において、必須となった宣言的UIというパラダイムシフトがあります。宣言的UIは、Facebook社が開発したReactに端を発するものです。宣言的UIは既にウェブ開発のライバルであるVue.jsやAngularなどでも当たり前のように使われていますし、Android開発などにも使われています。 2019年6月はじめに開催された... 続きを読む

これからはじめるReact Hooks - Speaker Deck

2019/09/03 78 users Speaker Deck

All slide content and descriptions are owned by their creators. 続きを読む

React Hooks + Redux Hooks + TypeScript で SPA を構築する - 30歳からのプログラミング

2019/07/05 146 users TypeScript サンプルアプリ SPA プログラミング

タイトルに書いた組み合わせで SPA を作るときにどのような設計にするのか、現時点での考えを記録しておく。チュートリアルの次の一歩というか、現実的なアプリを構築する際の基本となる考え方。状態管理とどう向き合うかが、主要なテーマになっている。サンプルアプリ具体的なコードがないと話を進められないので、... 続きを読む

use-react-redux-context で redux 環境下で React Hooks を使う - Qiita

2019/03/01 17 users redux Qiita hooks useContext 余地

で使えます。が、 peer deps として react react-dom react-redux redux がいるので、今までの redux スタック全部盛りでもあります。これは何 ReactRedux connect を、Context API と useContext で置き換えようとしたものです。その過程でパフォーマンスチューニングする余地を大量に入れ込んでいます。 hooks で re... 続きを読む

React HooksとContextAPIでFluxをやってみる - コネヒト開発者ブログ

2019/02/26 46 users Flux コネヒト開発者ブログ

CTO室エンジニアの安達 (@dachi_023) です。React v16.8で待ちに待ったHooksが (20日前に) リリースされました。そんなHooksを使ってFluxやる時ってどうするんだろう？と思ったので調べて写経してみました。 reactjs.org 書いたコード create-react-app して出てきたものをいじって作りました。Flux化するまでに書いたコ... 続きを読む

実践: React Hooks - mizchi's blog

2019/02/08 320 users mizchi's blog 実践

hooks が発表されてから趣味でも現場でもずっと hooks を使っています。おかげでだいぶこなれてきて、だいたいなんのライフサイクルでも表現できるようになってきました。最初は単に useState が state を、 useEffect が componentDidMount/componentDidUpdate を置き換えるもの、と説明を済ますつもりでしたが、 useE... 続きを読む

ブログのReactを16.8にあげてReact Hooksで書き換えてみた - mottox2 blog

2019/02/07 44 users React alpha コンポーネントたくさん解説

2019/02/06にReact16.8がリリースされ、16.7のalphaから入っていたReact Hooksが安定版にやってきました。そこで今回このブログで使われているReactを16.8に上げて、ステートフルなコンポーネントをReact Hooksを使いFunction Compoenentに書き換えてみました。 React Hooksの解説をした記事はたくさんあると思うので、... 続きを読む

React 16.8: 正式版となったReact Hooksを今さら総ざらいする - Qiita

2019/02/04 104 users Qiita React 関心アルファ版正式版

来たる 2 月 4 日、ついに React 16.8 の正式版がリリースされます。この React 16.8 には、アルファ版が公開されて以来常に React ユーザーたちの関心をほしいままにしてきたReact Hooksが正式版となって追加されます。熱心な React ユーザーの方は、当然 React Hooks の情報を常に追っており正式版がリリースされたら... 続きを読む

React Hooks をどう使っていくか - mizchi's blog

2018/11/09 72 users mizchi's blog

大きく、末端コンポーネントと全体アーキテクチャの視点がある。末端コンポーネントでの Hooks ここはあまり議論の余地なく、setState で local state を持っているものや、 componentDidMount していたものを置き換えることが出来ると思う。 FC を class にせずにちょっとリッチにするのが簡単になる。 class の setSt... 続きを読む

(翻訳) React Hooks がどのように動いているか · GitHub

2018/11/01 51 users GitHub Magic hooks 挙動 API

how-hooks-work.md (翻訳) React Hooks がどのように動いているかこの記事は https://medium.com/@ryardley/react-hooks-not-magic-just-arrays-cd4f1857236e の日本語訳です。途中で力尽きて雑な翻訳になってる箇所がいくつかあります。どのように Hooks が動いているか私は、新しい Hooks の API の "magic" な挙動... 続きを読む

React Hooks での状態管理と副作用の表現 - mizchi's blog

2018/10/26 58 users mizchi's blog React 副作用表現 API

React Hooks は Stateless Functional Component でも setState 的な状態操作や componentDidMount のような操作を可能にするための仕様提案です。既に開発ブランチに入っていますが、現時点で公式に採用されたものではないです。リリース時にはAPIが変わる可能性があります。 React のメイン開発者の一人である sebma... 続きを読む

(1 - 23 / 23件)