전체 글 183

템플릿에서 조건식 vs Computed

endDt가 있을 때는 2024-10-28 ~ 2024-10-30없을 때는 2024-10-28 이라고 써주고 싶을 땐... 1. 템플릿에서 조건식 사용 {{ startDT }} {{ endDt ? " ~ " + endDt : "" }}endDt가 있으면 startDT ~ endDt 형태로, 없으면 startDT만 보여줌. 조건식을 템플릿에 직접 작성하여 필요한 값을 표시함 장점직관적: 바로 값이 어떻게 변하는지 보임간단한 조건 처리에 적합: 조건이 복잡하지 않은 경우 편리단점가독성: 조건식이 복잡해질 경우 템플릿이 지저분해질 수 있음복잡한 로직에 불리함: 로직이 길어지면 관리가 어려워질 수 있음.2. Computed 속성 사용computed: { formattedDate() { return thi..

Vue 2024.10.28

MySQL root 비밀번호 재설정

일반 유저로 DDL 넣으려는데 디나이 당해버림보 root 계정 패스워드 잊어버림프절 ※ 모든 권한 받은 일반 유저 패스워드를 알고 있으면 요로코롬 할 수 있습니다람쥐 기본적으로 MariaDB 및 MySQL에서 root 계정은 시스템 전체에 대한 최고 관리자 권한을 가진 사용자이며,root 계정에 대한 비밀번호 변경 작업은 동등하거나 더 높은 권한을 가진 사용자만이 수행할 수 있습니다.  버전은SELECT VERSION();-----------------10.6.12-MariaDB----------------- 였삼먼저 혹시 모르니까 백업을 했습니다람쥐 특정 데이터베이스만 하려면 mysqldump -u root -p my_database > my_database_backup.sql 모든 데이터베이스 하려면..

DB 2024.10.23

Spring MVC가 아닌 Boot RestAPI에서 DispatcherServlet 동작 흐름

https://99duuk.tistory.com/118 Spring MVC 설정 파일 이해하기 : web.xml & dispatcher-servlet.xmlweb.xml는 서블릿 컨테이너에 대한 전반적인 설정을 담당한다.1. DispatcherServlet 정의2. URL 패턴과 DispatcherServlet 매핑3. Spring 설정 파일 위치 지정4. ContextLoaderListener 등록 (필요한 경우) dispatcher org.sprin99duuk.tistory.com읽다가 문득 View를 사용하지 않는 구조에서는 어떻게 되나 싶어서 비교해봄   | Spring MVC 프로세스1. DispatcherServlet- 모든 요청이 DispatcherServlet으로 들어옴- Front Con..

Spring Boot 2024.10.22

일급 컬렉션

| 일급 컬렉션(First-Class Collection)일급 컬렉션은 컬렉션을 포함한 클래스를 만들어 사용하는 방식을 말함이 클래스는 해당 컬렉션 하나만 필드로 가지며, 그 컬렉션과 관련된 동작을 함께 정의함  - 단일 책임 원칙: 일급 컬렉션은 하나의 컬렉션에 대한 책임만 가짐- 불변성: 컬렉션의 불변성을 보장할 수 있음- 상태와 행위의 결합: 컬렉션과 관련된 동작을 한 곳에서 관리- 비즈니스 로직 캡슐화: 컬렉션과 관련된 비즈니스 로직을 해당 클래스 내에 캡슐화- 이름이 있는 컬렉션: 컬렉션의 의도를 명확히 표현할 수 있음 일급 컬렉션은 마치 특별한 용도의 상자와 같습니다. 일반 컬렉션이 그냥 물건을 담는 평범한 상자라면, 일급 컬렉션은 특정 종류의 물건만 담을 수 있고, 그 물건들을 어떻게 다뤄야..

Java 2024.10.21

정적 팩토리 메서드

| 정적 팩토리 메서드는 객체를 만드는 특별한 방법임일반적인 생성자 대신, 클래스 안에 객체를 만드는 전용 메서드를 만들어 사용함.이 메서드는 이름을 가질 수 있어서 객체가 어떤 목적으로 만들어지는지 더 명확하게 알 수 있음  레고 세트를 생각해보세요. 보통은 설명서를 따라 직접 조립하지만(일반 생성자), 때로는 이미 조립된 부분(예: 우주선 조종석)을 구매할 수 있습니다. 이렇게 미리 조립된 부분을 제공하는 것이 정적 팩토리 메서드와 비슷합니다. 목적에 맞게 미리 구성된 객체를 제공받는 것이죠.   | 정적 팩토리 메서드는 객체 생성을 캡슐화하는 디자인 패턴임- 이름을 가질 수 있어 생성 목적을 명확하게 표현할 수 있음- 호출될 때마다 새 객체를 생성할 필요가 없음 (캐싱, 객체 풀링 등 가능)- 반환..

Java 2024.10.21

vue-query 맛보기

언젠가 써봐야지..1. vue-query를 사용하지 않은 기존 방식기존 방식으로 데이터를 페칭할 때는 fetch, 상태 변수 관리, 에러 핸들링 등을 직접 작성import { ref, onMounted } from '@vue/composition-api';export default { setup() { // 상태 변수 정의 const data = ref(null); const isLoading = ref(true); const isError = ref(false); // 데이터 패칭 함수 const fetchUsers = async () => { isLoading.value = true; isError.value = false; try { ..

Vue 2024.10.18

스크립트 요소 순서

문득 순서가 개판이길래... 스크립트 요소의 순서를 정하는 것은 가독성과 유지보수에 도움이 된다는 지피티의 말..공식적인 규칙은 없지만, 일반적으로 많이 사용되는 컨벤션이 있다고 함... 일관성을 유지하고 가독성을 높혀 협업에 도움이 된다고 함...   name: 컴포넌트 이름components: 컴포넌트 등록directives: 커스텀 디렉티브 등록mixins: 재사용 가능한 로직을 포함extends: 다른 컴포넌트를 상속props: 부모로부터 전달받는 속성 정의emits: 컴포넌트에서 발생하는 이벤트 정의data: 컴포넌트의 상태 정의 (반환된 객체로 작성)computed: 계산된 속성 (종속성을 기반으로 데이터를 자동 업데이트)watch: 데이터 변경 시 특정 로직 실행lifecycle hooks:..

Vue 2024.10.18

promise 사용

약속!!! ㅁ Promise.all()Promise.all([promiseA, promiseB]) .then(results => { console.log('모든 프로미스 완료:', results); }) .catch(error => { console.error('하나 이상의 프로미스 실패:', error); }); 여러 프로미스를 병렬로 실행하고, 모두 완료될 때까지 기다림사용 사례: 동시에 여러 API 요청을 하고, 모두 성공했을 때 결과를 처리해야 할 때 사용주의점: 하나의 프로미스라도 실패하면 전체가 실패하며, catch()가 호출 ㅁ Promise.race()Promise.race([promiseA, promiseB]) .then(result => { console.log..

Vue 2024.10.18