[2026-05-06] 자바 웹 개발의 시작: JSP 웹 페이지와 JDBC 연동 (WebStudy 시작)

드디어 자바 데스크톱(Swing) 애플리케이션 환경을 벗어나, 브라우저를 통해 서비스되는 본격적인 웹(Web) 개발 학습으로 넘어왔다. 이를 위해 새로운 리포지토리(WebStudy)를 구축하고, JSP(JavaServer Pages)를 활용하여 맛집 데이터를 웹 화면에 출력하는 실전 예제를 구현했다.

 

1. JSP(JavaServer Pages)와 스크립틀릿(Scriptlet)의 이해

• 패러다임의 전환: Swing에서는 자바 코드로 UI 컴포넌트를 그렸지만, 웹에서는 HTML과 CSS로 화면의 골격을 잡고 그 사이에 자바 코드를 끼워 넣어 동적인 데이터를 출력하는 구조다.
• 스크립틀릿 <% %>: HTML 페이지 최상단에 자바 로직을 작성하는 영역이다. 이곳에서 FoodDAO 객체를 생성하고 DB에서 List<FoodVO>를 가져오는 등 순수 자바 코드를 실행했다.
• 출력식 <%= %>: 스크립틀릿 내부가 아닌 HTML 태그 사이(예: <td><%=vo.getName() %></td>)에 자바 변수 값을 직접 출력할 때 사용하는 문법을 익혔다. 자바 로직과 HTML 뷰(View)가 한 파일에 공존하는 원시적인 웹 개발 방식을 체감했다.

2. 브라우저 요청(Request) 처리와 데이터 연동

• request.getParameter("page"): 클라이언트(웹 브라우저)가 URL의 쿼리 스트링(예: list.jsp?page=2)을 통해 전달한 값을 자바 서버 단에서 받아오는 웹 프로그래밍의 핵심 메서드를 실습했다.
• Null 처리와 형변환: 최초 접속 시에는 URL에 page 파라미터가 없으므로 null 값이 들어온다. 이를 방지하기 위해 if(strPage == null) 분기 처리를 하여 기본값을 "1"로 세팅하고, 계산을 위해 Integer.parseInt()로 형변환하는 필수적인 방어 로직을 구현했다.

3. 기존 DAO/VO 아키텍처의 웹 이식성과 오라클 페이징

• 백엔드 로직의 재사용성: 이전에 Swing에서 사용하던 FoodVO 캡슐화 객체와 FoodDAO의 싱글톤 패턴 및 JDBC 연결 코드는 웹 환경에서도 단 한 줄의 수정 없이 그대로 재사용이 가능함을 확인했다. 비즈니스 로직(DAO)과 화면(View)을 철저히 분리해야 하는 이유를 실감했다.
• 서버 사이드 페이징 적용: 오라클 12c 문법인 OFFSET ? ROWS FETCH NEXT 20 ROWS ONLY를 활용하여 총 데이터 중 20개씩만 잘라 List로 반환하는 효율적인 페이징 쿼리가 웹 브라우저 화면의 렌더링 속도에 얼마나 큰 기여를 하는지 이해했다.

4. 웹 UI 프레임워크(Bootstrap) 도입과 동적 페이징 UI

• 투박한 순수 HTML을 개선하기 위해 외부 CSS 라이브러리인 Bootstrap 3을 CDN 방식으로 링크하여 적용했다. container, row, table, btn 등의 클래스만 추가하여 세련된 반응형 그리드 화면을 손쉽게 구성했다.
• 동적 페이징 버튼: 하단의 [이전], [다음] 버튼 링크를 하드코딩하지 않고, 자바의 삼항 연산자를 활용해 href="list.jsp?page=<%=curpage>1?curpage-1:curpage %>" 형태로 작성했다. 현재 페이지가 1페이지일 때는 더 이상 이전으로 넘어가지 않도록, 마지막 페이지일 때는 다음으로 넘어가지 않도록 웹 페이지 이동 경로를 동적으로 제어하는 UX 로직을 완성했다.