전체 글

이번에는 리액트에서 CSS 스타일을 적용시키는 방법들을 알아보려고 한다.하나씩 살펴보자.00. 사전준비./component/Hello.jsexport default function(){ return hello component}먼저 CSS 스타일을 적용시킬 컴포넌트를 정의해준다.App.jsimport logo from './logo.svg';import './App.css';import Hello from './component/Hello'function App() { return ( );}export default App;이후 해당 컴포넌트를 App Component에 추가해준다.01. In-line 방식으로 적용하기먼저 태그 안에 직접적으로 CSS 스타일을 명시하는 ..

01. node.js 설치하기Node.js 사이트에 접속해서 lts 파일을 다운다운받은 인스톨러를 사용하여 설치02. 리액트 프로젝트 생성하기cmd를 열로 프로젝트를 설치할 경로로 이동cmd에 아래와 같은 명령어 입력npx create-react-app 프로젝트이름설치가 완료되면 Visual Studio 등의 에디터로 해당 프로젝트 폴더 열기03. 페이지 띄우기설치된 프로젝트에서 터미널을 띄운 후 아래 명령어 입력npm start브라우저에서 아래 경로로 접속http://localhost:3000/

지난번 JWT를 구현한 과정에 이어서 Refresh Token을 사용하여 더욱 강화된 JWT를 구현해보고자 한다.만약 JWT에 대한 기본 구현 방법을 모른다면 해당 글을 읽기 이전에 이전에 작성한 글을 먼저 읽어보길 추천한다.아래에 작성된 예제 코드도 위 링크의 코드를 기반으로 작성했음을 유의하자.먼저 Refresh Token이 왜 필요한지를 먼저 알아보자01. Refresh Token의 필요성과 장단점기존 Access Token만을 사용한 인증 방식의 문제점물론 지난번에 구현한 기초적인 jwt만으로도 간편하게 클라이언트의 요청에 다한 인가 작업을 처리할 수 있다.하지만 jwt 방식에는 큰 문제가 하나 있다.그것은 바로 jwt 토큰이 탈취되었을 경우 어떻게 대처할 것인가?에 관련된 문제이다.다들 알다시피..

이번에는 스프링부트에서 JWT를 활용한 인증 방식을 구현해보고자 한다.이때 Spring Security의 필터단에 JWT를 사용하는 커스텀 필터를 끼워넣어 구현하고자 한다.JWT의 구조에 관한 글은 이전에 작성한 글을 참고하자.그럼 바로 시작하겠다.01. 전체 동작 과정JWT를 구현하는 코드를 설명하기 전에 먼저 Spring Security를 활용하여 JWT를 동작시키는 과정을 살펴보고자 한다.하나씩 살펴보자회원가입 과정회원가입은 기존 회원가입과 다르지 않게, DTO로 회원가입 정보를 전달받으면 Controller가 이를 Service에 전달 이후 비즈니스 로직을 실행한다.위 그림에는 나오지 않지만 회원 정보를 저장할때 비밀번호를 암호화 하여 저장하는 부분만 유의하자.최초인증(로그인) 과정원래 스프링 시..

세션 방식에서의 최초 인증(로그인) 과정이미지 출처UsernamePasswordAuthenticationFilter의 내부를 살펴보기 전에 먼저, 세션 방식에서의 인증 과정을 살펴보자.먼저 클라이언트의 로그인 요청이 들어오면 UsernamePasswordAuthenticationFilter필터(위 이미지의 AuthenticationFilter)에서 요청을 가로챈다.***(1)AuthenticationFilter에서는 클라이언트 요청에 담긴 인증 정보를 가지고 UsernamePasswordAuthenticationToken 객체를 생성한다.(2)그렇게 생성한 UsernamePasswordAuthenticationToken을 AuthenticationManager에게 넘겨주면서 인증 과정을 Authentic..

H2 DB를 사용하다보면, Embedded, Server 요런 설정을 본 적이 있을 것이다.필자 같은 경우는 MySQL을 주로 사용하다가, H2를 사용해보니 위의 개념이 너무 헷갈렸다. 그래서 해당 내용에 대해 정리해 보고자 한다.01. Server 모드이미지 출처서버 모드의 경우에는 Java 애플리케이션이 실행되는 프로세스와, H2 DB가 실행되는 포트가 완전히 구별된다.이때 두 프로세스 사이의 연결은 TCP/IP 방식으로 된다고 한다.이때 서버모드로 h2 DB를 사용하기 위해서는, 별도의 프로세스를 실행시켜야 하므로 H2 Console을 다운 및 실행시킨 상태로 Java 애플리케이션을 실행해야한다.서버 모드의 장단점은 아래와 같다.프로세스 종료 후에도 데이터가 휘발되지 않고 남아있음Java 애플리케이..