【2023年最新版】React Native入門：ニュースアプリを作りながら覚えよう

Webの開発経験はあるけどアプリの開発は初めてという方、エンジニアになりたての人にお薦めのReact Native入門講座。2019年に導入されたHooksの記法にも対応。React Native現場歴3年の講師が基礎から丁寧に解説します。

4.61 (787 reviews)

Udemy

platform

日本語

language

Mobile Apps

What you will learn

React Native + Expoを用いたスピーディな開発手法を習得する

React Native + Expoを用いて、ニュース閲覧アプリを制作することでスマホアプリ開発の流れを理解できる

Hooksを用いたコンポーネントの書き方を理解する

コンポーネントによる再利用性の高いコードを実装する

APIを利用した実装を習得する

Reduxによる状態管理を習得し、大規模なアプリも実装できるようになる

完成したアプリをApp StoreおよびGoogle Playに申請する

Why take this course?

~~2023年2月全編アップデート~~

最新のReact Native環境に合わせて全動画をアップデートしました。

【講座内容】

React Native + Expoを用いたスマホアプリ開発を、環境構築〜ストアへのリリースまで一通り習得することを目指します。

ソフトウェア開発の醍醐味は「自分の描いたサービスを実現できたとき」だと思います。

React Nativeを使うと、そのアイデア着想〜実現までが非常にスムーズになります。

この講座を通して、そんな体験をしていただければと思っています。

コーディングでは実際に「ニュース閲覧アプリ」を作りながら学びます。

シンプルなアプリですが、その中に、

・コンポーネントの設計

・API通信

・Hooksの利用

・Reduxによる状態管理

・画面遷移

などReact Nativeのエッセンスをギュッと濃縮しました。

アプリを開発しながら楽しく学びましょう！

【この講座の対象者】

・Webの開発経験はあるけどアプリの経験はない人

・エンジニア入門者

・React Nativeでの開発を経験してみたい人

【この講座では扱わないこと】

・JavaScriptの基本的な文法

・React Native熟練者向けの内容

【更新情報】

2023/2/5 全動画を最新版にアップデート

2022/8/22 Expoの開発環境構築を更新

2021/7/11 Screenのコードを修正

2021/4/24 付録にページング(スクロールすると次のページを読み込む)を追加しました

2020/10/20 付録にFunctionコンポーネントの色々な書き方、を追加しました

2020/9/27 各レクチャー毎のソースコード(L7~8)を掲載しました

2020/9/24 各レクチャー毎のソースコード(L4~6)を掲載しました

2020/8/16 環境構築のトラブルシュートを追加しました

2020/4/26 News APIの画像が表示されない場合の対応を追加

2020/4/11 TypeScript版のサンプルコードを掲載しました

2020/3/8 React Navigation v5対応のためセクション7を大幅に更新しました

2020/3/8 ReduxのHooks対応のためセクション8の一部を更新しました

2020/2/15 レクチャー39にエラー処理を追記しました

2020/2/11 レクチャー44にreact-navigationのバージョンに関する注意点を追加しました

2020/2/7 レクチャー4にExpoの最新版での注釈を追加しました

2020/2/3 レクチャー46にてHomeScreenの説明が漏れていたので修正しました

Reviews

kento

November 8, 2023

アプリ開発に興味があったので受講したが、説明とテンポがよくスムーズに学習することができた。少し、コードが動かない箇所があったが、Githubを参照しながら進めることで問題なく最後まで受講することができた。

August 27, 2023

現場経験はなく、Udemyでjavascript やReactの基礎を学んだ程度のレベルですが1日で簡単にアプリ開発が実践でき大変参考になりましたし何より楽しかったです。 ※一部エラーとなる箇所があり、自分で調べたりする必要があったため★4とさせていただきました。

Okamon

February 26, 2023

初めてReactNativeを触れましたが、全く問題なく受講することができました。ボーナスレクチャーも興味深く受講させていただきました。無限スクロール部分はローディングなど本編ではなかったかと思います。そのあたりも入れてもらえるといいなと思いました。（旧バージョンにはあるかも？）また設定画面も一般的なアプリにはあると思うのでその内容もあれば嬉しいと思いました。

あああ

October 19, 2022

素晴らしかったです。React Nativeを使ったアプリ開発の全体像を掴むのに最適でした。さらに、ドキュメントの読み方、サンプルコードの利用方法など、実装に必要なスキルを実践的に学ぶことができます。こんな上司がいたら最高だなと感じながら学んでおりました。次回作も楽しみにしています。

池田亮

September 14, 2022

React Native によるアプリ実装を俯瞰することができます。ボーナスレクチャーは実践的な内容で参考になりました。ただ、Node や expo などのバージョンによる不整合は付きものなので、GitHub にアップされたコードのビルドから行うコースもあった方が入門レベル、振り返りの観点でも良かったと思います。

hank

July 30, 2022

49.画面遷移を実装の段階でこちらを書いております。 ReactとExpoとJava ScriptのVer.がかなり前の物なので「プログラミングを余り触ったことがない人」だとほぼ詰んでしまう内容の講座だと思いました。例えば、講座通りのコマンドでReact NativeとExpo、Java ScriptのVerを最新でインストールすると20220720の時点ではエラーが出てExpoのシュミレーターが絶対に立ち上がらなかったりします(PathミスではなくGithub上にもissueが上がっているバグです) また、各教材が「リソース」と言う名前のフォルダに入っておりますが、その中に入っているリンク先のGithubのコードにもタイプミスがあったりなど、救済措置としてのソースコードも機能していない箇所がありました。例えば「49.画面遷移を実装」で言えば、App Navigator.jsの9行目export default AppNavigaotor ですがNavigatorのスペルが間違っております。講師の方はVisual Studio・Prettierで自動成形や自動修正されている筈のコードをアップロードしていると思うので間違いがないはずだと思っている聴講者の方は、注意が必要です。じっくり動画を観ると、講師の方が書くコードにタイプミスが結構多い(特に””と’’をよく間違えてます。多分ツール依存で速度を上げる為にあえて打ち間違えている)のをPrettierで修正している部分と純粋に間違えて居る部分がある事に気付くと思うので大丈夫だと思いますが、盲目的に信用すると抜け出せないかな？と思いました。私は普段からこの手の講座は全部動画を一時停止し、写経して、一個一個確認しながら進めると言うなんとも効率の悪い方法で進める為、今回は味のある講座で面白いなと思うので高評価を付けさせて頂いておりますが「スマホニュースアプリのソースコードが手軽に入手出来てラッキー！」と言う100％コピペプログラマーの方からの評価は悪くなりそうだな。と正直思いました。ですが、今回初めてJava Scriptを学ぶ(npm install コマンドも使うの初めて)の私でも普通に何とかなっているので低評価の人は、検索能力に難ありな人か若しくは自己解決能力が低いのでは無いかと言わざる追えません(それか定価で購入した人かですかね...) 普通に私は楽しいです。購入をオススメいたします。

sh00072021

July 10, 2022

他にもいろいろなreact nativeの講座見たのですがなかなかストアの申請までワンストップで教えてくれる講座に巡り合えなかったのでとても勉強になりました。ありがとうございます。ボーナストラックの様々なfunctionコンポーネントの書き方、すごい参考になりました。ありがとうございます。

加藤佑貴

June 5, 2022

Webでサンプルアプリを作ったことがあるくらいのレベルの者です。毎朝1時間＋土日4時間ほどで、大体一週間くらいで終えられる内容でした。サクサク進められるので、ハンズオン形式でまずは何か作ってみたいという方には大変おすすめできる内容だと思う。ただ、Overviewにも書かれている通り、ReactやJavaScriptの基本構文に関する説明は少ないので、全くの開発初心者にはモヤモヤする内容かもしれない。講座の後半に、2022年6月時点で非推奨となっているライブラリが使われてたりする。この時点だったら講座通りのコードでも動作するので、購入を検討している方は早めに買った方がいいかもしれません。

April 10, 2022

情報が古いため、各種ライブラリなど最新版に置き換えて進めてることになるかと思います。ただそのあたりのサポートが整っていたり、質問にも真摯に対応されていたりするのでおおむね良いと思いました。 1つ気になる点としては、動画の音量にブレがあるので聞きづらい箇所が何点かありました。

October 22, 2021

説明がわかりやすくかつ丁寧。実装する際に公式のドキュメントを参照しながら説明してくださるのが良い。今までたくさんの講座を受講してきたが、一番わかりやすく聞きとりやすかった。もっと、他の講座も受講してみたい。

July 15, 2021

全体的にとてもわかりやすく、進行の速さや、説明の詳しさの度合いが自分のレベルにちょうど合っていた。 HooksやReduxの入門程度の知識があるとスムーズに受講できると思う。自分は学びたてでReduxには慣れていなかったが、本講座がいい練習になった。アプリの題材も実践的かつ基礎学習に最適な内容で、React Native入門の決定版だと思う。自分はQ&Aを利用することはなかったが、他の人の質問に対する講師の回答が非常に丁寧で参考になった。認証、検索などのより実践的な機能について、別講座である実践編を受講したい。

Yuki

June 3, 2021

声が聞きやすく、説明がシンプルで分かりやすい。最新版で設定が変わったことへの対応もできている（動画内で警告文字列として追記）。ニュースアプリをReact Nativeで作るというコンセプトも分かりやすく、初心者なので目に見える形で試せるのはありがたい。

四橋健

June 1, 2021

初心者です。所々うまくいかなかったところがありましたが最終的にはレクチャー通り進めることが出来ました。デバッガーのところでずっとdebugger-uiが勝手に立ち上がり詰んでいましたが、 https://qiita.com/akifumiyoshimu/items/3a537f4ae1801101e980 こちらの記事でなんとか解決が出来ました。また、AsyncStorageが将来的に'react-native'から'@react-native-community/async-storage'へ移るような警告が出てきたのでどこかのタイミングで使用できなくなる可能性がありそうです。とても楽しく取り組め、大変勉強になりました。

Inoue

May 19, 2021

本コースをTypeScriptで受講しました。使用したツール（Expo、XCodeなど）のバージョンはすべて最新でやりましたが、エラーが出る箇所がいくつかありました。どのエラーも少し調べればわかるものだったので、とくに問題なくコースを終了できました。欲を言えば、開発時によく起こる問題とその解決方法・デバッグ関するセクションが欲しかったです。

Shota

April 13, 2021

React Nativeの基本が網羅されていて理解しやすいコースでした。また、Reduxの解説が今まで出会った解説の中で一番わかりやすかったです。何より一番いいのはアプリの題材です。教材で作るアプリはどれも似たり寄ったりでモチベーションが上がりにくいのですが、今回のニュースアプリは興味が持てる内容でした。次のコースも受講する予定です！

Charts

Price

Rating

Enrollment distribution

【2023年最新版】React Native入門：ニュースアプリを作りながら覚えよう - Distribution chart