Next + React Query で SNS サービスを作成する
React19 & Next15 & ReactQuery5 & Next Auth5 & MSW2 & socket.io4 & zustand 스택을 사용하여 Twitter(X.com)와 유사한 SNS 서비스를 만들어보겠습니다. 마지막으로 검색 엔진 최적화를 위한 SSR까지!
受講生 3,397名
難易度 中級以上
受講期間 無制限
お知らせ
20 件
こんにちは。ZeroCho（ゼロチョ）です。
最近、私のYouTubeチャンネルが消えているのを見て驚かれた方も多いかと思います。詳しい経緯は復旧後に動画で説明いたしますが、まずは簡潔にご説明しますと、
3月1日付で私のYouTubeアカウントがハッキングされ、ハッカーが仮想通貨詐欺のライブ放送を行い、それから間もなくYouTube側によってアカウントが停止されました。現在、Google側とやり取りをしながら復旧を進めている状況です。1週間以内に復旧する見込みです。ただ、私のInflearn（インフラン）講義の中で「コーディング自律学習」や「Node.js教科書」などの講義にYouTube動画が埋め込まれているケースがあり、該当する回が視聴できない状態かと思われます。この部分も、アカウントが復旧すれば自動的に復旧するものと考えております。
有料講義および無料講義の受講生の皆様にご不便をおかけして申し訳ございません。少しだけお待ちいただければ、講義が正常化されることをお約束いたします。また、私のチャンネルの視聴者の皆様にもご心配をおかけしたことをお詫び申し上げます。復旧次第、詳しい経緯をお知らせいたします。
ありがとうございます。
ZeroChoより。最後のタイムアタックプログラム16期を実施します！16期は8月20日から開始します。連休を楽しく過ごした後に始めてみましょう😊😊 参加者の方々が徐々に減っているため、私も管理負担により今回を最後として終了することになりました。今後はInflearnチャレンジ講義機能を利用してみようと思います。
講座は購入したけれど毎回最後まで見られない方のためのプログラムです。無料でも参加していただけますし、意志力がかなり不足している方のために別途保証金制度も運営しています。前期の方々や同期の方々の整理ノートを見ながら勉強することもできますし、私や他の方に質問することもできます。
タイムアタックに参加された方々の完走率がはるかに高かったです。本当に必ず講義を完走しなければと決心されたなら、参加されると大変役に立つでしょう！
ちなみに講座はInflearnで私を検索して購入するよりも、https://www.zerocho.com/lectureのリンクをクリックして購入していただけると、私が支払う手数料が大幅に削減されます。お願いします😊😊
次回リリース予定の講座は、Slackフロント講座のリニューアル（Supabase）です。
完走すると講座クーポン（35〜70％、講義の長さによって）やお食事券（保証金参加時）をプレゼントしています！
私も現在、ほとんどの期で赤字を出しながら進行しています。それでも進行する理由は、私の講座が実質的に皆さんのお役に立てることを願っているからです。講座を購入しただけで聞かない方が多いのですが、決められた進度と共に最後まで聞いていただき、皆さんの開発スキルが向上することを願って毎回進行しています。私は自分の講座が役に立ったという言葉を聞く時が一番誇らしいんです。タイムアタックで出てくる講座フィードバックを基に講座を少しずつ修正もしており、私にとっても役に立っています。
Slackで進行するため、Slackルームにご参加いただく必要があります。下記のSlackリンクからお入りください。
入室されましたらお知らせチャンネルに16期参加アンケート調査（Googleフォーム）があります。記入していただければと思います。リンクも別途一緒にアップロードいたします。
https://forms.gle/GephR8f3jf4ajdre9アンケート調査を作成されていなくても、私にDMを送ってお知らせいただければ参加していただけます。
タイムアタックプログラムに参加されなくても、Slackルームに参加されれば、ギークニュースなどの情報共有もして、プログラミングの質問や悩み相談もして、いろいろと役に立つと思います。すでに3800名ほどが参加されています！
ありがとうございます。
2025年ももう4月になってしまいましたね 😭😭 時間はなぜこんなに速いのか…
タイムアタックプログラム14期進行します！ 14期は4月14日から始まります。
講座は購入したが、毎回最後まで見られない方のためのプログラムです。無料でも参加でき、意志力が不足している方のために別途デポジット制度も運営しています。以前の騎手の方々や同じ騎手の方々の整理ノートを見ながら勉強することもできますし、私や他の方々に質問をすることもできます。
タイムアタックを参加した方々の頑強率がはるかに高かったです。本当に是非講義を頑張らなければならないと誓っていたら参加すれば助けがたくさんなります！
ちなみに講義はInflearnで私を検索して購入するよりは、https: //www.zerocho.com/lectureのリンクを押して購入していただければ、私が出す手数料が大幅に減ります。お願いします😊😊
次回リリース予定の講義は、スラックフロント講義リニューアル、配信アプリ講義（React Native -> Expo）リニューアルです。
完走いただくと講座クーポン（35～60％、川の長さに応じて）や会って食事券（保証金参加時）を差し上げています！
私も現在毎機数赤字を見ながら進めています。すでに12回目の赤字...それでも進行する理由は、私の講座が実質的に皆さんに役立つことを望むからです。講座を買うだけで聞かない方が多いのですが、決まった進度とともに最後まで聞いて、皆さんの開発実力が向上してほしいと毎回進行中です。私は私の講座が役に立ったと言われたときに最も嬉しいです。タイムアタックから出てくる講座フィードバックをもとに講座を少しずつ修正してもいて、私にも役に立ちますよ。
スラックで進行するので、スラックルームに参加してください。下のスラックリンクに入ります。
入ってくると、お知らせチャンネルに13期参加アンケート（Googleフォーム）があります。作成してください。リンクも別々にお届け致します。
https://inf.run/fSfmyアンケートを書かなかったとしても、私にDMを送って教えてください。
タイムアタックプログラムに参加していなくても、スラックルームに参加すればギャグニュースなどの情報共有もしたり、プログラミングの質問や悩み相談もしたり、いろいろと助けられます。すでに3800分ほど入っています！
ありがとうございます。
こんにちは。新ニュースまた送ってくれてすみません。
前回ゼロチョスクールスラックリンクが故障したことを確認して修正しました。また、Next 15講義もタイムアタックに追加しました（従来のNext 14で修正）。
これだけ新しいニュースで送るには少し不足していくつかの案内をもっとしたい場合
今年の講義は、リアクト基本講座リニューアル、リアクトネイティブ講座リニューアル、ノード24バージョンでリニューアル、Nest.js講座リニューアルです。ノード24バージョンとNest.jsは本でも出てくる予定です。
今日のYouTubeライブで2025年の開発者ロードマップとReactスタック、AI時代の開発者について映像を撮る予定です。悩み相談所のQ&A時間もしています。多くの関心をお願いします。
明けましておめでとうございます。
ありがとうございます。
ゼロ秒ドリーム。
2025年明けましておめでとうございます！
新年初のタイムアタックプログラム13期進行します！ 13期は1月13日から始まります。
講座は購入したが、毎回最後まで見られない方のためのプログラムです。無料でも参加でき、意志力が不足している方のために別途デポジット制度も運営しています。以前の騎手の方々や同じ騎手の方々の整理ノートを見ながら勉強することもできますし、私や他の方々に質問をすることもできます。
タイムアタックを参加した方々の頑強率がはるかに高かったです。本当に是非講義を頑張らなければならないと誓っていたら参加すれば助けがたくさんなります！
ちなみに講義はInflearnで私を検索して購入するよりは、https: //www.zerocho.com/lectureのリンクを押して購入していただければ、私が出す手数料が大幅に減ります。お願いします😊😊
12月に出てきたデザインパターン講義が追加されました。
完走いただくと講座クーポン（35～60％、川の長さに応じて）や会って食事券（保証金参加時）を差し上げています！
私も現在毎機数赤字を見ながら進めています。すでに12回目の赤字... それでも進行する理由は、私の講座が実質的に皆さんに役立つことを望むからです。講座を買うだけで聞かない方が多いのですが、決まった進度とともに最後まで聞いて、皆さんの開発実力が向上してほしいと毎回進行中です。私は私の講座が役に立ったと言われたときに最も嬉しいです。タイムアタックから出てくる講座フィードバックをもとに講座を少しずつ修正してもいて、私にも役に立ちます。
スラックで進行するので、スラックルームに参加してください。下のスラックリンクに入ります。
入ってくると、お知らせチャンネルに13期参加アンケート（Googleフォーム）があります。作成してください。リンクも別に一緒にお届け致します。
https://forms.gle/sEizFXgH8Dh4RLMK6アンケートを書かなかったとしても、私にDMを送って教えてください。
タイムアタックプログラムに参加していなくても、スラックルームに参加すればギャグニュースなどの情報共有もしたり、プログラミングの質問や悩み相談もしたり、いろいろと助けられます。すでに3600分ほど入っています！
ありがとうございます。
こんにちは。
Next 15 お知らせだけをお届けしようとしましたが、React 19バージョンまで公式発売してどうしても新しいニュースをどんどん上げることになりますね。
まずmsw部分講義の再編集/再撮影をしました。来週まではnext-auth、翌週にはreact-query部分の再編集/再撮影を行う予定です。
next 15関連する新しい講義は上記の講義です（短い）
React 19がリリースされるにつれて、useFormStateがuseActionStateに変わるなどのマイナーな変更があるようです（Nextはまだ19を正式にサポートしていませんが、この部分も新しいバージョンが出てくるとサポートされます）、今後変更された部分は後でもう一度再撮影/再編集する必要があるようです。そのため、しばらくの間、講義の撮影に待機が発生する可能性があります。
React 19に関しては、YouTubeショーツで新機能を一つずつ取り上げてみましょう。
ありがとうございます。
ゼロ秒ドリーム。
･
修正済み
こんにちは。
上記リンクの映像をはじめ、Next 15へ映像アップグレード中です。現在のセクション3まで再編集完了し（馬が途切れたり、スクロールがずれたり、画面がすっかり切り替わる部分をすべて削除しました）Next 15関連内容追加しました。
また、各講義ごとにソースコードを細分化しておきました。 Next 15 バージョン ソースコードは、次の羽根でまとめています。
https://github.com/ZeroCho/next-app-router-15
羽毛ヒストリーを積極的に活用して
https://github.com/ZeroCho/next-app-router-15/commits/master/
ここに各講座ごとにソースコードをすべて提供しているので進行時に参考にしてほしいと思います。各講義別授業ノートにも残しました。
これからは
今週末まではMSW連動部分とNext 15のFormエレメント部分追加される予定です。
来週中はnext-auth部分再撮影予定です。
ありがとうございます。
ゼロ秒ドリームこんにちはゼロ秒です。
もうNext 15が出てからちょっとなりましたね。約束した通り（講義発売後1年以内には無料映像アップデート、2年以内にはお知らせによるアップデート） Next 15アップデート内容を撮影してアップロードする予定です。 12月からスタートし（現在はデザインパターン講義仕上げ後に検収中です）、機王再撮影するキム・エに講義序盤から編集を改めて練習して順次再アップロードするようにさせていただきます。まとめると次のようになります。
Next 15変更部分を反映
Next Auth 部分再撮影（新ニュース内容を反映）
MSW公式連動してこの部分再撮影
序盤クローンコーディング部分テンポ 少しゆっくり（あまり精神的にはない）再編集
天気が急に寒くなりましたが、風邪に気をつけてください。
ありがとうございます。
ゼロ秒ドリーム。