【React Hooks入門】完全初心者OK!8種類のHooksを学んでReactの理解を深めよう

  Рет қаралды 65,268

Shin Coding Tutorial

Shin Coding Tutorial

Күн бұрын

#入門 #react #reacthooks #hooks #javascript #プログラミング #webアプリ開発 #web
【さらに詳しく学びたい方へ。Udemy90%割引クーポン発行中🚀】
↓↓↓↓↓
shincode.info/2...
\ShinCode_Camp開校しました/
プログラミング講座&副業・起業&就職・転職が学べるプラットフォーム🚀
🎁月額2500円で全講座が見放題
🎁分からない箇所は質問し放題
🎁7日間無料キャンペーン実施中
🎁コミュニティ機能付き
🎁いつでも解約可能etc...
↓↓↓↓↓
code-s-school-...
-----------------------------------------------------------------------------------------------------------------------------
【募集】Web開発/Webサイト制作を頼みたい方はこちらのリンクからお問い合わせください
↓↓↓↓↓
worldhacks.co.jp/
\Webスキルが付いたらWebエンジニアに挑戦してみよう/
私が実際にWebのお仕事を頂いている会社で働いてみよう🚀
応募は下記リンクから

www.wantedly.c...
✅Webエンジニア未経験でもOK
✅フルリモートだから自由な場所で働ける
✅ポテンシャル採用
✅モダンな技術スタックで開発できる
✅面接で不合格でも「なぜダメだったのか」の理由がきちんと聞ける
✅会社公式HPはこちら → worldhacks.co.jp/
上記記載のWebベンチャー社長と繋がってみたい方はTwitterを載せておきます。
WorlsHacks社長ツイッター : / kairi_morishita
WorldHacks公式ツイッター : / worldhacks_inc
-----------------------------------------------------------------------------------------------------------------------------
【この動画を視聴するメリット】
・Reactの基礎が理解できる
・React Hooks8種類が学べる
・useState/useEffect/useContext/useRef/useReducer/useMemo
/useCallback/Custom Hooks(カスタムフック)
・Reactのパフォーマンスチューニングが学べる
【信頼性】
・Udemy講師
・講師レビュー評価94.6%
・Udemy受講生延べ2500人突破
・Webアプリ/サイト開発数:200以上
・生きがい:プログラミングでサイトやアプリを作ること
useState: 3:01
useEffect: 9:18
useContext: 14:18
useRef: 21:13
useReducer: 24:27
useMemo: 31:36
useCallback: 45:25
カスタムhook: 50:42
★チャンネル登録はこちらから★
/ @programming_tutorial_...
★今回のソースコード★
github.com/Shi...
★運営者SNS★
Twitter: / shin_engineer
★この動画で使用している機材★
キーボード(Keychron K6 赤軸):amzn.to/3F4zca5
マウス(Logicool G ロジクール G ゲーミングマウス):amzn.to/3DZaaYB
マイク(サンワダイレクト USBマイク PCマイク):amzn.to/30AVwJF
マイクスタンド(Luling Arts マイクスタンド マイクアーム スタンド):
amzn.to/3se5onZ
※アフィリエイトリンクになります。

Пікірлер: 53
@mizure
@mizure 2 жыл бұрын
useState: 3:01 useEffect: 9:18 useContext: 14:18 useRef: 21:13 useReducer: 24:27 useMemo: 31:36 useCallback: 45:25 カスタムhook: 50:42
@programming_tutorial_youtube
@programming_tutorial_youtube 2 жыл бұрын
Mizureさん、どうもありがとうございます(._.)
@西田隆二-c2i
@西田隆二-c2i 2 ай бұрын
いや~、分かりやすいわ。一つ一つ噛み砕いて説明されてるのでどんどん頭に理屈が入ってくる。 初心者に対して白紙の状態からロジックを組み立てて用語の解説を入れながら順序立てて説明できるのはやっぱり思いやりの心と頭の良さがないと出来るものではないと思います。 得てして自分本位で相手のレベルを十分意識しないで説明を行ってしまうと誤解も生みやすく、結果聞いている方はチンプンカンプンで理解できない事になり、結果教える側の目的を達成したことになりません。 開発現場にこういう佳い先輩がいれば部下からも慕われ生産性が一気に伸びると思います。 優れた才能で本当に素晴らしい説明です。エンジニア育成のために大いに頑張ってください!
@programming_tutorial_youtube
@programming_tutorial_youtube 2 ай бұрын
とてもうれしいコメントありがとうございます! 励みになります...🙏 本動画はhooksをはじめて触る人に向けた動画になりますので、丁寧に説明をしております。 私の最近の動画では少しレベルが高いものになっておりますので、またいずれこういった初心に立ち返る動画も作っていきたいと思いました。 ありがとうございます!!!
@西田隆二-c2i
@西田隆二-c2i 2 ай бұрын
@@programming_tutorial_youtube リプライありがとうございます。 これからも継続的に視聴させていただきます。 学ぶ側にとって理解し難いことが目からウロコのように納得出来ることは大きな喜びです。 お世辞ではなく本心からそう思い感謝します。 ますますのご発展を心よりお祈りいたします。
@けぴす-w1x
@けぴす-w1x 2 жыл бұрын
29:35 やべえuseReducer意味わからんと思って見てたら「はい何言ってるかわからないと思いますね」って言ってくれたからなんか安心した
@KBTMGJAF
@KBTMGJAF Жыл бұрын
24歳とお若いのに、ハイレベルな技術がありとても尊敬します!
@mabokikaku
@mabokikaku 10 ай бұрын
高度な仕組みを理解できる能力と、それを庶民にわかるように言語化できる能力がすごすぎる。色んな人のUemyの講座とか受けまくってみたけど、プログラミングの説明だと この人が今んとこ日本一だと思う。
@programming_tutorial_youtube
@programming_tutorial_youtube 10 ай бұрын
とても嬉しいコメントありがとうございます。 あまり褒められることがなかったので、このコメントで少し自信をつけることができました。 これからも少しずつ動画も出していきます。ありがとうございました🤗
@mabokikaku
@mabokikaku 10 ай бұрын
@@programming_tutorial_youtube shinさんの動画のお陰でめちゃ助かってます。 他にも多くのプログラミング初心者を救っていると思います。 こちらこそありがとうございます。
@vaderdath8837
@vaderdath8837 2 жыл бұрын
本当に一番分かりやすいです。
@yayuyo7188
@yayuyo7188 Жыл бұрын
11:25 まじか。これ知らなかった!
@yukisyo24
@yukisyo24 Жыл бұрын
わかりやすい!早くこの動画見たかった
@早稲田生暇人
@早稲田生暇人 Жыл бұрын
この動画はとてもわかりやすい!!!!
@gikkmur1082
@gikkmur1082 2 жыл бұрын
相変わらず分かりやすい! もっと伸びてほしいけど伸びてほしくない...
@programming_tutorial_youtube
@programming_tutorial_youtube 2 жыл бұрын
GiKkさん、ご視聴ありがとうございます。 伸びてほしくないのですね笑 少しでも学習の参考になればうれしく思います。 これからもプログラミングチュートリアルをよろしくお願いします。
@at3141
@at3141 11 ай бұрын
とても素晴らしい動画でした。精進いたします。ありがとうございます。
@programming_tutorial_youtube
@programming_tutorial_youtube 11 ай бұрын
こちらこそ、どうもご視聴ありがとうございました🙂
@Boson328
@Boson328 Жыл бұрын
本当にわかりやすい…ありがとうございます!
@hiroakiterada6365
@hiroakiterada6365 2 жыл бұрын
わかりやすいです!説明うますぎです!
@慎太郎武林
@慎太郎武林 2 жыл бұрын
ありがとうございます。 すごく、わかりやすいです。
@mirai6964
@mirai6964 2 жыл бұрын
わかりやすい動画ありがとうございます。 typescript使ってほしいです!
@y-2_kg
@y-2_kg 2 жыл бұрын
react関連で一番分かりやすいです。 ぜひreact×typescriptに関しての詳しい動画もお願いします!
@programming_tutorial_youtube
@programming_tutorial_youtube 2 жыл бұрын
yukiyaさん、ご視聴ありがとうございます。 そう言って頂けると励みになります。 typescriptですね。 ご視聴者様からのお声が多いので、検討してみます。ご提案ありがとうございます。
@ハレD
@ハレD 2 жыл бұрын
死ぬほどわかりやすかったです!!
@programming_tutorial_youtube
@programming_tutorial_youtube 2 жыл бұрын
ハレさん、ご視聴ありがとうございます。 説明はざっくりとしており、正確な内容ではないかもしれませんが詳しく知りたい時は、適宜ドキュメントや書籍をみてくださると理解が深まると思います。 コメントありがとうございました。
@gen2965
@gen2965 2 жыл бұрын
めっちゃ分かりやすかったです! ありがとうございます!
@programming_tutorial_youtube
@programming_tutorial_youtube 2 жыл бұрын
Genさん、ご視聴ありがとうございます。 250円もいただきまして、どうも感謝いたします。 なるべく分かりやすいように解説するように心がけていきますね👍
@dontbothermeidiot
@dontbothermeidiot Жыл бұрын
一番分かり易い
@2hemispheres2
@2hemispheres2 2 жыл бұрын
いつもありがとうございます! udemy購入させていただきました! ところで、55:15のところで、依存配列にvalueだけでなくsetValueもいれているのは何故でしょうか? valueだけでいいような気がしてしまします
@xx2005usdjpy
@xx2005usdjpy Жыл бұрын
いつも勉強させてもらっています。ありがとうございます。 質問なのですが、説明をお聞きしているとSubmitの時にServerへPostやGetするときはuseCallbackを使うべきと思うのですが合っていますでしょうか? そのような場合はuseCallbackの使用頻度はかなり高くなると思います。
@shoutMaschine
@shoutMaschine Жыл бұрын
こんにちは、最近 UdemyのReactのsnsアプリ作成コースを購入した者です。 hooksについて講座中では軽くしか触れられていないのでチンプンカンプンでしたがこの動画で補完できました。これからも追い続けます。 ありがとうございます。
@早稲田生暇人
@早稲田生暇人 Жыл бұрын
いいねえええええ
@kona-edu
@kona-edu Ай бұрын
なんでwsl使わないんだろう
@shiki7271
@shiki7271 Жыл бұрын
23:58
@iandmetick07
@iandmetick07 3 ай бұрын
ダラダラ説明がわかりにくい
@ねねね-c3s
@ねねね-c3s 3 ай бұрын
理解力に問題がある
@yuta8249
@yuta8249 2 жыл бұрын
本当に誰よりもわかりやすい解説でした!!
@psbita0310
@psbita0310 5 ай бұрын
実装でreduxを使ったけど、 2度と使いたくないです、、、
@dq-music
@dq-music Жыл бұрын
英語の本家Tutorialでは概念の理解が苦しかったので、とても勉強になりました。最後のuseLocalStorageフックは即戦力にできるくらい素晴らしいです!
@wata-r5y
@wata-r5y Жыл бұрын
いつも参考にさせてもらっています。 ありがとうございます。
@ましんぽんちょきん
@ましんぽんちょきん 2 ай бұрын
constとletは間違えたらアカン…そこからいつ直すんだとイライラしてしまうw でもわかりやすかったです。
@ヘビ牧場管理人ほーりー
@ヘビ牧場管理人ほーりー Ай бұрын
いつも助かってます😂
@MichisukeP
@MichisukeP Жыл бұрын
分かりやすいご説明ありがとうございました!
@programming_tutorial_youtube
@programming_tutorial_youtube Жыл бұрын
みちすけPさん、どうもありがとうございます!!! 2000円までいただいて恐縮でございます。。今後の活動のために利用 させていただますね☺
@ko5258
@ko5258 Жыл бұрын
ハッカとおっしゃっているのは発火のことですかね?
@programming_tutorial_youtube
@programming_tutorial_youtube Жыл бұрын
そうです!
@fumokmm
@fumokmm Жыл бұрын
動画の趣旨と外れますが、 3:52 あたりで、画面に書き込みしているのはどうやっているのでしょうか?教えていただけると嬉しいです!
@programming_tutorial_youtube
@programming_tutorial_youtube Жыл бұрын
Epicpenと呼ばれるアプリです
@fumokmm
@fumokmm Жыл бұрын
@@programming_tutorial_youtube ありがとうございます!試してみます。
@riontakashi
@riontakashi 2 жыл бұрын
とても解りやすかったです。
GraphQLとReactで簡単な犬画像ギャラリーを作ってみよう【GraphCMSを利用】
26:58
プログラミングチュートリアル
Рет қаралды 7 М.
How Strong is Tin Foil? 💪
00:26
Preston
Рет қаралды 118 МЛН
Самое неинтересное видео
00:32
Miracle
Рет қаралды 2,9 МЛН
Man Mocks Wife's Exercise Routine, Faces Embarrassment at Work #shorts
00:32
Fabiosa Best Lifehacks
Рет қаралды 5 МЛН
Apple peeling hack @scottsreality
00:37
_vector_
Рет қаралды 132 МЛН
【完全保存版】Next.js App Routerのベストプラクティスを解説
1:40:34
プログラミングチュートリアル
Рет қаралды 6 М.
この技術スタックは現代の魔法です。
21:27
プログラミングチュートリアル
Рет қаралды 16 М.
Next js解説 Reactとの違いは?
7:54
マフィア先生のエンジニア塾
Рет қаралды 15 М.
【Recoil入門】1からReactの状態管理ライブラリのRecoilを学んでみよう
43:07
プログラミングチュートリアル
Рет қаралды 10 М.
あなたはどのレンダリングパターンを採用しますか?【CSR/SSR/SSG/ISRを図解で解説】
34:32
Why Signals Are Better Than React Hooks
16:30
Web Dev Simplified
Рет қаралды 478 М.
皆さんに知ってほしいたった1つのこと【自己啓発/モチベーション】
16:51
プログラミングチュートリアル
Рет қаралды 7 М.
【プログラミング初心者必見】HTML/CSSから勉強し始めてはいけない理由
10:36
セイト先生のWeb・ITエンジニア転職ラボ
Рет қаралды 318 М.
How Strong is Tin Foil? 💪
00:26
Preston
Рет қаралды 118 МЛН