|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/nextjs-basic/
课程评论:没有评论
这是一个关于Next.js全栈开发的基础课程,使用TypeScript、Prisma和Auth.js(前身为NextAuth.js)。该课程旨在帮助学习者从零开始,通过实践操作学习如何使用相同的语言和框架进行前端和后端开发。 课程内容涵盖: * **Next.js核心功能**:深入讲解Next.js的关键特性。 * **表单处理**:学习如何使用验证和数据库操作库来创建表单。 * **实战项目——博客系统**:构建一个包含身份验证功能的实用博客应用程序。 课程创建的动机是当前生成式AI在代码生成方面的潜力,但同时也带来了代码质量不稳定、错误频发等问题。为了更有效地利用AI,掌握前后端同构开发至关重要,这可以统一开发者的技能栈,提高效率。 本课程提供了基于现代Next.js和TypeScript环境的全栈开发基础,使学习者在掌握基础知识后,能够结合AI工具快速开发个人项目或中小型应用程序。课程讲解细致,鼓励对服务开发感兴趣的学习者参与。 **课程涉及的关键技术包括:** * **Next.js**:App Router、页面/布局/错误/加载组件、Route Handler (API/Route)、MetaData、Middleware、服务器组件(RSC)/客户端组件(RCC)、渲染方式 (CSR/SSR/SSG/ISR)、Server Actions、redirect、Link、Image。 * **库**:Prisma、shadcn/ui、Zod、Auth.js、bcryptjs、date-fns、React-Markdown。 * **React功能**:useActionState, useState, useEffect。 * **部署**:Vercel、Supabase。
この講座は、Next.jsのベースから実践的な内容まで、フロントエンドとバックエンドを同じ言語・同じフレームワークで開発する方法をハンズオンで解説しています。講座の前半・・Next.jsの主要な機能を解説講座の中盤・・バリデーションやDB操作のライブラリを扱ったフォームの作成方法講座の後半・・認証機能を盛り込んだ実践的なブログシステムを構築する方法講座を作ったモチベーション昨今様々な生成AIサービスがリリースされており、生成AIを活用することでかなりのスピードでコード生成できるようになっています。一方で、生成AIを扱う上での問題点も実感しています。新旧織り混ざってうまく動かないコードも出力される出力するたびにコードの内容が違うミスを指摘してコードを再生成するも結局ミスが消えずに堂々巡りなどなど。使う側としても、生成AIが出力したコードが正しいのかどうか、的確に指摘・修正できるスキルが求められるようになっています。さらにフロントエンドとバックエンドの技術が全く別のプログラム言語であれば、それぞれの知識も必要になってきます。コード生成AIのパワーを活かすためにも、フロントエンドとバックエンドを同じ環境で開発することができれば、使い手側のスキルも一本化できて効率化でき、開発効率も上がることになります。そんな課題意識を受けて本講座では、モダンなNext.js+TypeScript環境にて、フロントエンド・バックエンドをまとめたフルスタックな開発を実施するための、土台になるような講座構成にしております。土台としての知識を蓄えた状態でコード生成AIなどを活用することで、個人開発や小中規模のアプリであればかなりのスピードで開発できる実力を身につけることができます。「急がば回れ」の精神でできるだけ細かく解説しておりますので、サービス開発に興味のある方はぜひ本講座をご活用いただければ幸いです。## 講座で扱っている技術Next.jsAppRouter(page/layout/not-found/error/loading/RouteHandler(api/route)/MetaData/middlewareコンポーネント(RSC/RCC)/レンダリング(CSR/SSR/SSG/ISR)/ServerActions/redirect/Link/Image/ライブラリprisma/shadcnui/zod/auth.js(旧NextAuth.js)/bcryptjs/date-fns/react-markdown/Reactの機能useActionState, useState, useEffectデプロイVercel, Supabase