Axios는 브라우저와 Node.js 환경에서 모두 사용할 수 있는 Promise 기반 HTTP 클라이언트 라이브러리입니다. 주로 API와의 통신을 쉽게 구현하기 위해 사용되며, RESTful API와 상호작용하는 작업에서 자주 사용됩니다. React, Vue, Angular 등 여러 프레임워크에서 널리 사용되고 있습니다.주요 기능Axios의 주요 기능은 다음과 같습니다:HTTP 요청:GET, POST, PUT, DELETE, PATCH와 같은 HTTP 요청을 쉽게 보낼 수 있습니다.Promise 기반:async/await 구문을 통해 비동기 요청을 간단히 다룰 수 있습니다.자동 JSON 데이터 변환:요청 본문이나 응답 데이터를 JSON으로 자동 변환하므로, JSON.stringify나 JSON.pars..

Promise 기반이란 비동기 작업의 완료 또는 실패 상태를 나타내기 위해 Promise 객체를 사용하는 방식을 의미합니다. 비동기 작업은 서버에 데이터를 요청하는 것처럼 시간이 걸리는 작업을 수행할 때 자주 사용되며, 이러한 작업의 성공 또는 실패를 처리하는 구조로 Promise가 사용됩니다.Promise란?Promise는 자바스크립트에서 제공하는 객체로, 비동기 작업이 끝난 후의 결과를 다루기 위한 패턴입니다. 약속된 값을 나타내며, 작업이 완료되거나 실패했을 때 해당 결과를 받을 수 있도록 해줍니다.Promise의 상태Promise는 다음과 같은 세 가지 상태를 가집니다:Pending (대기): 비동기 작업이 아직 완료되지 않은 상태입니다.Fulfilled (이행): 비동기 작업이 성공적으로 완료된..

1. yarn.lock, package-lock.json 등 lock 파일들을 삭제합니다2. 다음의 커맨드들을 실행한다.npm install -g npm@9.6.7npm install --legacy-peer-depsnpm install axios --legacy-peer-depsnpm install --save-dev ajv@^7 --legacy-peer-deps 3. React 애플리케이션을 시작npm start

Token웹 애플리케이션에서 클라이언트와 서버 간의 안전한 통신을 위해 토큰이 사용됩니다. HTTP는 상태 비저장(stateless) 프로토콜이기 때문에, 클라이언트의 로그인 상태를 유지하거나 사용자를 식별하기 위해 매번 인증이 필요합니다. 토큰은 사용자 인증과 권한 부여, 세션 관리 등을 보다 안전하고 효율적으로 처리하며, 이를 통해 웹 애플리케이션의 보안성과 확장성을 크게 향상시킵니다.토큰의 생성과 전송 과정인증 과정: 사용자가 로그인을 하면 서버는 사용자의 자격 증명을 확인하고, 이를 바탕으로 토큰을 생성하여 반환합니다. 이 토큰은 주로 JSON Web Token (JWT) 형식으로, 서버만이 검증할 수 있는 서명(Signature)과 인증에 필요한 정보를 포함하고 있습니다.토큰의 구조: JWT를 ..

JPASection SummaryGetting StartedCore conceptsDefining Repository InterfacesConfigurationPersisting EntitiesDefining Query MethodsJPA Query Methods ProjectionsStored ProceduresSpecificationsQuery by ExampleTransactionalityLockingAuditingMerging persistence unitsCDI IntegrationCustom Repository ImplementationsPublishing Events from Aggregate RootsNull Handling of Repository MethodsSpring Data Ext..

Context API는 React에서 컴포넌트 간에 데이터를 전역적으로 공유할 수 있게 해주는 기능입니다. 일반적으로 React에서는 부모에서 자식 컴포넌트로 데이터를 props로 전달하지만, Context API를 사용하면 props를 거치지 않고도 여러 컴포넌트에 쉽게 접근할 수 있는 전역 데이터를 생성할 수 있습니다. 이 기능은 트리 구조가 깊은 컴포넌트들 간에 데이터를 공유해야 할 때 특히 유용합니다.Context API의 주요 개념과 사용법Context 생성 (React.createContext):createContext 함수를 사용해 새로운 Context를 만듭니다. 생성한 Context에는 기본값을 설정할 수 있습니다.import React, { createContext } from 'rea..