본문 바로가기

전체 글408

[Spring] 검증(validation) - 6 Bean Validation @어노테이션 build.gradle implementation 'org.springframework.boot:spring-boot-starter-validation' 위 implementation을 한줄 추가해주면 validation을 사용할 수 있다. 추가 후 refresh gradle project. MemberVO VO에가서 어노테이션 NotBlank와 Range, NotNull과 Max에 validation.constraints를 사용할 수 있는걸 볼 수 있다. @NotBlank - 빈값 + 공백만 있는 경우 허용하지 않는다. @NotNull - null을 허용하지 않는다. @Range(min = ~ , max = ~ ) - 범위 안의 값이어야 한다. @Max(99) - 최대 99까지만 된다. MemberCo.. 2023. 10. 10.
[Spring] 검증(Validation) -5 Validator 인터페이스 https://bright-landscape.tistory.com/407 [Spring] 검증(Validation) -4, rejectValue란? [Spring] 검증(Validation) -3 , FieldError와 properties값 가져오기 [Spring] 검증(Validation) -2 BindingResult MemberController BindingResult 데이터 바인딩 과정에서 발생하는 검증 오류를 보유하고 있는 객체이다. 주로 bright-landscape.tistory.com MemberValidator supports 메서드는 특정 클래스의 유효성 검사를 지원하는지 여부를 확인한다. 이 구현에서는 주어진 클래스가 MemberVO로부터 할당 가능한지 확인하고, 가능하다면 tru.. 2023. 10. 6.
[Spring] 검증(Validation) -4, rejectValue()와 typeMismatch [Spring] 검증(Validation) -3 , FieldError와 properties값 가져오기 [Spring] 검증(Validation) -2 BindingResult MemberController BindingResult 데이터 바인딩 과정에서 발생하는 검증 오류를 보유하고 있는 객체이다. 주로 폼 데이터를 도메인 객체에 바인딩할 때 사용된다. 예를 bright-landscape.tistory.com rejectValue() , reject() 를 사용하면 FieldError , ObjectError를 직접 생성하지 않고, 깔끔하게 검증 오류를 다룰 수 있다. rejectValue() 는 FieldError 이고 reject() 는 ObjectError이다. rejectValue(@Nullab.. 2023. 10. 5.
[Spring] 검증(Validation) -3 , FieldError와 properties값 가져오기 [Spring] 검증(Validation) -2 BindingResult MemberController BindingResult 데이터 바인딩 과정에서 발생하는 검증 오류를 보유하고 있는 객체이다. 주로 폼 데이터를 도메인 객체에 바인딩할 때 사용된다. 예를 들어, 사용자가 웹 폼을 통해 입력 bright-landscape.tistory.com FieldError의 생성자 (2가지) 1. public FieldError(String objectName, String field, String defaultMessage); 2023. 9. 27.
[Spring] 검증(Validation) -2 BindingResult MemberController BindingResult 데이터 바인딩 과정에서 발생하는 검증 오류를 보유하고 있는 객체이다. 주로 폼 데이터를 도메인 객체에 바인딩할 때 사용된다. 예를 들어, 사용자가 웹 폼을 통해 입력한 데이터를 서버로 전송하고 해당 데이터를 처리하기 위해 폼 데이터를 도메인 객체에 바인딩하려 할 때 사용된다. BindingResult 객체는 바인딩 시 발생할 수 있는 검증 오류를 저장하고 관리한다. 이를 통해 개발자는 검증 오류를 쉽게 확인하고 처리할 수 있다. 데이터 바인딩 중 오류가 발생하면, 해당 오류 정보를 BindingResult 객체를 통해 확인할 수 있다. 예를 들어, 아래와 같이 컨트롤러 메서드에서 @Valid 어노테이션을 사용하여 데이터 바인딩 및 검증을 수행하고, .. 2023. 9. 27.
[Spring-Boot , React] 스프링부트와 React 연동하기 0. Redux DevTools 구글에 Redux DevTools를 치고 Crome에 추가시켜준다. https://start.spring.io/ 먼저 위 사이트에서 스프링 프로젝트를 하나 생성해서 SpringBoot로 Gradle해왔다. 1. 프론트에서 React설치하기 npx create-react-app fronted 비주얼스튜디오에서 React를 설치한다. fronted 해당 폴더에서 npm start로 해서 리액트가 실행되면 리액트 실행까지 완성이다. 2. Proxy 설정하기. ( CORS 관련 오류 방지를 위해 proxy를 설정 ) npm install http-proxy-middleware --save CORS (Cross Origin Resource Sharing) 서버와 클라이언트가 동일한.. 2023. 9. 26.
Axios 개념 보호되어 있는 글 입니다. 2023. 9. 26.
[React] 에러 react-scripts 은(는) 내부 또는 외부 명령 실행할 수 있는 프로그램 또는 배치 파일이 아닙니다. 'react-scripts'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는 배치 파일이 아닙니다. 라는 오류가 떴을 때, npm update 수행 이후 npm start를 다시 해보면, 정상적으로 실행 된다. 2023. 9. 26.
[React] Redux 사용 (store, actions, reducers, dispatch) Redux란? Redux는 JavaScript 애플리케이션의 상태 관리 라이브러리로서, 애플리케이션의 상태를 효율적으로 관리하고 상태 변화를 예측 가능하게 만든다. Redux를 사용하면 애플리케이션의 상태를 하나의 전역 객체인 "스토어 (store)"에 저장하고, 이를 관리하며 갱신할 수 있다. Redux의 핵심 구성 요소 4가지 Store (스토어): Redux 스토어는 애플리케이션의 상태를 담고 있는 객체다. 모든 상태는 스토어에 집중적으로 관리된다. Actions (액션): 액션은 애플리케이션에서 스토어로 데이터를 전달하는 객체다. 액션은 어떤 변화가 일어나야 하는지 설명하며, 스토어에서 이를 기반으로 상태를 변경한다. Reducers (리듀서): 리듀서는 액션에 따라 상태를 어떻게 변경할지를 정의.. 2023. 9. 25.
[React] Redux 개념과 동작원리 Redux Redux는 리액트 없이도 사용할 수 있는 상태관리(state management) JavaScript 라이브러리이다. 애플리케이션의 많은 부분에 필요한 "전역" 상태를 관리하는 데 도움이 된다. 왜 필요함? 상태관리가 왜필요할까? 하나의 컴포넌트가 사용하는 데이터 역할을 상태라고 본다. state 는 자주 변하고 상황에 따라 최상위 루트까지 접근을 해야하는데, 매번 props로 계속 내려주는 비효율적인 일을 생략하고, 최단거리로 사용할 수 있다. 그래서 예측이 가능하고, 예상대로 작동할 것이라는 확신을 갖도록 도와주기 때문이다. react에서는 상태와 속성(props)을 이용한 컴포넌트 단위 개발 아키텍처를 배웠다면, Redux에서는 컴포넌트와 상태를 분리하는 패턴을 배운다. Redux의 구.. 2023. 9. 25.
[React] Router -2 Nested(중첩) Router 및 Param, Navigate Nested Router 태그 안에는 태그가 존재할 수 있다. 이 경우 내의 페이지 안에 하위 경로를 설정해 지정할 수 있는데, 이것을 Nested Router라고 한다. App.js 내에 를 표시하고 싶을 경우 이라는 태그를 사용해 활성화 시킬 수 있다. IndexPage.js home이나 hello 경로로 들어갔을 때 , App.js에서 분명 IndexPage 말고도 아래에 Route가 두개 더 있어서 떠야하는데 안뜬다. 이 없어서 그렇다. Outlet을 추가해야 중첩 Router를 사용할 수 있어 위와 같이 아래에 있던 도 추가 된 것을 볼 수 있다. ReactRouterHooks React Router에는 여러 hook들을 제공하는데, 그 중 3가지 useParams - URL 파라미터 정보를 가.. 2023. 9. 22.
[React] Router -1 세팅 및 style 적용 방법 Link, NavLink Router란? 라우팅은 기본적으로 네트워크에서 경로를 선택하는 프로세스를 의미한다. 다양한 주소의 요청이 들어왔을 때 각각 맞는 콘텐츠로 이동시켜 주는 작업이라고 볼 수 있다. npm install react-router-dom router를 쓰기 위해선 설치해줘야 할 코드가 위에 있다. 이후 npm start를 통해 페이지를 띄우자. BrowserRouter.js HTML 삽입 미리보기할 수 없는 소스 위 js파일을 하나 만들어주고, component > Hello.js, Home.js component 폴더를 만든 후 그 경로 안에다가 Hello와 Home js를 만들어 content 부분을 넣어준다. App.js react-router-dom에서 BrowserRouter, Route, Routes.. 2023. 9. 22.

티스토리툴바