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

김희진·2023년 4월 11일

IT국비지원 if문 구디아카데미

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

목록 보기

6/25

[구디아카데미 IT국비지원] if문을 배워보고, 다양한 메소드(Math.random, equals)와 if문을 이용하여 여러가지 페이지를 만들었다.

💡 (복습) action 페이지 만들기

inputForm.html
form 태그 연습
(form action 태그, method는 post 타입, form 태그 안에 button 넣기, input 태그로 입력창 생성하기)

inputAction.jsp
- request.getParameter : 값 불러오기 (요청값 parameter value 처리)
- Integer.parseInt : 문자열로 불러온 값(String 타입)을 int 타입으로 바꾸기
- 웹 페이지 출력 : <%out.print()%> 와 <%=%> 두가지 방법

📍 결과

int 타입으로 변환하지 않은 값은 30이 아닌 1020으로 출력된 것을 확인할 수 있다.

💡 조건문 - if문

제어문
- 조건문
  - if문
  - switch문
- 반복문
  - for문
  - while문

✏️ 코드는 위에서 아래로 읽는다
이때, if문을 써서 건너 뛸 수 있다. (분기코드)
switch문은 break가 없으면 건너 뛰지 못한다.

if문에는 참,거짓을 구분하는 표현식과 변수가 나오게 된다.
또는 복잡한 행위를 표현하는 메소드 호출식이 나올 수도 있다!

if문은 세가지 방법으로 표현할 수 있다.

if(표현식) {}
if(표현식) {} else {}
if(표현식) {} elseif() {} elseif() {} (마지막에 else{}로 끝날 수도 있음)

📍 if문 사용예시

📌 실습1) snInput.html, snInput.jsp

if문 이용해서 나이에 따라 성인인지 아닌지 출력 가능한 액션 페이지 만들기

📍 작성 (1) - snInput.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>snInput</title>
	
	<style>
		table, td {
			border: 1px solid #000000;
		}
		table {
			border-collapse: collapse;
		}
	</style>
</head>
<body>
	<form action="./snAction.jsp" method="post">
		<table>
			<tr>
				<td>이름</td>
				<td>
					<input type="text" name="name">
				</td>
			</tr>
			<tr>
				<td>태어난 연도</td>
				<td>
					<input type="number" name="year">
				</td>
			</tr>
			<tr>
				<td>주민번호 7번째 숫자</td>
				<td>
					<input type="number" name="sn7">
				</td>
			</tr>
			<tr>
				<td colspan="2" style="text-align: center;">
					<button type="submit">입력</button>
					<!-- OOO님(나이)는 성인입니다
						 OOO님(나이)는 미성년자입니다 -->
				</td>
			</tr>
		</table>
	</form>
</body>
</html>

📍 결과

📍 작성 (2) - snInput.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
	request.setCharacterEncoding("UTF-8");

	String name = request.getParameter("name"); // 이름 불러오기
	String year = request.getParameter("year"); // 태어난 연도 불러오기
	String sn7 = request.getParameter("sn7"); // 주민번호 7번째 숫자 불러오기
	
	int y = Integer.parseInt(year); // 문자열을 숫자로 바꾸기
	int s = Integer.parseInt(sn7); // 문자열을 숫자로 바꾸기
	
	// 위 과정을 한번에 쓸 수 있다.
	// ex) int y = Integer.parseInt(String year = request.getParameter("year"));
	
	int currentYear = 2023; // 현재 년도 (되도록 사용하는 값들은 변수에 저장하는 것이 좋음)
	int age = currentYear - y; // 나이 계산하기
	
	String abult = null; // 참조변수이므로 null로 초기화
	if(age>=19) {
		abult = "성인";
	} else {
		abult = "미성년자";
	} // 성인유무 구하기
	
	String gender = null; // 참조변수이므로 null로 초기화
	if(s % 2 == 0) {
		gender = "여";
	} else {
		gender = "남";
	} // 성별 구하기
	
%>
	<div>
		<%=name%>님(<%=age%>,<%=gender%>)은 <%=abult%>입니다.
	</div>
</body>
</html>

⭐ String 타입으로 값을 불러오고, 불러온 문자열 값을 int 타입으로 바꾸는 과정을 한줄로도 표현 가능하다.

int y = Integer.parseInt(String year = request.getParameter("year"));

현재년도는 변수를 만들지 않고 2023을 넣어도 되지만, 되도록 사용할 값들은 변수에 저장하는 것이 좋다.

📍 결과

📌 실습2) dice.html, diceResult.jsp

if문과 랜덤 숫자를 발생시키는 메소드를 이용하여 주사위 게임을 할 수 있는 페이지 만들기

📍 작성 (1) - dice.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
   <div style="text-align: center">
      <img src="./img/ready.jpg" width="200" height="200">
      <img src="./img/ready.jpg" width="200" height="200">
      <div>
         <a href="./diceResult.jsp">start</a>
         <!-- 정보를 입력하는 것이 아니기 때문에 굳이 form action 태그를 쓸 필요 없이 a태그 사용 -->
      </div>
   </div>
</body>
</html>

정보를 입력하는 것이 아니기 때문에 form action 태그가 아닌 a 태그 이용

📍 결과

start 버튼을 누르면 랜덤으로 주사위 게임 결과가 나온다.

📍 작성 (2) - diceResult.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<%
	int d1 = 0; // 1~6 주사위1
	int d2 = 0; // 1~6 주사위2
	
	d1 = (int) (Math.random() * 6)+1;
	d2 = (int) (Math.random() * 6)+1;
	// Math.random()은 0.0(오차가 있기 때문에 정확한 0은 아님)~0.9까지의 값을 랜덤으로 발생 즉, int 타입이 아니라 double 타입임
	// 정수 값만 필요하므로 랜덤으로 뽑은 값을 int 타입으로 바꿔야함
	// 0부터 5까지의 수가 아닌, 1부터 6까지의 수가 필요하므로 1을 더한다
	
	// int로 바꾸는 두가지 방법
	// Math.floor은 소숫점을 버림 Math.floor(Math.random()*6+1);
	// double값을 int로 감싸도 소숫점이 버려짐 (int)(Math.random()*6+1); 이걸 형변환연산자라고함
	
	int sum = d1+d2;
%>
	<div>
		<%
			if(d1 == 1) {
		%>
				<img src="./img/one.jpg"  width="200" height="200">
		<%		
			} else if(d1 == 2) {
		%>
				<img src="./img/two.jpg" width="200" height="200">
		<%		
			} else if(d1 == 3) {
		%>
				<img src="./img/three.jpg" width="200" height="200">
		<%		
			} else if(d1 == 4) {
		%>
				<img src="./img/four.jpg" width="200" height="200">
		<%				
			} else if(d1 == 5) {
		%>
				<img src="./img/five.jpg" width="200" height="200">
		<%		
			} else {
		%>
				<img src="./img/six.jpg" width="200" height="200">
		<%
			}
		%>
		
		<%
			// 2번째 주사위
			if(d2 == 1) {
		%>
				<img src="./img/one.jpg"  width="200" height="200">
		<%		
			} else if(d2 == 2) {
		%>
				<img src="./img/two.jpg" width="200" height="200">
		<%		
			} else if(d2 == 3) {
		%>
				<img src="./img/three.jpg" width="200" height="200">
		<%		
			} else if(d2 == 4) {
		%>
				<img src="./img/four.jpg" width="200" height="200">
		<%				
			} else if(d2 == 5) {
		%>
				<img src="./img/five.jpg" width="200" height="200">
		<%		
			} else {
		%>
				<img src="./img/six.jpg" width="200" height="200">
		<%
			}
		%>
	</div>
	<div>주사위 결과 : <%=sum%></div>
</body>
</html>

Math.random()
0.0(double타입 이기 때문에 정확한 값의 0은 아님)부터 0.9까지의 랜덤한 숫자를 발생시킨다. ex) 0.0005, 0.9999, 0.2354 등...
(0부터 숫자가 시작되기 때문에 1부터 시작하고 싶으면 +1을 해준다.)
- ⭐ double 타입이기 때문에 정수값만 쓰기 위해서는 소숫점을 버려야함
  - Math.floor(Math.random())
  - (int)(Math.random()) : 형변환연산자
✔ if문 안에서 img src 사용시 <% %> 주의해서 잘 써주기!!

📍 결과

📌 실습3) question.html, answer.jsp

if문을 이용하여 시험 문제의 답과 점수를 계산하는 페이지 만들기

📍 예제

이 예제에 이름 칸도 추가하기로 했다

📍 작성 (1) - question.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>문제지</title>
	<style>
		table, td {
			border: 1px solid #000000;
		}
		table {
			border-collapse: collapse;
		}
	</style>
</head>
<body>
	<h1>문제지</h1>
	<fieldset>
		<form action="./answer.jsp" method="post">
		<!-- 주의! input 태그는 form 태그 안쪽에 있어야 정보가 전송됨 -->
		이름: <input type="text" name="name">
		<table>
			<tr>
				<!-- 왼쪽 -->
				<td>
					1. onpiece 주인공의 직업은?<br>
					<input type="radio" name="q1" value="1">1. 개발자<br>
					<input type="radio" name="q1" value="2">2. 판사<br>
					<input type="radio" name="q1" value="3">3. 의사<br>
					<input type="radio" name="q1" value="4">4. 해적<br>
					<br>
					2. onepiece 루피가 태어난 바다는?<br>
					<input type="radio" name="q2" value="1">1. 태평양<br>
					<input type="radio" name="q2" value="2">2. 대서양<br>
					<input type="radio" name="q2" value="3">3. 인도양<br>
					<input type="radio" name="q2" value="4">4. 이스트 블루<br>
					<br>
					3. 밀짚모자 해적단의 해적선 이름은?<br>
					<input type="radio" name="q3" value="1">1. 거북선<br>
					<input type="radio" name="q3" value="2">2. 사우전드 써니<br>
					<input type="radio" name="q3" value="3">3. 타이타닉<br>
					<input type="radio" name="q3" value="4">4. 아폴로 11호<br>
					<br>
					4. 밀짚모자 해적단 멤버수는?<br>
					<input type="radio" name="q4" value="1">1. 10명<br>
					<input type="radio" name="q4" value="2">2. 100명<br>
					<input type="radio" name="q4" value="3">3. 1000명<br>
					<input type="radio" name="q4" value="4">4. 10000명<br>
					<br>
					5. 밀짚모자 해적단의 멤버가 먹은 열매가 아닌것은?<br>
					<input type="radio" name="q5" value="1">1. 고무고무(니카니카)열매<br>
					<input type="radio" name="q5" value="2">2. 개발개발열매<br>
					<input type="radio" name="q5" value="3">3. 부활부활열매<br>
					<input type="radio" name="q5" value="4">4. 꽃꽃열매<br>
				</td>
				<!-- 오른쪽 -->
				<td>
					6. 밀짚모자 해적단 멤버중 열매 능력자는?<br>
					<input type="radio" name="q6" value="1">1. 루피<br>
					<input type="radio" name="q6" value="2">2. 조로<br>
					<input type="radio" name="q6" value="3">3. 나미<br>
					<input type="radio" name="q6" value="4">4. 상디<br>
					<br>
					7. 루피 할아버지의 직업은?<br>
					<input type="radio" name="q7" value="1">1. 개발자<br>
					<input type="radio" name="q7" value="2">2. 변호사<br>
					<input type="radio" name="q7" value="3">3. 군인<br>
					<input type="radio" name="q7" value="4">4. 어부<br>
					<br>
					8. 샹크스의 머리 색깔은?<br>
					<input type="radio" name="q8" value="1">1. #FFFFFF<br>
					<input type="radio" name="q8" value="2">2. #000000<br>
					<input type="radio" name="q8" value="3">3. #FF0000<br>
					<input type="radio" name="q8" value="4">4. #0000FF<br>
					<br>
					9. 조로가 싸울때 사용하는 검(칼)의 개수는?<br>
					<input type="radio" name="q9" value="1">1. 1개<br>
					<input type="radio" name="q9" value="2">2. 2개<br>
					<input type="radio" name="q9" value="3">3. 3개<br>
					<input type="radio" name="q9" value="4">4. 4개<br>
					<br>
					10. 원피스의 의미는?<br>
					<input type="radio" name="q10" value="1">1. 신<br>
					<input type="radio" name="q10" value="2">2. 피자 한조각<br>
					<input type="radio" name="q10" value="3">3. 고향<br>
					<input type="radio" name="q10" value="4">4. 보물<br>
				</td>
			</tr>
		</table>
			<br><button type="submit">답안전송</button>
		</form>
	</fieldset>
</body>
</html>

✔ input 태그는 form 태그 안쪽에 있어야 정보가 전송됨! 실수 조심하기

📍 결과

📍 작성 (2) - answer.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>정오표</title>
	<style>
	table, td, th {
			border: 1px solid #000000;
		}
		table {
			border-collapse: collapse;
		}
	</style>
</head>
<body>
<%
	String name = request.getParameter("name"); // 이름 가져오기

	String q1 = request.getParameter("q1"); // radio 선택값 가져오기
	String q2 = request.getParameter("q2");
	String q3 = request.getParameter("q3");
	String q4 = request.getParameter("q4");
	String q5 = request.getParameter("q5");
	String q6 = request.getParameter("q6");
	String q7 = request.getParameter("q7");
	String q8 = request.getParameter("q8");
	String q9 = request.getParameter("q9");
	String q10 = request.getParameter("q10");
	
	int que1 = Integer.parseInt(q1); // radio 선택값 int 타입으로 바꾸기
	int que2 = Integer.parseInt(q2);
	int que3 = Integer.parseInt(q3);
	int que4 = Integer.parseInt(q4);
	int que5 = Integer.parseInt(q5);
	int que6 = Integer.parseInt(q6);
	int que7 = Integer.parseInt(q7);
	int que8 = Integer.parseInt(q8);
	int que9 = Integer.parseInt(q9);
	int que10 = Integer.parseInt(q10);
	
	// 위 두 과정을 한줄로 int q1 = Integer.parseInt(request.getParameter("q1")); 로 표현할 수 있음
	
	int a1 = 4; // 문제답 변수 생성
	int a2 = 4;
	int a3 = 2;
	int a4 = 1;
	int a5 = 2;
	int a6 = 1;
	int a7 = 3;
	int a8 = 3;
	int a9 = 2;
	int a10 = 4;
	
	String ox1 = null; // 정오표 변수 생성
	String ox2 = null;
	String ox3 = null;
	String ox4 = null;
	String ox5 = null;
	String ox6 = null;
	String ox7 = null;
	String ox8 = null;
	String ox9 = null;
	String ox10 = null;
	
	// 이렇게 한번에 생성 가능 String ox1, ox2, ox3, ox4, ox5, ox6, ox7, ox8, ox9, ox10;
	
	int sum = 0; // 점수합계 변수 생성
	
	// 점수합계 계산하기
	// 첫번째 문제
	if(que1 == a1) {
		sum = sum + 10;
		ox1 = "O";
	} else {
		ox1 = "X";
	}
	// 두번째 문제
	if(que2 == a2) {
		sum = sum + 10;
		ox2 = "O";
	} else {
		ox2 = "X";
	}
	// 세번째 문제
	if(que3 == a3) {
		sum = sum + 10;
		ox3 = "O";
	} else {
		ox3 = "X";
	}
	// 네번째 문제
	if(que4 == a4) {
		sum = sum + 10;
		ox4 = "O";
	} else {
		ox4 = "X";
	}
	// 다섯번째 문제
	if(que5 == a5) {
		sum = sum + 10;
		ox5 = "O";
	} else {
		ox5 = "X";
	}
	// 여섯번째 문제
	if(que6 == a6) {
		sum = sum + 10;
		ox6 = "O";
	} else {
		ox6 = "X";
	}
	// 일곱번째 문제
	if(que7 == a7) {
		sum = sum + 10;
		ox7 = "O";
	} else {
		ox7 = "X";
	}
	// 여덟번째 문제
	if(que8 == a8) {
		sum = sum + 10;
		ox8 = "O";
	} else {
		ox8 = "X";
	}
	// 아홉번째 문제
	if(que9 == a9) {
		sum = sum + 10;
		ox9 = "O";
	} else {
		ox9 = "X";
	}
	// 열번째 문제
	if(que10 == a10) {
		sum = sum + 10;
		ox10 = "O";
	} else {
		ox10 = "X";
	}
%>
	<h1>정오표</h1>
	<table>
		<tr>
			<th colspan="2">이름: <%=name%></th>
			<th colspan="2">점수: <%=sum%>점</th>
		</tr>
		<tr>
			<td>1번</td>
			<td><%=ox1%></td>
			<td>6번</td>
			<td><%=ox6%></td>
		</tr>
		<tr>
			<td>2번</td>
			<td><%=ox2%></td>
			<td>7번</td>
			<td><%=ox7%></td>
		</tr>
		<tr>
			<td>3번</td>
			<td><%=ox3%></td>
			<td>8번</td>
			<td><%=ox8%></td>
		</tr>
		<tr>
			<td>4번</td>
			<td><%=ox4%></td>
			<td>9번</td>
			<td><%=ox9%></td>
		</tr>
		<tr>
			<td>5번</td>
			<td><%=ox5%></td>
			<td>10번</td>
			<td><%=ox10%></td>
		</tr>
	</table>
</body>
</html>

✔️ 개선점

한줄로 쓸 수 있는 부분 체크하기

int q1 = Integer.parseInt(request.getParameter("q1"));
String ox1, ox2, ox3, ox4, ox5, ox6, ox7, ox8, ox9, ox10;

들여쓰기 신경쓰기

html 파일 작성 시에 value값을 답은 1, 오답은 0으로 설정해놓으면 jsp 파일 작성 시에 문제답 변수를 생성할 필요가 없다.

question.html

1. onpiece 주인공의 직업은?<br>
		<input type="radio" name="q1" value="0">1. 개발자<br>
		<input type="radio" name="q1" value="0">2. 판사<br>
		<input type="radio" name="q1" value="0">3. 의사<br>
		<input type="radio" name="q1" value="1">4. 해적<br>

answer.jsp

// 점수합계 계산하기
			// 첫번째 문제
			if(q1 == 1) {
				sum = sum + 10;
				ox1 = "O";
			} else {
				ox1 = "X";
			}

변수 이름 짓는 부분 체크하기
(이름을 알아보기 쉽게, 복잡하지 않게 잘 짓는 센스!)

📍 결과

📌 실습4) rspForm.html, rspAction.jsp

오늘 배운 내용들(if문, Math.random 메소드)과 새롭게 배운 equals 메소드를 이용하여 컴퓨터와 가위바위보 게임을 할 수 있는 페이지 만들기

📍 작성 (1) - rspForm.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>rspForm.html</title>
</head>
<body>
	<h1>가위바위보를 선택하세요</h1>
	<form action="./rspAction.jsp" method="post">
		<div>
			<input type="radio" name="userRsp" value="가위">
			<img src="./img/s.JPG"> <!-- 가위 이미지 -->
			<br>
			<input type="radio" name="userRsp" value="바위">
			<img src="./img/r.JPG"> <!-- 바위 이미지 -->
			<br>
			<input type="radio" name="userRsp" value="보">
			<img src="./img/p.JPG"> <!-- 보 이미지 -->
		</div>
		<div>
			<br><button type="submit">가위바위보</button>
		</div>
	</form>
</body>
</html>

value 값이 영어나 숫자가 아닌 한글로 들어감

📍 결과

📍 작성 (2) - rspAction.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>rspAction.jsp</title>
	<style>
		table, td {
			text-align: center;
		}
	</style>
</head>
<body>
<%
	request.setCharacterEncoding("UTF-8"); // 넘어올 '값'이 한글일때는 항상 깨지지않게 셋팅해줘야함!
	
	String userRsp = request.getParameter("userRsp"); // 유저가 선택한 "가위" or "바위" or "보" 중에 하나가 넘어옴

	String comRsp = null; // 나오는 랜덤 값에 따라 컴퓨터에게 가위,바위,보를 주기위한 변수 생성
	
	int r = (int) (Math.random()*3); // 0, 1, 2 중 하나의 값이 랜덤으로 발생
	if(r == 0) {
		comRsp = "가위";
	} else if(r == 1) {
		comRsp = "바위";
	} else {
		comRsp = "보";
	} //랜덤으로 발생한 0, 1, 2에 따라 가위, 바위, 보 부여하기

	
	String result = null; // 가위바위보 결과 변수 선언
	
	// 가장 간단한 비기는 조건부터 만들어보자
	if(userRsp.equals(comRsp)) {
		result = "비겼다";
	// 이기는 조건은 내가 낼 값과 컴퓨터의 값 둘다 지정해야하기 때문에 &&를 사용한다.
	// 또한, 이기는 경우의 수를 모두 적어주어야하기 때문에 ||를 사용한다.
	} else if(
				(userRsp.equals("가위") && comRsp.equals("보"))
				||
				(userRsp.equals("바위") && comRsp.equals("가위"))
				||
				(userRsp.equals("보") && comRsp.equals("바위"))
			 ) {
		result = "이겼다";
	} else {
		result = "졌다";
	}		
%>
	<table>
		<tr>
			<td colspan="3">결과</td>
		</tr>
		<tr>
			<td>
				<%
					if(userRsp.equals("가위")) {
				%>
					<img src="./img/s.JPG">
				<%		
					} else if(userRsp.equals("바위")) {
				%>
					<img src="./img/r.JPG">
				<%
					} else {
				%>
					<img src="./img/p.JPG">
				<%
					}
				%>
			</td>
			<td rowspan="2">
				vs
			</td>
			<td>
				<%
					if(comRsp.equals("가위")) {
				%>
					<img src="./img/s.JPG">
				<%		
					} else if(comRsp.equals("바위")) {
				%>
					<img src="./img/r.JPG">
				<%
					} else {
				%>
					<img src="./img/p.JPG">
				<%
					}
				%>	
			</td>
		</tr>
		<tr>
			<td>나</td>
			<td>컴퓨터</td>
		</tr>
		<tr>
			<td colspan="3">
				<%=result%>
			</td>
		</tr>
	</table>
</body>
</html>

request.setCharacterEncoding("UTF-8")
value 값이 "가위" 또는 "바위" 또는 "보" 한글이므로 깨지지 않게 제일 위에 셋팅하기
(int) (Math.random()*3)
0~2까지의 랜덤 숫자 생성 (1~3의 숫자가 필요하면 +1을 해줘야함)

⭐⭐⭐ equals 메소드

기본타입은 변수를 만들면 변수자리에 값이 들어간다 (하나씩만 저장)
예를 들어 x에 10이 들어있고 y에 10이 들어있을때,
x==y 는 참 (10==10) 이 된다.

반면 참조타입은
변수를 만들면 참조(위치값)이 들어가고 그 위치에 값이 들어간다
(여러개 저장 가능)

예를 들어 참조타입 x의 주소7에 김,희,진이 들어있고
참조타입 y의 주소21에 김,희,진이 들어있을때,
x==y는 거짓 (7!=21)이 된다.

그래서 위의 경우와 같이
userRsp와 comRsp 즉, 참조타입을 값이 같은지 표현식을 만드려면
등호(==)가 아닌 equals 메소드를 사용해야한다.

가위바위보 if문
가장 조건이 쉬운 것부터 시작한다 (비긴다)
그 다음 이기는 경우의 수는 &&(and), ||(or) 연산자를 이용하여 작성한다
지는 경우의 수는 나머지의 경우이기 때문에 else로 놓고 작성하지 않아도 된다.
이 예제도 마찬가지로 if문 안에서 img src 사용시 <% %> 주의해서 잘 써주기!!

📍 결과

김희진

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

이전 포스트