jsp로 프론트 구현까지 하기 위해서 Dynamicc Web Project로 생성
config로 maven 추가
Maven은 필요한 라이브러리를 특정 문서(pom.xml)에 정의해 놓으면 내가 사용할 라이브러리와 해당 라이브러리가 작동하는데에 필요한 다른 라이브러리들까지 관리하여 네트워크를 통해서 자동으로 다운받아 준다.
이후
webapp에는 프론트쪽 jsp
src/main/java에는 백엔드쪽 java코드를 작성하면 된다.
| 네이버 클라우드 CLOVA Chabot api 사용하기(자바) (1) | 2023.08.21 |
|---|
1부터 입력받은 숫자 n 사이에 있는 소수의 개수를 반환하는 함수, solution을 만들어 보세요.
https://school.programmers.co.kr/learn/courses/30/lessons/12921
프로그래머스에 있는 문제다.
소수의 정의는 자기 자신과 1을 제외한 다른 수로 나누어지지 않는 수이다.
초기에 생각한 방법은 루트값보다 작은 수로만 직접 나누어 보는 것이다.
루트값 이전까지 나누어지지 않았다면 이후의 값들 또한 나누어지지 않기 때문이다.
다만 이렇게 풀면 런타임 에러가 뜬다.
이를 해결하기 위한 방법이 에라토스테네스의_체이다.
소수인 값들을 제외한 모든 수를 지우면서 진행하는 것이다.
에라토스테네스의 체 - 위키백과, 우리 모두의 백과사전
위키백과, 우리 모두의 백과사전. 수학에서 에라토스테네스의 체는 소수를 찾는 방법이다. 고대 그리스 수학자 에라토스테네스가 발견하였다. 알고리즘[편집] 2부터 소수를 구하고자 하는 구간
ko.wikipedia.org
이를 알고리즘으로 표현하면 아래와 같다.
function solution(nums) {
const prime = new Array(nums + 1).fill(1);
let count = nums - 1;
for (let i = 2; i < Math.sqrt(nums); i++) {
if (prime[i]) {
for (let j = i ** 2; j <= nums; j += i) {
if (prime[j]) count--, (prime[j] = 0);
}
}
}
console.log(count);
return count;
}우선 배열을 만들어서 값을 다 집어넣는다. (1에서 nums까지의 소수의 개수를 판별하는 문제임)
인덱스는 0부터 시작하기 떄문에 배열은 nums+1개로 만들고 fill함수를 통해서 전부다 1로 채워준다.
그리고 해당수의 제곱근보다 작은 수들에 대해서 확인을 한다.
배열에 있는 인덱스 값이 0이면 소수가 아니고, 1이면 최종적으로 소수이다. 하지만 1은 소수가 아니므로 count에서 미리 한 개를 뺀다.
예를 들어 10의 경우에는 i는 2부터 3까지만 실행된다 ( 10의 제곱근이 3.xxxx 이므로 )
이후 j를 통해서 i값의 제곱들만 거르기 시작한다. (이후 더 작은 j 값에서 자기보다 작은 값을 곱한 값을 걸렀기 때문이다.)
이후 i의 2배 3배 4배 형식으로 값을 확인하기 때문에 for문의 조건은 j+=i이다
즉 i를 통해서 소수를 찾고 j를 통해서 해당 소수의 배수를 거르는 작업이다.
i가 2일때는 j에서 4를 거르고 이후 6 8 10을 걸러준다. ( 배열의 값을 0으로 만듬)
이후 3일 때는 9를 걸러준다.
최종적으로 배열이 11110101000 이 된다. ( 0123 5 7의 값만 1이됨 )
이때 count는 거르는 작업에서 뺴줬기 떄문에 9개에서 5개를 뺸 4개가 되고. 1의 개수보단 배열의 2개가 적다(0과 1을 뺌)
| 9466 텀 프로젝트 (Node.js) (0) | 2023.11.17 |
|---|---|
| 백준 2842 집배원 한상덕 코드 리뷰 (node.js) (0) | 2023.11.08 |
| Node.js) 백분 1016 제곱 ㄴㄴ 수 (1) | 2023.10.30 |
| 카카오 신고결과 받기 문제 - ( 프로그래머스) (0) | 2023.09.10 |
| 나머지가 1이 되는 수 찾기 문제 최적화(에란토스체) (0) | 2023.08.19 |
코드 : https://github.com/suhong99/jspLecture/tree/master/SampleModelOne
GitHub - suhong99/jspLecture
Contribute to suhong99/jspLecture development by creating an account on GitHub.
github.com
1. eclipse에서 Dynamic Web Project로 파일을 만든다.
이후 \주소\내프로젝트 이름\src\main\webapp\WEB-INF\lib에 mysql-connector-j-8.0.33.jar파일 넣으면 초기세팅이 끝난다.
2. 신세계에서 배우는 프로젝트에선 db, jsp , bootstrap, jquery를 이용해서 만들었다.
3. db는 MYSQL을 사용했는데,
create table member(
id varchar(50) primary key,
pwd varchar(50) not null,
name varchar(50) not null,
email varchar(50) unique,
auth int
);
select count(*)
from member
where id='abc';
select * from member;
delete from member
where id='abc';회원가입은 다음과 같다. 아이디와 비밀번호 email name을 입력받는다.
auth는 추후 관리자 관련 값이다. 관리자는 1 회원은 3
이를 eclipse에서 만든 java코드를 통해서 db에 값을 추가해준다.
프론트쪽에서 값을 입력하기 전에 db와 연결할 java코드를 먼저 작성한다.
3. 데이터에 접근할 때는 dto와 dao를 사용한다.
dto 는 Data Transfer Object로 데이터로 주로 db와 주고 받은 값을 담는데 사용한ㄷ.
dao는 데이터 베이스에 접근하기 위한 객체 Data Access Object이다.
4. dao에는instance생성, 생성자 , 아이디 확인, 로그인 , 회원가입이 있다.
public boolean addMember(MemberDto dto) {
String sql = " insert into member(id, pwd, name, email, auth) "
+ " values(?, ?, ?, ?, 3) ";
Connection conn = null;
PreparedStatement psmt = null;
int count = 0;
try {
conn = DBConnection.getConnection();
System.out.println("addMember 1/3 success");
psmt = conn.prepareStatement(sql);
psmt.setString(1, dto.getId());
psmt.setString(2, dto.getPwd());
psmt.setString(3, dto.getName());
psmt.setString(4, dto.getEmail());
System.out.println("addMember 2/3 success");
count = psmt.executeUpdate();
System.out.println("addMember 3/3 success");
} catch (SQLException e) {
System.out.println("addMember fail");
e.printStackTrace();
} finally {
DBClose.close(psmt, conn, null);
}
return count>0?true:false;
}
위의 코드는 구중에 회원가입에 관련된 코드다.
위와 같이 db와 dao dto가 준비가 끝나면 이제 프론트쪽 코드를 작성하면 된다.
회원가입 코드는 아래와 같다.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>회원가입</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<style type="text/css">
.center{
margin: auto;
width: 60%;
border: 3px solid #0000ff;
padding: 10px;
}
</style>
</head>
<body>
<h2>회원가입</h2>
<p>환영합니다</p>
<div class="center">
<form action="regiAf.jsp" method="post">
<table border="1">
<tr>
<th>아이디</th>
<td>
<input type="text" name="id" id="id" size="20" placeholder="아이디">
<input type="button" id="id_chk_btn" value="id확인"><br>
<p id="idcheck" style="font-size: 8px"></p>
</td>
</tr>
<tr>
<th>패스워드</th>
<td>
<input type="text" name="pwd" id="pwd" size="20">
</td>
</tr>
<tr>
<th>이름</th>
<td>
<input type="text" name="name" size="20">
</td>
</tr>
<tr>
<th>이메일</th>
<td>
<input type="text" name="email" size="20">
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="회원가입">
</td>
</tr>
</table>
</form>
</div>
<script type="text/javascript">
$(document).ready(function(){
$("#id_chk_btn").click(function(){
// id의 규칙: 대소문자 + 특수문자 포함
// id 글자의 갯수
// id가 사용할 수있는지 없는지 -ajax
$.ajax({
url:"idcheck.jsp",
type:"post",
data:{ "id":$("#id").val() },
success:function( answer ){
// alert("success");
// alert(answer);
if(answer.trim() == "YES"){
$("#idcheck").css("color", "#0000ff");
$("#idcheck").text("사용할 수 있는 아이디입니다");
}else{
$("#idcheck").css("color", "#ff0000");
$("#idcheck").text("사용중인 아이디입니다");
$("#id").val("");
}
},
error:function(){
alert('error');
}
});
});
});
</script>
</body>
</html>간단하게 id가 이미 존재하는지 확인하고, 만약 존재하지 않는다면 회원가입을 진행하면 된다.
이때 idcheck.jsp에서 아이디를 확인하고 있는데
<%@page import="dao.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
String id = request.getParameter("id");
MemberDao dao = MemberDao.getInstance();
boolean b = dao.getId(id);
if(b == true){ // id가 있음
out.println("NO");
}else{ // id가 없음(사용할 수 있음)
out.println("YES");
}
%>jsp에서는 <% %> 사이에 자바코를 작성하고, dao 인스턴스를 생성한 후, dao에 있는 id 확인 함수를 실행한다.
public boolean getId(String id) {
String sql = " select count(*) "
+ " from member "
+ " where id=? ";
Connection conn = null;
PreparedStatement psmt = null;
ResultSet rs = null;
int count = 0;
try {
conn = DBConnection.getConnection();
System.out.println("getId 1/4 success");
psmt = conn.prepareStatement(sql);
psmt.setString(1, id);
System.out.println("getId 2/4 success");
rs = psmt.executeQuery();
System.out.println("getId 3/4 success");
if(rs.next()) {
count = rs.getInt(1);
}
System.out.println("getId 4/4 success");
} catch (SQLException e) {
System.out.println("getId fail");
e.printStackTrace();
} finally {
DBClose.close(psmt, conn, rs);
}
return count>0?true:false;
}sql의 where문을 통해 아이디를 확인하고 있따면 count를 올려서 true값이 반환되게 한다.
그리고 따라서 위의 regi.jsp에서 true일 때 아이디가 중복됩니다라고 알려준다.
이후 중복되지 않는다면
<%@page import="dto.MemberDto"%>
<%@page import="dao.MemberDao"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
request.setCharacterEncoding("utf-8");
String id = request.getParameter("id");
String pwd = request.getParameter("pwd");
String name = request.getParameter("name");
String email = request.getParameter("email");
MemberDao dao = MemberDao.getInstance();
MemberDto dto = new MemberDto(id, pwd, name, email, 0);
boolean isS = dao.addMember(dto);
if(isS == true){ // 가입성공!
%>
<script type="text/javascript">
alert("가입에 성공하셨습니다!");
location.href = "login.jsp";
</script>
<%
}else{ // 가입실패
%>
<script type="text/javascript">
alert("다시 가입해 주십시오");
location.href = "regi.jsp";
</script>
<%
}
%>가입 성공을 시키면 된다.
| React swiper 라이브러리 사용 (0) | 2023.08.21 |
|---|---|
| 리엑트 fullCalender 라이브러리 사용 (0) | 2023.08.16 |
| 리엑트 페이지네이션 라이브러리(react+ SpringBoot) (0) | 2023.08.11 |
| React 프로젝트 생성 및 기초 (0) | 2023.08.08 |
| form속에 버튼 자동으로 submit되는 거 막기 (0) | 2023.07.24 |