박서희연구소

1. useSate 소개 Component에 state 변수를 추가할 수 있는 React의 Hook이다. import { useState } from 'react' function App() { const [name, setName] = useState('Alvin') return ( {name} ) } export default App Component의 최상단에서 useState를 호출하여, 위 코드와 같이 state 변수를 선언할 수 있으며, 아래와 같은 규칙을 따른다. array destructuring(배열 구조 분해)를 사용하여, [something, setSomething] 형태의 state 변수 이름을 사용 useState(initialState)는 parameter 값으로 initial..

이 글은 스프링의 공식 문서를 읽고 정리 및 나의 생각대로 가공한 글이다. 스프링 IoC 컨테이너와 빈 소개 IoC는 의존성 주입(Dependency Injection, DI)이라고도 한다. 과정은 이렇다. 객체가 생성자 Arguments 또는 팩토리 메서드에 대한 Arguments에서 반환 객체 인스턴스에 설정된 속성을 통해서만 의존성을 정의 컨테이너는 빈을 생성할 때 의존성 주입 이 과정은 근본적으로 클래스의 직접 구성과 같은 매커니즘을 사용하여 의존성이 인스턴스화 또는 위치를 제어하게 되는 빈 자체의 역전(Inversion of Control)이다. IoC 컨테이너의 기본 패키지 구성으로는 org.springframework.beans와 org.springframework.context 가 있다. ..

[문제] 서버 개발 시, 로그 기록은 거의 필수적이라고 볼 수 있다. [목표] Spring Boot 에 Log4j2 를 연동하여 로그를 기록하는 방법을 알아본다. [해결] 환경 : Spring Boot 2.4.5, Maven, Kotlin 1.5.0 1. Dependency 추가 org.springframework.boot spring-boot-starter-log4j2 2. log4j2 설정 파일 추가 Spring Boot 는 클래스 경로에서 log4j2.xml 또는 log4j2.json 또는 log4j2.yaml 이라는 파일을 찾으면 자동으로 Log4j 를 구성한다. %d{yyyy-MM-dd HH:mm:ss.SSS} %5p ${hostName} --- [%15.15t] %-40.40c{1.} : %m..

[문제] Spring Boot 를 사용하던 중, MyBatis 가 필요한 상황이 생겼다. [목표] Spring Boot 에 MyBatis 를 연동하는 방법을 알아본다. [해결] 환경 : Spring Boot 2.4.5, Maven, Kotlin 1.5.0, MariaDB 2.7.1, MyBatis 2.1.4 DB 는 연동되어 있다고 가정하며, 사용할 테이블도 생성되어 있어야 한다. 1. Dependency 추가 org.mybatis.spring.boot mybatis-spring-boot-starter 2.1.4 2. Mapper 추가 경로 : src/main/resources/mybatis/mapper/sample(resources 이하 부터는 재량대로 설정) 생성할 mapper interface 에 ..

[문제] 백엔드 개발 시, 로깅은 굉장히 중요하다. 다양한 Java Logging Framework 가 있고, 이들이 가지고 있는 특징과 역사가 다르다. [목표] Java Loggin Framework 중 log4j, logback, log4j2 의 특징과 역사를 알아보고 비교해본다. [해결] 생산적 문제를 분석해야 한다면, 좋은 로깅을 유지해야 하는 것이 얼마나 중요한지 알고 있을 것이다. 좋은 로깅은 다음 3가지의 것들이 요구된다. 로그 메시지는 애플리케이션 내부적으로 수행하는 작업을 이해하는데 필요한 정보를 제공해야 한다. 로그 메시지 작성은 애플리케이션의 성능에 영향을 주지 않도록 최대한 효율적이어야 한다. 다른 배포 환경과 상황에 맞게 상세한 로깅 정보를 조정할 수 있어야 한다. 각각의 사용 사..

[문제] Oracle DB 에 MyBatis 를 이용해 foreach 문을 사용하던 중 문제가 발생했다. [목표] 위 문제를 해결할 방법을 알아본다. [해결] Controller) SampleDTO sampleDTO = new SampleDTO(); List list = new ArrayList(); Map map = new HashMap(); for (int count = 0; count < sampleNo.length; count++) { SampleDTO sampleInsertDTO = new SampleDTO(); sampleInsertDTO.setSampleNo(no); list.add(sampleInsertDTO); } map.put("list", list); sampleService.inse..

[문제] 개발하는 쇼핑몰 프로젝트의 Front 단 검색창 개발 중 Autocomplete(자동완성) 기능이 필요하다. [목표] jQuery 의 Autocomplete 기능을 적용해본다. Autocomplete 입력 필드에 타이핑 시 자동으로 남은 검색어를 완성해 표시해 주는 기능을 보통 자동완성 이라고 하는데, 이러한 기능을 jQuery UI 에서 이미 구현을 해놨는데, Autocomplete 라고 부른다. [해결] 환경 : JQuery 라이브러리 사용 방법 및 구현 방법 필요한 css 및 js 파일 html) 1. 배열 안에서 사용법 JavaScript) // 배열을 선언하여 사용하는 방식 $(function() { var searchSource = ['엽기떡볶이', '신전떡볶이', '걸작떡볶이', '..

[문제] jQuery 를 사용하던 중, Select box 의 제어가 필요하다. [목표] jQuery 를 사용해, Select box 를 제어하는 방법을 알아본다. [해결] Select box(셀렉트 박스) 선택 값 제어 // Select box ID 로 접근하여 선택된 값 읽기 $('#Select box ID option:selected').val(); // Select box Name 으로 접근하여 선택된 값 읽기 $('select[name=Select box Name]').val(); // span 과 같은 다른 태그 접근하기 $('span[name=Name값]').text(); // 선택된 값의 index 불러오기 var index = $('#Select box ID option').index($..