Inflearn English brand logo
Inflearn English brand logo
BEST

Learning React with Spring Boot API Server through Code

Completing an API server project made with Spring Boot (ver3.1, compatible with 3.2) and React integration! Creating the entire portfolio bootcamp process as a lecture

(4.7) 63 reviews

1,095 students

React
Spring Boot
JWT
redux-toolkit
JPA
Thumbnail

This course is prepared for Basic Learners.

What you will learn!

  • React development process

  • API server development

  • JWT authentication processing

  • Redux Toolkit

  • Recoil

  • React Query

'Even beads are precious if they are strung together' - Knowing something and making it are different!


I see a lot of new employees who know React and Boot, but when it comes to actual work, they don't get results. The reason they studied hard but can't use it is probably because they lack understanding of the process.


You can use Chat GPT to create the detailed code you want, but the problem is that you can't explain what code you want.


The progress of a project requires a process or procedure that many people can agree on. And this also requires a lot of practice.

This lecture is about procedures and processes, not simple grammar or concepts. It explains the contents of the book 'Learn React with Code ( https://www.yes24.com/Product/Goods/123363647)' published in December 2023.


Additional materials or questions needed during learning are distributed through the 'Gugu Coding Group https://cafe.naver.com/gugucoding ' cafe.




Added 2025/02/24

The full code in vite and TypeScript has been added at the very end of the lecture as teaching material.


Major Change Version

React-Router version 7

React Query Version 5

Spring Boot version 3.4.2

Here is the code that has changed.


Things to keep in mind when creating vite:

https://drive.google.com/drive/folders/1t0NdcBPCN57boutJcjdKODk5DccJUixV?usp=drive_link

I added it to .



Added 2024/03/28

I have added materials using AWS Beanstalk, RDS, and S3 as attachments to the last lecture.




Create an API server using Spring Boot and use it in a React project.

In this course, we will cover examples such as:

  • Todo Example - React-Router, Axios, Paging, Querydsl Settings

  • Product Example - Axios

  • Login Processing - Redux Toolkit, JWT

  • Social login processing

  • Implementing a shopping cart

  • React Query, Recoil Practice


To-Do Example


  • For React projects, React-Router is used to move to different screens depending on the address bar.

  • Set up a common layout, You can use the back to configure the screen for each module.

  • Routing settings can be configured in a separate file for easy maintenance.

  • Learn how to design and use custom hooks to reduce redundant code.

Product Examples

  • You can directly complete file upload, upload process, modal processing for processing results, etc.

Login/social login processing, shopping cart implementation



  • Let's implement authentication processing through login processing and social login.

  • We use RTK (Redux Toolkit) to manage login status and use cookies in the browser to remember login information.


  • Let's look at how to create Access Tokens and Refresh Tokens using JWT and apply them to your project.

  • In the final chapter, we will convert the example written using React Query and Recoil.

You can check the source code used in the lecture through Github. (Link)

Recommended for
these people!

Who is this course right for?

  • For those who want to create an API server

  • For those who are struggling with how to apply React syntax

Need to know before starting?

  • JavaScript

  • Spring

  • Web programming

Hello
This is zk202308a5410

1,380

Students

74

Reviews

232

Answers

4.7

Rating

3

Courses

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

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

2015년 부터 '코드로 배우는 ..' 시리즈를 집필하고 있습니다.

ㄴ네이버 카페

 

More

Curriculum

All

99 lectures ∙ (24hr 27min)

Course Materials:

Lecture resources
Published: 
Last updated: 

Reviews

Not enough reviews.
Become the author of a review that helps everyone!