Per ardua ad astra.

- [React.js] 객체 표기법(Object Notation) 방식과 빌더 콜백 표기법(Builder Callback Notation) 방식

객체 표기법(Object Notation) 방식과 빌더 콜백 표기법(Builder Callback Notation) 방식들어가며리덕스 툴킷(Redux Toolkit, RTK)의 객체 표기법(Object Notation) 방식과 빌더 콜백 표기법(Builder Callback Notation) 방식에 대해 정리해본다. 객체 표기법(Object Notation) 방식 vs. 빌더 콜백 표기법(Builder Callback Notation) 방식RTK 버전 1.6.0 이상부터 기존의 객체 표기법(Object Notation) 방식에서 빌더 콜백 표기법(Bulder Callback Notation) 방식으로 작성해야 한다.기존의 객체 표기법은 더 이상 사용되지 않는다. 객체 표기법(Object Notation)..

- [Network] 400 오류와 401 오류의 차이점

400 오류와 401 오류의 차이점들어가며HTTP 상태 코드(Status Code)인 400 오류와 401 오류의 차이점에 대해 정리해본다. 400 오류 (Bad Request, 잘못된 요청)개념클라이언트가 보낸 요청이 잘못되었거나 서버에서 이해할 수 없을 때 반환되는 상태 코드 발생 원인요청 형식이 잘못된 경우 (JSON이나 XML 등의 데이터 포맷 오류)요청 파라미터가 누락되었거나 유효하지 않은 경우잘못된 URL이나 메서드 사용예를 들어, @GET@ 대신 @POST@를 사용한 경우클라이언트 쪽 오류로 인해 요청이 비정상적으로 구성된 경우 해결 방법요청 데이터를 검토하고 형식이 올바른지 확인한다.API 문서를 참고해 필요한 파라미터와 값이 제대로 전달되었는지 확인한다.URL이나 HTTP 메서드를 확인한..

- [React.js] .js 파일에서 Uncaught SyntaxError: Unexpected token '<' 오류 발생할 때 해결 방법 (Vite)

.js 파일에서 Uncaught SyntaxError: Unexpected token '들어가며@.js@ 파일에서 @Uncaught SyntaxError: Unexpected token '이 문제는 Vite로 만든 프로젝트에 발생하는 문제이다.  문제 발생 상황@/src/utils/links.js@ 파일에서 컴포넌트(Component)가 @value@로 들어 있는 @key@가 들어 있는 객체를 외부 컴포넌트에서 import 하여 사용하려고 할 때, 다음과 같은 오류가 발생하였다. /src/utils/links.js@icon@ 키의 값을 외부 컴포넌트에서 불러올 때 위와 같은 오류가 발생하였다.const links = [ { id: 1, text: 'stats', path: '/', ..

- [React.js] <Link> 컴포넌트와 <NavLink> 컴포넌트 비교 (React Router)

컴포넌트와 컴포넌트 비교 (React Router)들어가며리액트 라우터(React Router)에서 @@ 컴포넌트와 @@ 컴포넌트의 차이점에 대해 정리해본다.  컴포넌트개념리액트 라우터에서 제공하는 가장 기본적인 링크(Link) 컴포넌트특정 경로로 이동할 수 있는 내비게이션 링크를 생성한다.HTML의 @@ 태그와 유사하지만, 페이지 새로고침 없이 SPA(Single Page Application) 내에서 라우팅을 처리한다. 특징페이지를 새로 고침하지 않고, 클라이언트 측 라우팅을 수행한다.단순한 라우팅에 적합하다.선택된 상태에 따른 스타일링 기능은 없다. 사용 예시 코드import { Link } from "react-router-dom";function App() { return ( ..