[React] React Spinner 사용 방법
2023. 7. 14. 20:11
프로그래밍/React
React Spinner axios interceptor에 적용하기 mobx를 사용해서 store 관리를 하고 있는 프로젝트에 spinner를 적용하게 되어 그 과정을 기록할 것임 React Spinner 설치 yarn add react-spinners # or npm i react-spinners Spinner component 생성 스피너 모양은 react-spinners demo 페이지에서 확인 가능 예시 import React from 'react'; import MoonLoader from "react-spinners/MoonLoader"; import { AppStore } from '../store/AppStore'; const Spinner = () => { return ( ); }; ex..
[Java] Java17 추가된 문법 및 함수 정리
2023. 7. 13. 20:04
프로그래밍/JAVA
Java17에서 추가된 문법 및 함수를 정리해보자 Sealed Classes (봉인 클래스) Sealed 클래스는 다른 클래스들이 상속을 제한하여 해당 클래스의 하위 클래스로 사용될 수 있는 제한된 집합을 정의 public sealed class Shape permits Circle, Rectangle { // 클래스 정의 } final class Circle extends Shape { // 클래스 정의 } non-sealed class Rectangle extends Shape { // 클래스 정의 } Pattern Matching for switch (스위치 패턴 매칭) 스위치 문에서 패턴 매칭을 사용하여 다양한 조건을 처리할 수 있음 int dayOfWeek = 3; String dayType =..
[JPA] 영속성 이해하기
2023. 7. 12. 20:34
프로그래밍/JPA
JPA의 영속성이란? 객체의 상태를 지속적으로 유지하는 기능을 의미 영속성은 객체를 관계형 DB와 연결하여 객체의 상태 변경을 DB에 자동으로 반영하고, DB의 변경을 객체에 자동으로 반영하는 기능을 제공 JPA의 영속성을 이해하기 위한 주요 개념 1. 엔티티(Entity) JPA에서 관리되는 객체로, DB 테이블과 매핑되는 클래스 영속성 컨텍스트에서 관리하는 대상 2. 엔티티 매니저(Entity Manager) JPA에서 엔티티를 관리하는 주체로 DB와의 통신을 담당 영속성 컨텍스트를 생성하고, 엔티티의 생명주기를 관리 3. 영속성 컨텍스트(Persistence Context) 엔티티의 상태를 관리하는 논리적인 영역 엔티티의 변경을 추적하고, 변경 내용을 DB에 동기화 예시 - User 엔티티 @Ent..
[리눅스마스터] 리눅스마스터 2급 기출 자료
2023. 7. 11. 23:27
자격증/리눅스마스터
리눅스 마스터 2급 기출 자료 리눅스 마스터2급 2차 공부를 위한 기출 자료 사이트 공유 ↓ https://www.comcbt.com/xe/r2 리눅스마스터 2급 필기 기출문제 전자문제집 CBT - 최강 자격증 기출문제 전자문제집 CBT 리눅스마스터 2급 필기 기출문제 전자문제집 CBT www.comcbt.com
[React] axios progress bar 추가
2023. 7. 10. 20:02
프로그래밍/React
aixos 프로그레스 바 추가 방법 1. NProgress 설치 npm i nprogress # or yarn add nprogress 2. NProgress 사용 방법 aixos interceptor 실행 중, 종료, NProgress.start(); NProgress.done(); 예시 axios.interceptors.request.use( config => { NProgress.start(); // 프로그래스바 시작 return config; }, error => Promise.reject(error) ); axios.interceptors.response.use( response => { NProgress.done(); // 프로그래스바 완료 return ... }, error => { NPro..
[Javascript] 자바스크립트 slice와 splice 비교
2023. 7. 7. 20:01
프로그래밍/JavaScript
slice 배열의 일부분을 추출하여 새로운 배열을 반환 원본 배열은 변경되지 않음 사용 방법 array.slice(startIndex, endIndex); startIndex - 추출 시작 인덱스 (포함). 음수 값이면 배열의 끝에서부터 카운트 endIndex - 추출 종료 인덱스 (제외). 생략하면 배열의 끝까지 추출. 음수 값이면 배열의 끝에서부터 카운트 예시 const numbers = [1, 2, 3, 4, 5]; const slicedNumbers = numbers.slice(1, 4); console.log(slicedNumbers); // [2, 3, 4] splice 배열에서 요소를 추가, 삭제 또는 교체하는데 사용 원본 배열을 수정함 사용 방법 array.splice(startIndex,..
[Javascript] 숫자인지 체크하는 방법
2023. 7. 6. 20:30
프로그래밍/JavaScript
isNaN() isNaN() 함수는 주어진 값이 "Not-a-Number"인지 여부를 판별하는 함수 전달된 값이 숫자가 아닌 경우 true를 반환, 숫자인 경우 false를 반환 예시 console.log(isNaN(123)); // 출력: false console.log(isNaN('Hello')); // 출력: true console.log(isNaN('123')); // 출력: false console.log(isNaN('123abc')); // 출력: true console.log(isNaN(NaN)); // 출력: true console.log(isNaN(null)); // 출력: false console.log(isNaN(undefined)); // 출력: true isNaN(123): 숫자 ..
[MySQL] CASE WHEN 조건문
2023. 7. 5. 20:56
프로그래밍/SQL
CASE WHEN 조건문 CASE WHEN condition1 THEN result1 WHEN condition2 THEN result2 ... ELSE result END - WHEN과 THEN은 한쌍으로 존재 - WHEN 에 조건문 THEN 에 결과를 입력 - ELSE 절은 모든 조건이 거짓일 때 반환할 기본 값 - ELSE 절을 생략할 경우, 모든 조건이 거짓인 경우 NULL 반환 예시 SELECT quantity, price, CASE WHEN quantity >= 10 THEN '많음' WHEN quantity >= 5 THEN '보통' ELSE '적음' END AS quantity_category FROM orders;