전체 글
-
React 개발 환경 설정FrontEnd/React 2023. 11. 1. 23:00
Node.js Node.js란 Chrome V8 자바스크립트 엔진으로 빌드한 자바스크립트 런타임입니다. 즉, 웹 브라우저 환경이 아닌 곳에서도 자바스크립트를 사용하여 연산할 수 있습니다. https://nodejs.org/en 프로그램 다운로드 후 설치합니다. 설치 완료 후 터미널에서 node -v 입력하여 정상적으로 설치 되었는지 확인합니다. Visual Studio Code Visual Studio Code는 Microsoft에서 오픈소스로 개발하고 있는 소스 코드 편집기입니다. https://code.visualstudio.com/ 프로그램 다운로드 후 설치합니다. React Create-React-App을 이용해서 리액트를 설치합니다. 이렇게 하면 Babel이나 Webpack 설정이 이미 다 되어..
-
ReactFrontEnd/React 2023. 11. 1. 21:00
React React는 UI를 렌더링 하는 데 관여하는 라이브러리입니다. 그리고 화면을 바꾸는 라우팅은 react-router-dom 모듈을 사용하며, 상태 관리를 위해서는 redux, mobx 등 여러 모듈을 사용하며, 빌드를 위해서는 webpack, npm 등등, 테스팅을 위해서는 Eslint, Mocha 등을 이용합니다. 컴포넌트(Component) React는 여러 컴포넌트를 이용해서 웹 앱을 개발하게 됩니다. 컴포넌트란 React로 만들어진 앱을 이루는 최소한의 단위입니다. 즉, React는 여러 컴포넌트 조각으로 되어 있습니다. 컴포넌트 종류 클래스형 컴포넌트(Class Components) class App extends Component { render() { return hi. ; } }..
-
Reactive StreamingSpring Reactive Web Application/Spring WebFlux 2023. 9. 21. 22:00
Spring WebFlux는 SSE(Server-Sent Events)를 이용해 데이터를 Streaming 할 수 있습니다. SSE는 Spring 4.2 버전부터 지원되었으며, Spring 5 버전부터 Reactor의 Publisher 타입인 Flux를 이용해 조금 더 편리한 방법으로 SSE를 사용할 수 있게 되었습니다. Note. SSE(Server-Sent Events) 클라이언트가 HTTP 연결을 통해 서버로부터 전송되는 업데이트 데이터를 지속적으로 수신할 수 있는 단방향 서버 푸시 기술입니다. SSE는 주로 클라이언트 측에서 서버로부터 전송되는 이벤트 스트림을 자동으로 수신하기 위해 사용됩니다. 다음은 Streaming으로 처리될 데이터를 데이터베이스에서 조회하는 BookService 클래스의 코..
-
WebClientSpring Reactive Web Application/Spring WebFlux 2023. 9. 16. 10:00
WebClient WebClient는 Spring 5부터 지원하는 Non-Blocking HTTP request를 위한 리액티브 웹 클라이언트로서 함수형 기반의 향상된 API를 제공합니다. WebClient는 내부적으로 HTTP 클라이언트 라이브러리에게 HTTP request를 위임하며, 기본 HTTP 클라이언트 라이브러리는 Reactor Netty입니다. WebClient는 Non-Blocking과 Blocking HTTP request를 모두 지원합니다. 다음은 WebClient를 사용한 예제 코드입니다. import lombok.extern.slf4j.Slf4j; import org.springframework.boot.ApplicationArguments; import org.springframe..
-
예외 처리Spring Reactive Web Application/Spring WebFlux 2023. 9. 16. 09:00
Spring MVC 기반의 애플리케이션에서 @ExceptionHandler나 @ControllerAdvice 등의 애너테이션을 이용하는 예외 처리 방식은 Spring WebFlux 기반의 애플리케이션에서도 사용할 수 있는 방식입니다. 이번 포스팅에서는 @ExceptionHandler나 @ControllerAdvice를 사용하는 방법 이외에 Spring WebFlux 전용 예외 처리 기법을 정리하겠습니다. Note. @ExceptionHandler, @ControllerAdvice 등의 애너테이션을 사용한 예외 처리 기법은 아래 Spring 공식 문서를 참고하시면 됩니다. https://docs.spring.io/spring-framework/reference/web/webmvc/mvc-controller..
-
R2dbcEntityTemplateSpring Reactive Web Application/Spring WebFlux 2023. 9. 10. 09:00
Spring Data 패밀리 프로젝트에서 데이터베이스에 액세스하기 위해 Repository를 사용하는 방식은 널리 알려진 방법입니다. Spring Data R2DBC는 Repository를 사용한 데이터 액세스 방식뿐만 아니라 가독성 좋은 SQL 쿼리문을 작성하는 것과 같은 자연스러운 방식으로 메서드를 조합하여 데이터베이스와 인터랙션할 수 있는 R2dbcEntityTemplate을 제공합니다. Note. 템플릿/콜백 패턴이 적용된 JdbcTemplate처럼 R2dbcEntityTemplate 역시 템플릿을 사용합니다. 단, R2dbcEntityTemplate은 JPA 기술에 사용되는 Query DSL과 유사한 방식의 Query 생성 메서드의 조합과 Entity 객체를 템플릿에 전달하여 데이터베이스와 인터..
-
Spring Data R2DBCSpring Reactive Web Application/Spring WebFlux 2023. 9. 9. 07:00
R2DBC R2DBC(Reactive Relational Database Connectivity)는 관계형 데이터베이스에 리액티브 프로그래밍 API를 제공하기 위한 개방형 사양(Specification)이면서, 드라이버 벤더가 구현하고 클라이언트가 사용하기 위한 SPI(Service Provider Interface)입니다. Note. 2022년 7월 기준 R2DBC를 지원하는 관계형 데이터베이스는 아래와 같습니다. H2 MySQL jasync-sql MySQL MariaDB Microsoft SQL Server Postgres Oracle Cloud Spanner(Google Cloud Platform) Spring Data R2DBC Spring Data R2DBC는 R2DBC 기반 Repositor..
-
함수형 엔드포인트(Functional Endpoint)Spring Reactive Web Application/Spring WebFlux 2023. 8. 26. 10:00
클라이언트의 요청 처리를 위해 애너테이션 매핑 기법을 이용하는 애너테이션 기반 모델과는 달리, 함수형 엔드 포인트에서는 들어오는 요청을 라우팅하고, 라우팅된 요청을 처리하며 결과 값을 응답으로 리턴하는 등의 모든 작업을 하나의 함수 체인에서 처리합니다. HandlerFunction Spring WebFlux의 함수형 엔드포인트는 들어오는 요청을 처리하기 위해 HandlerFunction이라는 함수형 기반의 핸들러를 사용합니다. @FunctionalInterface public interface HandlerFunction { Mono handle(ServerRequest request); } ServerRequest: HandlerFunction에 의해 처리되는 HTTP request를 표현합니다. Se..