전체 글 189

JS - Browser Object Model

1. BOM 에 대해 알아 보자 JavaScript에서 BOM (Browser Object Model)은 웹 브라우저와 상호작용하기 위한 객체 모델입니다. BOM을 사용하면 JavaScript가 브라우저 창 및 브라우저의 기타 요소와 상호작용할 수 있습니다. BOM은 DOM(Document Object Model)과는 달리 표준화되지 않았기 때문에 브라우저마다 차이가 있을 수 있습니다. 정리프로그램을 통해 브라우저 창을 관리할 수 있도록 브라우저 요소를 객체화 시켜 놓은 것을 의미합니다. 추가 적으로 BOM은 하나의 객체만을 가리키는 것이 아니라 브라우저와 관련된 여러 객체들을 포함하며 그 구조는 최상위 객체는 window 객체와 그 하위 객체들로 이루어져 있습니다.  2. Window Object 와 ..

JS 2024.09.27

JS - Document Object Model

브라우저에 띄울 웹 페이지가 단순히 정보 전달만을 목적으로 하는 정적인 웹이라면 HTML, CSS로도 충분하겠지만 그 이상의 인터랙티브한 기능을 구현하고자 한다면 자바스크립트와 DOM을 반드시 사용해야 합니다 DOM 이란 무엇일까? (문서 객체 모델)문서 객체 모델, 즉 DOM은 웹 페이지(HTML이나 XML 문서)의 콘텐츠 및 구조, 그리고 스타일 요소를 구조화 시켜 표현하여 프로그래밍 언어가 해당 문서에 접근하여 읽고 조작할 수 있도록 API를 제공하는 일종의 인터페이스입니다. 즉 자바스크립트 같은 스크립팅 언어가 쉽게 웹 페이지에 접근하여 조작할 수 있게끔 연결시켜주는 역할을 담당합니다.  HTML 웹 페이지 문서 입니다  위의 HTML 코드를 기반으로 웹 페이지가 로드되면, 브라우저는 다음과..

JS 2024.09.27

Bank App 만들기 ( 19. 출금 기능 만들기 )

1. withdrawal.jsp 파일 생성 및 코드 추가2. 출금 화면 요청 및 기능 구현3. 전체 코드 확인4. 디버그 모드 동작 시켜 보기  withdrawal.jsp 출금 요청(인증) Bank App에 오신걸 환영합니다 출금 금액: 출금 계좌 번호: 출금 계좌 비밀 번호 : 출금 요청  결과 화면 확인  WithdrawalDTO package com.tenco.bank.dto;import lombok.AllArgsConstructor;import lombok.Builder;import lombok.Data;import lombok.NoArgsConstructor;import lombok.ToString;@Data@NoAr..

Spring boot 2024.08.14

Bank App 만들기 ( 18. 중간 리팩토링 )

리팩토링이란(Refactoring)?소프트웨어의 외부 동작을 변경하지 않으면서 내부 구조를 체계적으로 개선하는 과정을 말합니다. 이 과정은 코드의 가독성을 높이고, 유지보수를 용이하게 하며, 오류 발견 및 수정을 용이하게 하는 것을 목표로 합니다. 리팩토링은 소프트웨어 개발의 중요한 부분으로, 코드의 품질을 지속적으로 향상시키기 위해 필요합니다 리팩토링의 목적가독성 향상: 코드를 더 이해하기 쉽게 만들어 다른 개발자가 코드를 빠르게 이해하고 수정할 수 있도록 합니다.유지보수성 개선: 코드의 구조를 개선하여 나중에 버그를 수정하거나 새로운 기능을 추가할 때 필요한 노력을 줄입니다.성능 최적화: 비효율적인 코드를 개선하여 애플리케이션의 실행 성능을 향상시킬 수 있습니다.재사용성 증가: 코드의 모듈성을 높여 ..

Spring boot 2024.08.14

Bank App 만들기 ( 17. 계좌 목록 만들기(1단계) )

작업 순서1. AccountRepository, account.xml 코드 확인하기2. 계좌 목록 기능 만들기3. account/list.jsp 파일을 생성(코드 복사 후 수정)  package com.tenco.bank.repository.interfaces;import java.util.List;import org.apache.ibatis.annotations.Mapper;import org.apache.ibatis.annotations.Param;import com.tenco.bank.repository.model.Account;//AccountRepository 인터페이스와 account.xml 파일을 매칭 시킨다. @Mapper public interface AccountRepository { ..

Spring boot 2024.08.13