강의

멘토링

로드맵

Inflearn brand logo image
BEST
Programming

/

Full-stack

Getting Started with Supabase and Next Full Stack (feat. Supabase OAuth, Next.js 14)

Firebase's SQL version! You can master the basics of Next.js full-stack development through Supabase!

(4.9) 26 reviews

425 learners

  • dodocoding
실습 중심
포트폴리오
Next.js
supabase
React
Clone Coding

Reviews from Early Learners

What you will learn!

  • Supabase (RLS, Table creation, API integration)

  • Next.js App Router

  • Vercel CI/CD and Optimization

  • Sharing ToDoList functionality using the MVC pattern.

  • Minimum Knowledge for a Next.js Server

  • Basics of TypeScript Typing

  • OAuth, Google Login, GitHub Login

Supabase is the easiest server for FE developers these days!
Supabase + NextJS 14 FullStack Basics

It contains only the parts necessary for practical use 🍭

Why you should choose Supabase over Firebase ! 😮 🌲

Have you heard of Supabase , the SQL version of Firebase ?

Supabase has the following advantages:

  • SQL DB features based on PostgreSQL

  • Delegation of authorization checks at the application level with strong RLS (row-level security).

  • REST API automatically created based on DB Schema

  • RealTime DataBase

  • OAuth 2.1 support (Google, GitHub, Kakao, Facebook login, etc.)

  • Admin page and official documentation with AI assistant and best developer experience


Supabase project you can create through lectures!

Features of this course

📌 Lecture Notes Guide: Goals for each chapter, review points, and more (official documents, concepts, etc.)

📌 Lecture Checkpoints Provided : Don't worry if you don't follow the code! There are branches for each chapter.

📌 10% theory, 90% practice : We also explain important theories such as Supabase RLS.

📌 Portfolio : You can get the results through clone coding.

I recommend this to these people


Supabase applies in just one day.

Developers/students who want to create a login-enabled website in one day using Supabase


Next.js 14 with supabase
With minimal Next.js server knowledge

How to apply Supabase to SSR, CSR


OAuth Social Login
Social login is difficult

How to solve it in one go

💡 The combination of Supbase + Next.js is the combination that can create a full-stack MVP project faster than anyone else!

After class

  • 📌 You can create a side project in just one day using Supabase.

  • 📌 You will learn about table creation, manipulation, RLS, triggers, and functions in PostgreSQL DB.

  • 📌 You can create ServerActions, Middleware, RSC, RouterHandler (API) of Next.js.

  • 📌 Learn UI development methods faster than anyone else with TailwindCSS.

  • 📌 Implement social login using Supabase Authentication.

  • 📌 Create a TodoApp project with sharing functionality.

Learn about these things.

Supabase SQL, RLS theory

  • Powerful DB features of PostgreSQL

  • SQL statements for creating, querying, modifying, deleting, and reading tables

  • Retrieving table information with REST API

  • Easy RLS explanation


Shared TodoApp (with Next.js 14)

  • Clone coding web using App Router

  • Todo App at Browser Rendering Level

  • Todo App using server actions

  • Social login feature and shareable Todo App

Supabase Editor with AI Assistant

  • Table Editor: Create a table

  • SQL Editor: Retrieving Data

  • Authentication : User Management

Minimum knowledge for Next.js 14 server

  • Router Handler

  • Middleware

  • RSC (React Server Component)

  • ServerActions

Things to note before taking the class

Practice environment

  • I use Node.js, VS Code, and GitHub.

Learning Materials

  • GitHub and Chapter-by-Chapter CheckPoints: Link

  • Handwritten notes and workbook provided! : Link

  • LiveDemo : Link

Player Knowledge and Notes

  • Basic knowledge of HTML, CSS, and React

  • Styling with TailwindCSS (+ summary lecture 😀 )

  • (*At first I hated TailwindCSS. But after the initial learning curve (about an hour), your development experience and development speed will be dramatically improved! You won't regret it.)


Recommended for
these people

Who is this course right for?

  • For those who want to start a project with Next.js

  • To FE developers considering adopting Supabase

  • For those who want to develop a server-side full-stack application with Next.js

Need to know before starting?

  • Basic level HTML, CSS, and React

Hello
This is

3,707

Learners

146

Reviews

85

Answers

4.8

Rating

5

Courses

  • 프론트 개발자로 네카라쿠배 중 하나의 IT서비스 기업에 재직하고 있습니다. 😀

  • 🚀 SW마에스트로 Expert 취업 멘토링

  • 🚀 Naver Boostcamp BE 멘토 경험

  • 🚀 FE 7Code 로드맵 강의 제작

Curriculum

All

68 lectures ∙ (7hr 12min)

Published: 
Last updated: 

Reviews

All

26 reviews

4.9

26 reviews

  • Malik KIM님의 프로필 이미지
    Malik KIM

    Reviews 3

    Average Rating 3.7

    5

    100% enrolled

    supabase와 nextjs를 함께 사용하는 한국어 강의를 찾기가 힘들었는데 덕분에 풀스택 웹앱을 빠르게 만들 수 있게 되어 너무 좋습니다. 좋은 강의 감사드립니다!

    • 도도(코딩루팡)
      Instructor

      수강해주셔서 진심으로 감사드립니다! Next.js와 Supabase를 함께 사용한다는 것은 결코 쉬운 일이 아닙니다. 이 두 가지를 제대로 활용하려면 서버 사이드 렌더링과 풀스택 개발에 대한 깊은 이해가 필요하죠. 이번 강의가 여러분의 프로젝트 진행에 있어 큰 도움이 되었기를 바랍니다. 이 조합을 잘 활용하면, 강력하고 효율적인 웹 애플리케이션을 만들 수 있는 기반이 될 것입니다. 앞으로도 여러분의 개발 여정에 좋은 길잡이가 되었기를 바라며, 더 나은 성장을 이루시길 응원합니다!

  • Han Lee님의 프로필 이미지
    Han Lee

    Reviews 2

    Average Rating 5.0

    5

    46% enrolled

    안녕하세요, 코딩루팡님, 유튜브 구독자 입니다 :) 먼저 저에게 너무 필요한 강의를 올려주셔서 감사합니다. 특히 다음 2가지 부분에 대해 깊은 감사 드립니다. (1) Next.js + Supabase - Udemy 에서 Next.js 강의는 많지만 Next.js와 함께 Supabase 대해 다루는 강의는 찾아보지 못했습니다. - 한국어로 되어 있는 강의는 더욱 없기 때문에 다시 한번 감사 드립니다. (2) 학습방법 - 코딩 아바타가 되어, 일시정지하고 코드를 아무생각 없이 따라치면서 학습 했습니다. - 알려주신 학습법 ( 추상화 -> 구체화 ) 부분을 적용해 지식을 습득 및 체화 하겠습니다. 유튜브 커뮤니티에 인프런 해당 강의가 출시 되었음을 공지해 주셨으면 좋을 것 같습니다. [ 해당 강의가 심사 중에 있다는 소식만 있어서 혹시 몰라 전달 드립니다. ] 감사합니다.

    • 안녕하세요. ㅎㅎㅎ 구독자셨군요.! 항상 부족한 유튭채널에 구독해주셔서 감사드리옵니다. 강의 출시 소식 전달이 좀 늦었네요 ㅠㅠ, 부족할 수 있는 강의 수강신청해주셔서 정말 감사드려요. HanLee님 기억하고 있다가 강의 뿐 아니라 진로, 취업 등 질문주시면 더 정성스럽게 답변드리도록 하겠습니다. ~ 👍

  • 권빵님의 프로필 이미지
    권빵

    Reviews 2

    Average Rating 5.0

    5

    31% enrolled

    next로 서버까지 다뤄보고 싶었는데, 마침 감사합니다.!! 👩🏿‍🦰

  • 코드DOS님의 프로필 이미지
    코드DOS

    Reviews 4

    Average Rating 5.0

    5

    31% enrolled

    supabase를 배워보고 싶었는데 좋네요. 아주 좋은 기반이 될 수 있는 강의 같아요. 이를 바탕으로 열심히 프로젝트 만들어볼께요.! next + supa 풀스택 파워풀 합니다.

    • 화이팅 입니다.! 슈파베이스 정말 빠르게 프로젝트 만드는데 최고인것 같아요

  • 노용석님의 프로필 이미지
    노용석

    Reviews 4

    Average Rating 4.8

    5

    31% enrolled

    $42.90

    dodocoding's other courses

    Check out other courses by the instructor!

    Similar courses

    Explore other courses in the same field!