【Next.js/Node.js/Prisma/Supabase】本格的なSNSアプリをフルスタック構築するマスター講座
モダンな技術スタックを駆使して1からSNSアプリケーション開発する講座。ユーザー認証からSupabaseでの投稿DB管理、PrismaのORMを使ってJavascriptのみの知識でフロントからバックエンドまで完結させる技術を身に着けます。

What you will learn
フルスタック技術を使って簡単な機能を備えたSNS開発ができる
Nextjsの基礎(動的ルーティングやSSG等)が学べる
Nodejs(Express)を使ったバックエンドAPI構築ができる
Supabaseを使ったDB管理ができる
Prismaを使ってORMを実現し、Supabaseと連携する方法が学べる
フロントエンドとバックエンドを両方構築し、フルスタック開発手法が学べる
Prismaを使ってSNS開発に必要なモデルを定義できる
JWTの基礎知識が学べる
ユーザー認証/ログイン/新規登録API実装が学べる
ReactのHooksを使って状態管理手法が学べる
ThunderClientを使ってAPIテストする方法が学べる
NextjsにTailwindCSSを導入する方法が学べる
axiosライブラリを使ってAPIを叩く手法が学べる
CORSエラー回避方法が学べる
SNSで必要な呟き投稿や呟き取得APIを構築できる
Expressにおけるミドルウェア設定の意味と実装方法がわかる
ログイン状態の監視してナビゲーションバーUIの変更ができる
SNSにおけるプロフィールページが実装できる
identiconライブラリでユーザー新規登録時にアイコン自動生成ができる
閲覧中のユーザーが投稿した呟きで取得できるAPIが作れる
Vercelを使ってNextjsをデプロイする方法が学べる
renderを使ってNodejsをデプロイする方法が学べる
最終的にフロントとバックエンドをデプロイしてWeb上で公開・利用できるようにする
Why take this course?
🌟 【Next.js/Node.js/Prisma/Supabase】SNSアプリ開発マスター講座 🌟
コースヘッドライン:
「モダンな技術スタックを駆使して1からSNSアプリケーション開発する」。この講座では、Shin Codeという経験豊富なインストラクターによって、ユーザー認証からSupabaseでの投稿DB管理、PrismaのORMを使ったJavascriptのみの知識でフロントからバックエンドまで完結させる技術を身に着けます。
コース内容の概要:
フルスタックエンジニアになるためには、実際にアプリを作って学ぶのが最善の方法です。本講座では、簡単なSNSアプリを構築しながら、フロントからバックエンドまでの技術を実践的に身につけていただきます。
- ユーザー認証系関数の実装とテスト
- ログイン/新規登録機能の構築
- 投稿システムの開発(CRUD操作)
- プロフィール管理機能の設定
- データベース(Prisma, Supabase)を活用したデータ操作
- API Routeの設計と実装
- クラウドデプロイメント(Herokuなど)
対象者:
このコースは以下の方々にお勤めです:
- ReactやNext.js等の基礎技術を学んだが、さらに進むという方
- フルスタック技術を使ったSNS開発に興味のある方
- PrismaのORMを使ってDB操作をしたいと考えている方
- SupabaseのBaasを使ったDB管理に挑戦したいと思っている方
- 無料でデプロイし、SNSアプリを実際に運用したいと考えている方
- モダンな技術をキャッチアップしたいと願う方
- Webアプリ開発に深い好奇心を持ち、学び続けたいと思っている方
受講時の注意点:
- HTML/CSS/JavaScriptの基本文法とルールは前提として設定しております。
- ReactやNext.jsの基礎知識は、それ以上の知識がある方々に向けてお話を進めております。
- アルゴリズムやデータ構造などの高度なJavascriptの知識は必要ではありませんが、ある程度のJavascript触れを摂たことがある人に対応しています。
コースで得られるメリット:
- 実際のSNSアプリケーション開発を経験し、ポートフォリオに追加できます。
- フルスタック技術(Next.js, Node.js, Prisma, Supabase)の専門知識を身につけることができます。
- 実際にデプロイし、運用する経験を積むことができます。
- モダンなWeb開発技術をキャッチアップし、カリアの向上に役立てることができます。
今すぐスタート!
本講座では、実践的な経験を積むことから、技術スキルの向上に至るまで、一連のプロセスを手厚く指案していきます。コードの書き方、デバッグの技術、最新のベストプラクティスへと学び進めていくことで、あなたも次のレベルのフロントエンドエンジニアへの一歩を踏み出すことができるでしょう。
🚀 今日からSNSアプリ開発の世界に飛び込んでみませんか? 🌟
あなたのキャリアへの新たな一歩を踏み出しましょう。本コースでは、実際のプロジェクトを通じて、必要な技術と知識を翼ばかりにします。立ち止まらず進んでいくだけで、あなたもSNSアプリ開発の専門家へと成長していきます。これはあなたが見つけるべき、最高の機会の一つです。今すぐご登録ください!
Screenshots




Our review
Course Review Summary
Global Course Rating: 4.52
The course in question is a comprehensive learning experience that aims to guide students through the creation of a social network application using various technologies and tools, including Node.js, Next.js, Express, Supabase with Prisma, and deployment on platforms like Vercel and Render. The course content is well-structured and covers both frontend and backend development, with a focus on practical implementation and hands-on learning.
Course Pros
- Practical Application: The course allows students to build a social network app from scratch, providing a real-world application of the skills learned.
- Comprehensive Coverage: It covers a wide range of technologies and tools, offering a broad knowledge base for learners.
- Versatile Learning: Students can use the teachings to create other types of applications beyond just a social network.
- Handson Approach: The course encourages hands-on learning and includes error handling in the videos, which is a valuable skill for developers.
- Resource Recommendations: The course offers recommendations for further learning, such as upgrading to Next.js 14 and using additional libraries like Redux Toolkit and shadcn/ui (React Hook Form).
Course Cons
- Technical Issues: There were instances where the course material contained errors or unclear explanations, which could lead to confusion for learners.
- Version Uncertainty: The course uses specific versions of technologies like Node.js, and learners are advised to stay updated with version changes to avoid compatibility issues.
- Lack of Error Resolution in Video: In some cases, the errors encountered during the hands-on exercises were not resolved within the same video, requiring additional research or troubleshooting from the learner.
- Pacing and Structure: The course sometimes moves forward with a passed step without clarifying potential issues, which can make it challenging for learners to identify if they are following correctly or have made an error.
Course Suggestions for Improvement
- Error Handling: It would be beneficial to include more explicit error resolution within the video content, ensuring that learners can follow along without additional external guidance.
- Clarify Steps: When a mistake is made during the hands-on demonstration, it should be explicitly stated and then corrected in subsequent videos to avoid confusion.
- Update Content Regularly: Keeping the course content up-to-date with the latest versions of Node.js and other tools used will help maintain relevance and prevent learners from encountering deprecated features or functions.
- Improve Documentation: Clearer documentation and step-by-step guides for each section of the course would assist learners in following along more effectively.
Conclusion
Overall, the course is a valuable resource for those looking to build a social network application and learn full-stack development with Node.js and Next.js. While there are some technical issues and areas for improvement, the course's comprehensive approach to teaching makes it a solid choice for learners at an intermediate level in web development. With the suggested improvements, this course could become even more effective and user-friendly.