🌱[구디아카데미 IT국비지원]

김희진·2023년 4월 18일

Calendar 기본API IT국비지원 Java 구디아카데미

GDJ 66기 - 클라우드 활용 자바 개발자 양성과정

목록 보기

10/25

[구디아카데미 IT국비지원] 1주차에 배운 내용을 복습하고, Calendar 기본API 사용하는 방법을 배우고 직접 캘린더 프로그램을 만들어보았다.

💡 1주차 복습

객체지향언어
현실과 똑같은 개념의 코딩
ex) 기능(함수)가 밖에 따로 있는지, 안에 같이 넣는지의 차이. 예를 들어 게임 코딩시 기사 캐릭터의 공격 기능이 기사 안에 들어있으면 객체지향, 기사 캐릭터와 공격 기능이 따로 존재하면 함수지향이다.
8비트=1바이트

🧐주말에 필기한 내용들 한번더 정리하기!

💡 java.util.Calendar 기본API

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import = "java.util.Calendar" %>
<%
	// Calendar c = new Calendar(); // 문법적으로 왜 안되는지는 나중에 배울 것..
	Calendar c = Calendar.getInstance();
	
	String yoil = "";
	switch(c.get(Calendar.DAY_OF_WEEK)) {
		case 1 :
			yoil = "일";
			break;
		case 2 :
			yoil = "월";
			break;
		case 3 :
			yoil = "화";
			break;
		case 4 :
			yoil = "수";
			break;
		case 5 :
			yoil = "목";
			break;
		case 6 :
			yoil = "금";
			break;
		case 7 :
			yoil = "토";
	}
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
	<div>
		Calendar.getInstance() : <%=c%>
		<!-- 오늘 날짜에 대한 모든 정보가 들어있음 (여기에는 위치또한 포함됨, 왜냐면 위치에 따라 날짜정보도 달라지기 때문에) -->
	</div>
	<!-- static 메서드이므로 클래스명(Calendar)으로 호출가능, 클래스명은 대문자로 시작하므로, 대문자면 static 메서드임 -->
	<div>Year : <%=c.get(Calendar.YEAR)%></div>
	<div>Month : <%=c.get(Calendar.MONTH)%></div>
	<!-- 주의! 0월부터 시작하므로, +1해서 읽어야 한다 -->
	<div>Date : <%=c.get(Calendar.DATE)%></div>
	<div>이번주의 몇번째 날인지 : <%=c.get(Calendar.DAY_OF_WEEK)%></div>
	<!--  주의! 요일은 일요일부터 1로 시작함, 일월화수목금토 (1,2,3,4,5,6,7) -->
	<div>요일 : <%=yoil%>요일</div>
	<div>현재달의 마지막 날짜 : <%=c.getActualMaximum(Calendar.DATE)%></div>
</body>
</html>

지난 시간부터 유용하게 사용되었던 Calendar 메서드에 대해 더 자세히 배웠다. 호출시 c.YEAR이 아닌, 클래스 명인 Calendar.YEAR 라고 호출하는 것을 보면 static 메서드라는 것을 알 수 있다. (static 메서드는 클래스명으로 출력 가능, 즉 클래스명은 대문자로 시작하므로 대문자로 시작하는지를 기준으로 보면 구분 가능하다!)
page import = "java.util.Calendar" : 패키지명 생략
사용방법 : 오늘 날짜가 기준

Calendar c = Calendar.getInstance();
c.get(Calendar.YEAR)

Calendar.getInstance() : <%=c%> : Calendar 메서드가 가지고 있는 정보를 출력할 수 있다. 출력하면 무수한 정보가 나온다. 이 정보에는 날짜뿐만이 아니라 현재 위치도 포함된다. 위치에 따라 날짜 정보는 바뀔 수 있기 때문이다.

java.util.GregorianCalendar[time=1681788425121,areFieldsSet=true,areAllFieldsSet=true,lenient=true,zone=sun.util.calendar.ZoneInfo[id="Asia/Seoul",offset=32400000,dstSavings=0,useDaylight=false,transitions=30,lastRule=null],firstDayOfWeek=1,minimalDaysInFirstWeek=1,ERA=1,YEAR=2023,MONTH=3,WEEK_OF_YEAR=16,WEEK_OF_MONTH=4,DAY_OF_MONTH=18,DAY_OF_YEAR=108,DAY_OF_WEEK=3,DAY_OF_WEEK_IN_MONTH=3,AM_PM=1,HOUR=0,HOUR_OF_DAY=12,MINUTE=27,SECOND=5,MILLISECOND=121,ZONE_OFFSET=32400000,DST_OFFSET=0]

어떤 정보를 담고 있는지 항상 기억하는 것은 힘들기 때문에 이렇게 가지고 있는 정보를 출력해보고, 여기에서 원하는 정보를 뽑아 사용하면 좋다.

c.get(Calendar.DAY_OF_WEEK)) : 오늘 날짜가 이번주의 몇번째 날인지(무슨 요일인지) 출력할 수 있다. 이때 출력되는 값은 일요일부터 토요일까지 1,2,3,4,5,6,7이다.
c.get(Calendar.MONTH) : 오늘 날짜가 몇월인지 출력할 수 있다. 단, 월은 0월부터 시작하기 때문에 +1을 해서 읽어야하므로 주의한다! (1월=0월, 12월=11월)
c.getActualMaximum(Calendar.DATE) : 오늘 날짜의 월의 마지막일이 몇일인지 출력할 수 있다. 중간에 Actual을 빼먹으면 캘린더의 최대값인 31만 출력되므로 주의 해야 한다!

💡 실습

지금까지 배운 내용으로 전체 월의 달력을 출력하는 프로그램을 만드는 실습시간을 가졌다.

📌 달력 프로그램 만들기

✔ 구현해야할 점

bootstrap 스타일
일요일 색상 RED (토요일도 파란색으로 해보기)
날짜 클릭시 일정입력 폼으로 이동
1일 앞에 회색으로 날짜 출력, 마지막날 뒤에 회색으로 날짜 출력

📍 작성 (1) - calendar.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import = "java.util.Calendar" %>
<%
	int targetYear = 0; // 변수의 생명주기때문에 if문보다 먼저 변수 선언해야함
	int targetMonth = 0;
	
 	if(request.getParameter("targetYear") == null
 			|| request.getParameter("targetMonth") == null ) {
 		Calendar today = Calendar.getInstance();
 		targetYear = today.get(Calendar.YEAR);
 		targetMonth = today.get(Calendar.MONTH);
 	} else {
		targetYear = Integer.parseInt(request.getParameter("targetYear"));
		targetMonth = Integer.parseInt(request.getParameter("targetMonth"));
		if(targetMonth == -1){ // 1월 전으로 가면 작년
			targetMonth = 11;
			targetYear = targetYear - 1;
		} else if(targetMonth == 12) { // 12월 후로 가면 내년
			targetMonth = 0;
			targetYear = targetYear + 1;
		}
 	}
 	
 	// 디버깅 코드
 	// http://localhost/ex17/calendar.jsp?targetYear=2023&targetMonth=11
	// http://localhost/ex17/calendar.jsp
 	System.out.println(targetYear + "<-- targetYear");
 	System.out.println(targetMonth + "<-- targetMonth");
 	
 	Calendar firstDate = Calendar.getInstance(); // 오늘 날짜 뽑기
 	
 	// 출력하고자 하는 년/월/1일
 	firstDate.set(Calendar.YEAR, targetYear); // set 바꾸겠다
 	firstDate.set(Calendar.MONTH, targetMonth);
 	firstDate.set(Calendar.DATE, 1);
 	
 	// 달력 1일 앞의 공백(td) 수 구하기
 	// 현재 월의 1일의 Day_OF_WEEK (일요일부터 1,2,3,4,5,6,7 토요일까지) - 1 // 칸의 갯수를 구하는 것이기 때문에 1을 빼준다
 	int startTdBlank = 0;
 	startTdBlank = firstDate.get(Calendar.DAY_OF_WEEK) - 1;
 	System.out.println(startTdBlank + " <-- startTdBlank"); // 디버깅
 	
 	// 출력하고자 하는 년/월/마지막날짜
 	int endDateNum = firstDate.getActualMaximum(Calendar.DATE); // Actual 차이..?
 	System.out.println(endDateNum + "<-- endDateNum");
 	
 	// 달력 마지막날짜 출력 후 공백(td)의 수 구하기
 	int endTdBlank = 0;
 	if((startTdBlank + endDateNum) % 7 != 0) {
 		endTdBlank = 7 - ((startTdBlank + endDateNum) % 7); // 나누어 떨어지지 않으면 뒤에 공백이 생김, 그 공백은 일~토 총 7칸에서 빼면 됨
 	}
 	int totalTdCnt = startTdBlank + endDateNum + endTdBlank;
 	System.out.println(endTdBlank + "<-- endTdBlank");
 	System.out.println(totalTdCnt + "<-- totalTdCnt");
 	
 	// 전월 마지막날짜 구하기
 	Calendar preDate = Calendar.getInstance();
 	preDate.set(Calendar.YEAR, targetYear);
	preDate.set(Calendar.MONTH, targetMonth-1);
	int preEndDate = preDate.getActualMaximum(Calendar.DATE);
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>calendar.jsp</title>
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
	<style>
		a {text-decoration: none;}
		a:hover {text-decoration: underline;}
	</style>
</head>
<body>
<div class="container">
	<h1>
		<a href="./calendar.jsp?targetYear=<%=targetYear%>&targetMonth=<%=targetMonth - 1%>">이전달</a>
		<%=targetYear%>년 <%=targetMonth + 1%>월 <!-- 표시는 +1월 -->
		<a href="./calendar.jsp?targetYear=<%=targetYear%>&targetMonth=<%=targetMonth + 1%>">다음달</a>
	</h1>
	<table class="table table-striped">
		<thead>
			<tr>
				<th>일</th>
				<th>월</th>
				<th>화</th>
				<th>수</th>
				<th>목</th>
				<th>금</th>
				<th>토</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<%
					for(int i=0; i<totalTdCnt; i++) {
						if(i%7 == 0){
				%>
							</tr><tr>
				<%
						}
						int dateNum = i - startTdBlank + 1;
						if(dateNum > 0 && dateNum <= endDateNum) { // 1일부터 마지막일까지 출력
							if(i % 7 == 0) {
				%>
								<td>
									<a class="text-danger" href="./diary.jsp?targetYear=<%=targetYear%>&targetMonth=<%=targetMonth%>&dateNum=<%=dateNum%>" target="_blank">
										<%=dateNum%>
									</a>
								</td>
				<% 
							} else if(i % 7 == 6) {
				%>
								<td>
									<a class="text-primary" href="./diary.jsp?targetYear=<%=targetYear%>&targetMonth=<%=targetMonth%>&dateNum=<%=dateNum%>" target="_blank">
										<%=dateNum%>
									</a>
								</td>
				<%
							} else {
				%>
								<td>
									<a class="text-dark" href="./diary.jsp?targetYear=<%=targetYear%>&targetMonth=<%=targetMonth%>&dateNum=<%=dateNum%>" target="_blank">
										<%=dateNum%>
									</a>
								</td>
				<%
							}	
						} else if(dateNum < 1){
				%>
							<td class="text-black-50">
								<%=preEndDate + dateNum%>
							</td>
				<%			
						} else {
				%>
							<td class="text-black-50">
								<%=dateNum - endDateNum%>
							</td>
				<%
						}
					}
				%>
			</tr>
		</tbody>
	</table>
</div>
</body>
</html>

코드를 외우려고 하지 말고 알고리즘을 전체적으로 이해하기
디버깅 코드 잘 작성하기
set 메서드 활용하기

 	// 출력하고자 하는 년/월/1일
 	firstDate.set(Calendar.YEAR, targetYear); // set 바꾸겠다
 	firstDate.set(Calendar.MONTH, targetMonth);
 	firstDate.set(Calendar.DATE, 1);

부트스트랩5 이용해서 css 하기
a태그 링크에 값 포함하기

<a href="./calendar.jsp?targetYear=<%=targetYear%>&targetMonth=<%=targetMonth - 1%>">이전달</a>
<%=targetYear%>년 <%=targetMonth + 1%>월 <!-- 표시는 +1월 -->
<a href="./calendar.jsp?targetYear=<%=targetYear%>&targetMonth=<%=targetMonth + 1%>">다음달</a>

⭐주소? 키=값 & 키=값 형식으로 작성!

📍 결과

📍 작성 (2) - diary.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	int targetYear = Integer.parseInt(request.getParameter("targetYear"));
	int targetMonth = Integer.parseInt(request.getParameter("targetMonth"));
	int dateNum = Integer.parseInt(request.getParameter("dateNum"));
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
	<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet">
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
	<h3><%=targetYear%>년 <%=targetMonth + 1%>월 <%=dateNum%>일의 일정을 입력하세요</h3>
	<form>
		<table>
			<tr>
				<th>제목</th>
				<td><input type="text"></td>
				<td><input type="checkbox">중요</td>
			</tr>
			<tr>
				<th>장소</th>
				<td><input type="text"></td>
				<td>지도첨부<input type="file"></td>
			</tr>
			<tr>
				<th>일시</th>
				<td><input type ="date"></td>
				<td><input type="checkbox">종일</td>
			</tr>
			<tr>
				<th>참석자</th>
				<td><input type="text"></td>
				<td><input type="button" value="네이버 주소록"></td>
			</tr>
			<tr>
				<th>공개</th>
				<td colspan = "2">
					<input type="radio" name="open">기본
					<input type="radio" name="open">비공개
				</td>
				<!-- <td></td> -->
			</tr>
			<tr>
				<th>설명</th>
				<td colspan = "2"><textarea rows="3" cols="50"></textarea></td>
				<!-- <td></td> -->
			</tr>
			<tr>
				<th>파일</th>
				<td colspan = "2"><input type="file"></td>
				<!-- <td></td> -->
			</tr>
			<tr>
				<th>알림</th>
				<td colspan = "2">
					<select id = "alarm">
						<option value = "10분전">10분전</option>
						<option value = "1시간전">1시간전</option>
						<option value = "하루전">하루전</option>
					</select>
				</td>
				<!-- <td></td> -->
			</tr>
		</table>
			<button type="submit">저장</button>
			<button type="reset">취소</button>
	</form>
</body>
</html>

값 불러오고 int 타입으로 바꾸기

int targetYear = Integer.parseInt(request.getParameter("targetYear"));
int targetMonth = Integer.parseInt(request.getParameter("targetMonth"));
int dateNum = Integer.parseInt(request.getParameter("dateNum"));

📍 결과

달력의 날짜를 클릭하면 해당 페이지가 출력된다.

🧐 개선점

이번 수업은 복습과 실습 위주로 이루어졌는데, 실습은 항상 어려운 것 같다. 복잡한 알고리즘을 계속해서 들여다보고 읽어보고 해석해보면서 익숙해지는 것이 가장 중요하다는 생각이 들었다. 코드를 단순히 달달 외우기만 하면 절대 내것이 될 수 없을 것이다. 이번 과제는 수시로 들여다보면서 익숙해져야겠다.

김희진

하루 한걸음씩💪 초보 개발자 도전기 🌱💻

이전 포스트