본문 바로가기

IT49

[React] Axios 통신을 위한 Custom Hook 사용 Custom Hook이란?정규 함수와 같지만 안에 상태를 포함할 수 있는 로직 함수기존의 React Hook과 다른 Hook을 동시에 사용할 수 있다.React에서 useState or useEffect와 같은 Hook을 사용할 경우React 함수 컴포넌트에서만 호출이 가능하다.즉 일반적인 JavaScript 함수에서 호출이 불가능하다. Custom Hook이 필요한 이유위에서 본 것처럼 React Hook을 사용하기 위해서는 조건이 있다.React 함수 컴포넌트에서만 호출이 가능하다는 조건이다.따라서 일반적인 JavaScript 함수에서는 호출이 불가능하다.const MainComponent = () => { const [number,setNumber] = useState(0); return.. 2024. 8. 7.
[React] useContext 상태 갱신 문제 UseContext의 사용 이유React에서 데이터는 부모에서 자식에게 props를 통해 전달된다.그러나 application 전체에 데이터를 전달해야 줘야 할 경우 props를 사용한다면props chain이 너무 길어지는 문제점이 발생한다.따라서 useContext는 이를 해결하기 위한 Hook으로 저장소 같은 역할을 한다.따라서 명시적으로 props를 전달하지 않고도 전역 데이터를 사용할 수 있다.useContext를 통해 로그인한 유저의 정보를 저장하거나application에서 사용하는 전역 변수들을 저장소로서 저장하고 데이터 조회 및 변경도 가능하다.import React from "react";const loginContext = React.createContext({ id : 0, .. 2024. 8. 7.
[Spring boot] 이메일 전송 구현 개발 환경Spring boot 3.1.9Java 17IntelliJMaven Dependency 추가- pom.xml 수정Spring boot를 통해 이메일 인증을 구현하기 위해서는 메일 서버와 연결하기 위한라이브러리 추가 및 SMTP(프로토콜)에 대한 이해가 필요하다.SMTP 프로토콜 : 네트워크를 통해 전자우편을 전송하는 기술 표준이다.SMTP 서버 : SMTP 프로토콜을 이용해 이메일을 전송하고 수신할 수 있는 메일 서버Spring boot mail starter : 메일 서버와 연결하기 위해 필요한 라이브러리 org.springframework.boot spring-boot-starter-mail pom.xml에 해당 의존성을 추가한다.의존성 추가 후 Maven Build를 누르면 정상.. 2024. 8. 7.
[Spring boot] Restful API 등장과 ReponseEntity Restful API의 등장Restful API란 무엇일까?두 컴퓨터 시스템이 인터넷을 통해 정보를 안전하게 교환하기 위해 사용하는 인터페이스AWS에 나와있는 정의를 살펴보면 다음과 같이 정의된다. 즉 서로 다른 시스템에서 정보를 교환하고, 데이터 통신을 지향하기 위한 규약이라고 말할 수 있다. 쉽게 말하면 ServiceA라는 시스템에서 어떠한 데이터를 다른 ServiceB라는 시스템에게 전달하고자 할 때 어떠한 형태로 데이터를 보내줄지에 대한 규약이다. 배경을 좀 더 살펴보면 PC 이외에도 모바일, 태블릿 등 여러 가지의 기기들이 나오면서 해당 스마트 기기마다 서로 다른 서버를 만드는 것은 비효율적인 일이 되었다. 따라서 하나의 서버에서 데이터와 로직을 생성하고, Client Side에서만 해당 스마트.. 2024. 8. 7.
[Spring boot] Filter에서 Bean 객체 사용이 가능한 이유 Filter의 개요Filter는 Web Context에서 관리되므로 Spring의 Bean으로 등록 못한다는 설명이 많다.아래 그림은 Web Context와 Spring Context에 대한 이해를 높이는 그림이다. 해당 그림을 보면 Spring 컨테이너 보다 큰 서블릿 컨테이너의 Filter가 Spring에 의해 관리되는 것은 이상할 수 있다. 하지만 현재 Filter는 Spring Bean으로 등록 및 의존성 주입도 가능하다.예전에 Filter는 실제로 Spring 컨테이너에서 관리되지 않았고, Bean의 의존성 주입도 불가능하였다.하지만 DelegatingFilterProxy의 등장으로 Bean 등록 및 의존성 주입도 가능해졌다. DelegatingFilterProxy필터(Filter)는 서블릿이 .. 2024. 8. 7.
[Spring boot] Filter / Interceptor 세분화된 차이점 Filter / InterceptorSpring Project를 진행하다 보면 공통적인 로직이 많이 나오는 경우가 많다.중복되는 코드를 반복하는 것보다 하나의 로직으로 묶어서 처리하는 방법이 유지보수에도 유리하다.이러한 로직을 처리하기 위해 Filter, Interceptor 등을 사용한다. Filter필터(Filter)는 디스패치 서블릿에게 요청이 전달되기 전/후에 URL 패턴에 맞는 모든 요청에 대해 추가적인 로직을 처리할 수 있는 기능을 제공한다.디스패치 서블릿은 Spring Context에서 가장 앞쪽에 존재하는 front Controller이다.즉 우리가 흔히 생각하는 @Controller를 통해 만든 Controller는모두 디스패치 서블릿을 거쳐서 해당 로직을 수행하게 된다. 위의 사진을 살.. 2024. 8. 7.

loading