강의

멘토링

커뮤니티

Programming

/

Web Development

Next.js 15 with Spring Boot

Traditional React development methods and development using Next.js are completely different. This course penetrates the core of the latest Next.js 15 and teaches you the 'real' Next.js development approach. Experience how to achieve both performance and efficiency, from job portfolio projects to real-world projects. Let's develop the Next.js way! This course is structured so you can learn through hands-on experience by creating actual examples of how to apply Next.js features. You'll learn faster through actual code rather than theory, focusing on server components and covering server actions and caching strategies. Since the goal of the course is to catch up with the Next.js approach as quickly as possible, the lectures themselves are conducted using JavaScript. However, examples from each lecture created with TypeScript are additionally provided as course materials.

(5.0) 11 reviews

153 learners

  • zk202308a5410
Nextjs
fullstack
react.js
javascript
SpringBoot
JavaScript
React
Spring Boot
JPA
Next.js

Reviews from Early Learners

What you will gain after the course

  • Ability to build production-level full-stack web applications using Next.js 15

  • Full-stack practice from browser to API server and DB

  • Server Actions/ SSG/ ISR and other Next.js / React feature practice

  • Authentication Processing: Perfect with NextAuth and JWT Tokens!

Next.js is optimal for building large-scale applications with React.

React's development direction is moving away from operating only in browsers toward increasingly integrating with server-side operations. Next.js is the framework that most definitively supports the direction React is pursuing.


At first, Next.js may seem like it simply makes routing easier, but when you design based on server-side components, Next.js becomes the most suitable choice for building large-scale applications.


Why I created this course

React is designed to work only in the browser, but Next.js can operate on both the server side and in the browser, so a new approach is needed. To properly utilize Next.js, appropriate development methods suited to it are required.


This course is designed to help you experience Next.js in minimal time and develop the ability to make appropriate decisions. After taking this course, when someone asks you 'Will you use React? Or Next.js?', the goal is for you to answer 'Next.js'.


Example System Configuration

The course examples are structured with a separate API server designed with scalability in mind. The API server runs using code created for each specific function, and this is configured to be utilized by Next.js. The Next.js server processes data on the server side, and the browser cannot directly access the API server, creating a structure that closely resembles real-world implementation.




Technologies used in the course

Backend (Provided as course materials and not included in lecture content.)

  • Spring Boot

  • JPA

  • RestController

  • JWT

FrontEnd

  • Next.js 15 (Written in JavaScript with TypeScript provided as course materials.)

  • NextAuth

  • SWR


Next.js 15

The changes in routing methods since Next.js 13, the emergence of React's Server Components, Server Actions, and many other changes in Next.js 15. By utilizing these features well, you can implement various functionalities faster than developing with traditional React.


Slow then Fast

You need to think about learning methods.

  • Theoretical concerns are - 'SLOW'

  • JavaScript for Maximum Speed Development - 'FAST'

  • Design minimally and quickly with AI processing - 'FAST'

  • The API server is provided with source code - 'FAST'


Examples and content created in the lectures


Todo Example: Master CRUD and Paging with App Routing

  • Creating a Todo Example Using App Routing

  • Routing Handling and Page Components

  • Learn about layout, loading handling, error handling, and more.




Product Management: How to Achieve Both Performance and SEO with SSG/ISR

  • Static page generation using SSG

  • Periodically auto-refreshed pages (ISR)

  • Separation of Search Functionality


Authentication Processing: Perfect with NextAuth and JWT Tokens!

  • Self-authentication and social authentication (kakao) processing

  • JWT Processing and Authentication Usage in Components

  • API Server and Access Token, Refresh Token Automatic Renewal Methods

  • Custom Login/Logout Pages


State Management: Efficiently Managing Shopping Cart Data with SWR

  • Client-centered development methods in Next.js

  • Handling callable route processing in Next.js

  • How to share server data across multiple components using SWR





Recommended for
these people

Who is this course right for?

  • People who want to apply Next.js examples to real-world projects

  • Frontend developer who needs to develop integration with API servers

  • Developers who want to move to the next level in React

Need to know before starting?

  • React Fundamentals

  • Understanding REST Architecture

Hello
This is

2,146

Learners

156

Reviews

274

Answers

4.8

Rating

5

Courses

구멍가게코딩단은 2015년부터 개발과 관련된 직종의 사람들의 모임을 위해 만들어진 커뮤니티입니다.

강의의 진행은 현재 구멍가게 코딩단을 운영하고 있는 쿠키 매니저가 진행하고 있습니다.

 

2000년부터 개발을 시작하였고 벤처 기업, 중소 기업, 대기업 / 프리랜서 등의 개발 경험을 가지고 있습니다.

2010년대 부터는 주로 기업체 강의와 컨설팅을 주요 업무로 하고 있습니다.

ㄴ네이버 카페

 

주요 저서 

코드로 배우는 스프링 웹 프로젝트

코드로 배우는 스프링 부트

코드로 배우는 React

RESTful API 서버 구현

스프링 6 레거시 프로젝트

자바 웹 개발 워크북

React Native 인 액션(번역)

 

개발/강의

삼성 SDS 개발팀 근무

SK 고객행복 주식회사 근무

KT / SK / 포스데이터 / 교보 생명 / 신세계 / 아시아나 / 건강보험 관리공단 등등 기업체 강의

Curriculum

All

44 lectures ∙ (8hr 50min)

Course Materials:

Lecture resources
Published: 
Last updated: 

Reviews

All

11 reviews

5.0

11 reviews

  • anansi75431688님의 프로필 이미지
    anansi75431688

    Reviews 1

    Average Rating 5.0

    5

    32% enrolled

    • slasnrndu4468님의 프로필 이미지
      slasnrndu4468

      Reviews 4

      Average Rating 5.0

      5

      32% enrolled

      • genius17888330님의 프로필 이미지
        genius17888330

        Reviews 11

        Average Rating 5.0

        5

        36% enrolled

        • devhoney님의 프로필 이미지
          devhoney

          Reviews 2

          Average Rating 5.0

          5

          98% enrolled

          Backend side only provides code It helped me understand the basics of how to use the next.js framework for frontend and the directory structure. I think having time to go through the theoretical parts and try building it myself once more would help with internalizing it.

          • ju0님의 프로필 이미지
            ju0

            Reviews 12

            Average Rating 4.9

            5

            98% enrolled

            $51.70

            zk202308a5410's other courses

            Check out other courses by the instructor!

            Similar courses

            Explore other courses in the same field!