반응형
39일 차 특이사항
1. 아침에 출근하고 프로그래머스 SQL 1문제를 풀면서 시작한다.
- NULL이면 'N'을 출력하고 싶다.
- nvl 함수를 사용했는데 오답이다.
- 무엇이 문제일까?
- '경기도에 위치한'이라는 조건을 넣어주지 않았다. where 조건문을 사용해야 된다.
- 어떻게 경기도에 위치한 창고만 선택할 수 있을까?
- LIKE 연산자를 사용하여 '경기'라는 글자가 들어간 행만 선택한다.
2. 쇼핑몰 회원가입에 이어서 로그인 기능을 구현해 보자.
3. 로그인 dao 함수 내용을 써주지 않아 nullpoint 오류가 발생했다.
4. 지금까지 배웠던 내용 시험 문제로 정리
5. 버블정렬 vs 선택정렬 vs 삽입정렬 처음봄. 공부링크
- 버블 정렬: 인접한 원소끼리 비교하여 교환하는 방식, 셋 중에 제일 느림
- 선택 정렬 : 최솟값을 찾아서 맨 앞으로 이동하는 방식, 버블 정렬보다 빠름
- 삽입 정렬 : 앞에서부터 차례대로 이미 정렬된 부분과 비교하여 교환하는 방식, 셋 중에 제일 빠르지만 배열이 길어질수록 효율성이 떨어짐
- 셋다 시간 복잡도는 O(n²)
로그인 API 사용하기
● 요구사항
1. 아이디 - 중복체크
(영어, 숫자 체크 최대 10글자)
2. 비밀번호 / 비밀번호 확인 체크
(대문자,소문자, 숫자, 특수 문자 포함 최소 8글자 이상 조합)
3. 이름 최대 10글자 (한글, 영어만 가능)
4. 우편번호 찾기를 통하여 우편번호 / 주소 자동입력
5. 이메일 (메일 인증 구현)
- 선택
- naver.com
- gmail.com
- nate.com
- daum.net
- 직접입력
6. 연락처 (전화번호 입력 후 SMS문자 인증 구현)
*이메일, 연락처 인증 완료시 빨간색 글자 ‘인증완료되었습니다’
SignUp.jsp - 아직 미완성
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="java.net.URLDecoder" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>SingUP</title>
<script src="https://code.jquery.com/jquery-3.6.3.min.js"></script>
</head>
<body>
<form>
<table width="1400" height="650">
<tr>
<td width="100%" height="10%">회원가입
</td>
</tr>
<tr>
<td height="60%" align="center" valign="top">
<hr><br>
<p align="left" style="padding-left:160px">
<br><br>
아이디 : <input type="text" size="10" maxlength="15" name="id" id = "id">
<input type = "button" name = "idChk" id = "idChk" value = "중복체크">
<br><br>
비밀번호 : <input type="password" size="15" maxlength="20" name="pass" id = "pass"><br><br>
비밀번호 확인 : <input type="password" size="15" maxlength="20" name="pass2" id = "pass2"><br><br>
이름 : <input type="text" size="13" name="name" id = "name"><br><br>
우편번호 : <input type="text" size="9" name="num" id = "num">
<input type = "button" name = "searchnum" id = "searchnum" value = "우편번호 찾기">
<br><br>
주소 : <input type="text" size="15" name="adrs1" id = "adrs1"><br><br>
상세주소 : <input type="text" size="15" name="adrs2" id = "adrs2"><br><br>
이메일 : <input type="text" size="15" name="email1" id = "email1">@<input type="text" size="15" name="email2" id = "email2">
<select name="emailselect">
<option value="naver">naver.com</option>
<option value="gmail">gmail.com</option>
<option value="nate">nate.com</option>
<option value="daum">daum.net</option>
<option value="self">직접입력</option>
</select>
<input type = "button" name = "confirmnumber" id = "confirmnumber" value = "인증번호">
<br><br>
<input type="text" size="20" name="confirmnumber2" id = "confirmnumber2" placeholder="인증번호를 입력하세요">
<input type = "button" name = "confirmnumber3" id = "confirmnumber3" value = "확인"><br><br>
연락처 : <input type="text" size="15" name="phnum" id = "phnum" placeholder="번호를 입력하세요">
<input type = "button" name = "phnum2" id = "phnum2" value = "인증번호">
<br><br>
<input type="text" size="15" name="phnum3" id = "phnum3" placeholder="인증번호를 입력하세요">
<input type = "button" name = "phnum4" id = "phnum4" value = "확인"><br><br>
</p>
</td>
</tr>
<tr>
<td align="center">
<hr><br>
<input type="button" id = "regi_btn" value="가입신청">
<input type="reset" value="다시입력">
<input type="button" value="취소" id="can_btn">
</td>
</tr>
</table>
</form>
<script>
$(function(){
//아이디 체크 유효성 검사
$("#idChk").click(function(){
var engNum = /^[a-zA-Z0-9]*$/; //정규식은 가져와서 사용한다.
var id = $("#id").val();
if(id == ''){
alert("아이디를 입력하세요");
$("#id").focus();
}else if(!engNum.test(id)){
alert("영어 숫자만 입력가능합니다.");
$("#id").val("").focus();
}else if(id == 'test'){
alert("중복된 ID입니다");
$("#id").val("").focus();
}else{
alert("사용가능한 ID입니다.");
}
})
//이름 유효성 검사
$("#name").keyup(function(){
if($("#name").val().length > 5){
$("#name").val( $("#name").val().slice(0,5) );
}
})
//이메일 유효성 검사
$("#regi_btn").click(function(){
var pattern = /^[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*@[0-9a-zA-Z]([-_.]?[0-9a-zA-Z])*.[a-zA-Z]{2,3}$/i; //정규식
var email = $("#email1").val() + '@' + $("#email2").val();
if(!pattern.test(email)){
alert("올바르지 않은 email 형식입니다.");
}
})
// 주민번호 유효성 검사
$("#jumin2").keyup(function(){
var jumin2Last = $("#jumin2").val().charAt($("#jumin2").val().length-1);
$("#jumin3").val( $("#jumin3").val() + jumin2Last );
if($("#jumin2").val().length > 1){
$("#jumin2").val( $("#jumin2").val().slice(0,-1) + '*' );
}
})
//비밀번호 유효성 검사
$("#regi_btn").click(function(){
var pattern = /^(?=.*[a-zA-Z])(?=.*[0-9]).{8,25}$/;
var pwd = $("#pass").val();
var pwd2 = $("#pass2").val();
if (!pattern.test(pwd)){
alert("올바르지 않은 비밀번호 형식입니다. (영문자와 숫자를 포함하여 8자 이상 25자 이내)");
}else if(pwd !== pwd2) {
alert("비밀번호가 다릅니다. 다시 확인해주세요.");
}else {
alert("가입신청완료!");
}
})
//휴대폰번호 포커스
$("#ph2").keyup(function(){
var ph2 = $("#ph2").val();
if (ph2.length === 4) {
$("#ph3").focus(); // 다음 입력 필드인 #ph3으로 포커스 이동
}
})
})
// 취소
$("#can_btn").click(function(){
alert("취소됐습니다.")
})
</script>
</body>
</html>하던 것을 잠깐 멈추고 지금까지 배웠던 내용을 복습하기로 했다. 시험 문제를 받았다.
느낀 점
시험 문제를 풀고 있다. 모르는 내용이 많다. 구글링, gpt를 활용하여 답을 찾고 있다. 직접 코드를 입력하고 출력되는 것을 확인하고 있다. 아직 이해하고 숙달되려면 멀었다. 그래도 계속해본다. 될 때까지 해본다.
반응형
'일경험' 카테고리의 다른 글
| [국민취업지원제도 일경험프로그램 41일차] SQLD 시험 결과 기다리는 중 (0) | 2023.09.27 |
|---|---|
| [국민취업지원제도 일경험프로그램 40일차] 복습 (1) | 2023.09.26 |
| [국민취업지원제도 일경험프로그램 38일차] 로그인 기능 구현, spring 쇼핑몰 만들기 시작 (2) | 2023.09.22 |
| [국민취업지원제도 일경험프로그램 37일차] MiPlatform(마이플랫폼) 학점 계산 프로그램 (0) | 2023.09.21 |
| [국민취업지원제도 일경험프로그램 36일차] MiPlatform 시작 (0) | 2023.09.20 |
