Query Parameter와 Path Variable을 알아보자

Query Parameter란?쿼리 파라미터는 URL의 끝부분에 "?" 뒤에 위치하며, 데이터를 키=값 쌍으로 전달한다. 여러 쌍이 있을 경우 &로 구분한다. 보통 검색 필터링, 페이지네이션 등과 같은 비필수적인 데이터를 전달할 때 사용된다.특징위치: URL 끝에 ? 뒤에 작성된다.예시: https://example.com/products?category=shoes&color=black다중 파라미터 지원: 여러 파라미터를 &로 구분해서 보낼 수 있다.가변적 사용: 파라미터는 필수적이지 않으며 필요에 따라 추가하거나 생략할 수 있다.RESTful 규칙: 쿼리 파라미터는 데이터 조회와 같은 GET 요청에서 주로 사용되며 서버에 상태를 변경하는 작업을 할 때는 사용하지 않는 것이 일반적이다.Path Varia..

• format_list_bulleted WEB
• · 2024. 10. 4.
• textsms

[Java] JDK와 JRE의 개념과 차이점

JDK와 JRE는 자바 개발 환경을 구성하는 두 가지 중요한 개념이고 자바 애플리케이션을 개발하고 실행하는 데 필수적이다. 이 두 가지는 자바 프로그래밍에 있어서 각각 다른 역할을 하며 개발자와 사용자에게 다양한 도구와 기능을 제공한다.  JDK(Java Development Kit)JDK는 자바 개발 도구 키트로 자바 애플리케이션을 개발할 때 필요한 모든 도구들을 포함한 패키지이다.자바 애플리케이션을 개발, 컴파일, 디버깅, 실행하는 데 필요한 도구들을 제공하는 것이 JDK의 역할이다.JDK의 구성 요소JRE(Java Runtime Environment): JDK는 JRE를 포함하고 있고 JRE는 자바 애플리케이션을 실행하는 데 필요한 환경을 제공한다.Javac(자바 컴파일러): 자바 코드를 컴파일하여..

• format_list_bulleted Backend/Java
• · 2024. 9. 30.
• textsms

[React] Vite로 react 프로젝트 시작하기

Vite란?Vite 공식 사이트에 의하면 Vite는 차세대 프론트엔드 툴로 빠른 개발 서버와 빠른 번들링을 제공한다고 소개하고 있다. 특히 Vite는 개발 환경에서 모듈을 ES Module 방식으로 로드하기 때문에 새로고침 속도가 빠르고 빌드 시간이 짧다는 장점이 있다. 이 외에도 여러가지 장점이 존재하여 최근 리액트 프로젝트는 CRA(Create-React-App)이 아닌 Vite를 사용하는 편이다.CRA에서 Vite를 지향하는 이유?CRA에서 Vite를 지향하는 이유에 대해 알아보기 위해 둘의 차이점을 비교해본다면 아래와 같다.아래 예시 외에도 Vite를 사용하는 이유는 다양하기 때문에 프로젝트를 시작하기 전에 vite 공식 페이지를 참고하는 것도 좋은 방법이다. ViteVite, 차세대 프런트엔드 ..

• format_list_bulleted Frontend/React
• · 2024. 9. 29.
• textsms

[React] Hooks - useReducer

useReducer란 무엇인가?React의 useReducer Hook은 상태(state) 관리를 위한 Hooks으로 복잡한 상태 로직을 처리하거나 여러 상태 값을 다뤄야 할 때 유용하다. useState와 비슷한 역할을 하지만 상태 업데이트 로직이 복잡해질수록 useReducer는 훨씬 깔끔하고 유지보수하기 쉬운 코드를 작성할 수 있게 해준다. useReducer는 리듀서 패턴에 따라 상태와 상태를 변경하는 함수(reducer)를 함께 관리하여 useState보다 더 복잡한 상태 변화를 효율적으로 처리할 수 있도록 설계되었다. useState vs useReduceruseReducer와 useState는 모두 상태를 관리하는 데 사용되지만 사용 사례가 다를 수 있다.useState: 간단한 상태 관리에..

• format_list_bulleted Frontend/React
• · 2024. 9. 29.
• textsms

[React] Hooks - useRef

useRef란 무엇인가?React의 useRef Hook은 참조(ref)를 통해 DOM 요소나 컴포넌트 상태 값을 유지하는 데 중요한 역할을 한다. useRef는 주로 DOM 요소에 직접 접근, 불필요한 재렌더링 방지, 상태 값 유지 등의 상황에서 유용하게 사용된다.useRef는 변경 가능한 객체를 반환한다. 이 객체의 .current 프로퍼티에 값을 저장할 수 있으며 이는 컴포넌트가 다시 렌더링되더라도 값이 유지된다. 일반적으로 DOM 요소에 접근하거나 렌더링 사이에서 값을 기억하는 데 사용된다.ref 객체: useRef는 { current: null } 형태의 객체를 반환하며 이 객체는 렌더링 사이에서 값이 유지된다.DOM 접근: ref는 DOM 요소에 직접 접근할 때 주로 사용된다. ref를 통해 ..

• format_list_bulleted Frontend/React
• · 2024. 9. 29.
• textsms

[React] Hooks - useEffect

useEffect란 무엇인가?React의 useEffect Hook은 컴포넌트가 렌더링된 이후에 실행해야 하는 부수 효과(side effects)를 처리하는 데 매우 중요한 역할을 한다. useEffect는 주로 데이터 페칭, DOM 조작, 구독 및 타이머 설정 등과 같은 비동기 작업이나 기타 비정규적인 작업을 관리하기 위해 사용된다.클래스 컴포넌트의 componentDidMount, componentDidUpdate, componentWillUnmount 라이프사이클 메서드들을 함수형 컴포넌트에서 대체하기 위한 용도로 도입되었다.useEffect 사용방법useEffect는 렌더링 이후에 비동기적으로 실행되며 두 가지 개념을 포함한다.렌더링 후 실행: useEffect는 DOM이 화면에 완전히 렌더링된 ..

• format_list_bulleted Frontend/React
• · 2024. 9. 29.
• textsms