분류 전체보기 183

[Github] Github 프로젝트 연결하기

팀원 간 코드 공유 및 관리를 위해 깃허브에 프로젝트를 연결하기로 했다. 깃허브 로그인 후 Your Repositories에 들어가 New 버튼을 누르면 새로운 Repository를 만들 수 있다. 프로젝트 이름과 설명을 적어주고,그 아래에서는 공개 범위를 설정해준다.우선 프로젝트 연결해보는게 과제였기 때문에 나는 비공개로 설정했다.그리고 README 파일의 생성 여부를 고르는데, 설명 파일을 뜻한다.생성하기로 선택했다. 이렇게 repository를 만들었으면 cmd에 들어가서 git을 연결해줄건데 cmd로 git을 연결하려면 git bash를 설치해야한다! git bash를 설치한 후 cmd 창에 들어가 연결하고 싶은 프로젝트 파일이 있는 경로를 복사한다.그리고 cd 프로젝트_파일_경로를 작성해준다...

웹 개발 2025.05.12

[Front] 코드 분석 중 jQuery

[ 제이쿼리(JQuery) ]모든 브라우저에서 동작하는 자바스크립트 라이브러리로, 무료로 사용 가능한 오픈소스이다.이벤트 연결, ajax 등 쉽게 구현 가능하다.또한, css 선택자를 그대로 사용해서 동적 화면처리도 가능하다. // 로그인 기능$("#loginForm").on('submit', function(event) {// 제이쿼리 문법. id = "loginForm"인 폼에서 폼 제출이 되면 해당 이벤트가 발생한다. console.log("로그인 실행"); event.preventDefault(); // 기본 폼 제출 동작을 방지 이 부분은 jQuery 문법이 사용된 코드로, CSS 선택자처럼 #loginForm을 선택해서 이벤트를 설정할 수 있다. id = “loginForm”인 요소에서 제출..

웹 개발 2025.05.11

[Backend] 보안에서 GET, POST

보안과 관련된 부분에서는 ? 클라이언트 방식보다(JS에서 처리) 서버 방식(콜백 URL 처리)으로 하는 것이 보안에 좋다.서버에서 처리하는 것이 액세스 토큰이 노출되는 것을 막아 보안에 좋고, 서버가 직접 사용자 정보를 받아서 처리하기 때문에 자동 회원가입/로그인/세션 설정이 편하다. 또한, 프론트 - 백엔드를 분리하여 확실한 역할 분담을 할 수 있다. → 네이버도 카카오도 OAuth 서버 방식을 제공하고 있다!

웹 개발 2025.05.10

Spring Boot 3 자바 백엔드 개발 입문 - 스프링 부트 개발 환경 설정하기

스프링 부트 프로젝트 만들고 실행하기 Spring Initializr 페이지에서 항목을 설정한 후 생성.https://start.spring.io/ → 스프링 부트 링크 여기서는 책이 시키는대로 설정했다. 옆에서 의존성도 추가해준다. H2 Database : 자료를 저장하기 위한 데이터베이스Mustache : 화면을 만들기 위해 필요한 도구Spring Data JPA : 데이터베이스를 좀 더 편리하게 다룰 수 있게 해주는 도구설정을 마친 후 Generate를 누르면 firstproject.zip 파일로 다운로드 된다. 해당 파일을 IDE인 인텔리제이에 들어가서 띄우면 된다. 수업 후 이 화면을 보니 구조를 이해할 수 있다.java에는 자바 코드가 저장되고 , resources에는 외부 파일이 저장된다...

웹 개발 2025.05.09

Mybatis

[Mybatis : ORM] 1) 자바코드 1~2줄로 DB연동 처리 가능2) SQL을 자바코드에서 온전히 분리 : xml 파일로 분리 >> .xml, @, .properties 결합도를 낮추고 응집도를 높임 ===>> 유지보수 용이[1] 라이브러리를 pom.xml에 추가[2] SQL을 자바코드에서 온전히 분리 : xml 파일로 분리 mapper.xml 파일 생성 SQL 명령어들에게 고유한 ID값을 부여하는 방식으로 설정함 DAO에 작성된 SQL문들을 분리[3] config.xml 파일 생성 DBMS 커넥션 설정 ▶ Spring 프레임워크(applciationContext.xml)에 이미 있음 mapper xml 파일들 위치[4] DAO3, ServiceImpl, DI 해..

웹 개발 2025.05.08

이메일 인증 클라이언트 방식 → 서버 방식으로 수정

원래 아이디/비밀번호 찾기 기능에서 이메일 인증을 할 때 JS에서 생성한 인증번호와 사용자가 입력한 인증번호를 비교했는데 이 방식은 클라이언트 방식으로, 보안에 취약할 수 있다고 해서 이번에 리팩토링 겸 서버 방식으로 바꾸었다. 원래 인증번호를 JS에서 비교하는 클라이언트 방식이었지만, 개발자 도구(F12)를 통해 코드나 값이 노출될 위험이 있어 보안상 취약했다. 이를 해결하기 위해, 인증번호를 서버 세션에 저장하고, 서버에서 직접 비교하는 서버 방식으로 개선했다. (애초에 사실 세션에도 저장하고 있었는데 잘 몰라서 세션에도 저장을 해두었다) 이 방식은 인증번호가 외부에 노출되지 않기 때문에 더 안전하다.1. 사용자가 입력한 정보를 받아 DB에서 정보를 조회한다2. 만약 존재하는 회원이라면 6자리 인증번..

웹 개발 2025.05.06

스위트 알럿(Sweet Alert) 사용해서 팝업 광고 띄우기 + 쿠키(Cookie) 사용하기

이번에 프로젝트에서 쿠키를 어떻게 적용할지 고민하다가 강사님께서 스위트 알럿으로 광고를 띄우고 쿠키로 하루 보지 않기를 적용해보면 좋겠다고 조언해주셔서 한번 프로젝트에 적용시켜 보았다. 먼저, 스위트 알럿을 사용하기 위해서 cdn 방식으로 jsp에 추가해주었다. 다른 요소들이 모두 로드된 후에 사용하기 위해 뒤쪽에 선언했다. Sweet Alert 사이트에 들어가면 예시들을 확인할 수 있고, 거기에서 맘에 드는 예시를 가져다가 이용하면 된다.https://sweetalert.js.org/ SweetAlertYou've arrived! How lovely. Let me take your coat. Oops! Seems like something went wrong! Delete important stuff?..

웹 개발 2025.05.05

서버(Server)와 세션(Session)

1. 서버(Server)란?요청을 처리하고 응답을 돌려주는 컴퓨터 또는 프로그램예: 사용자가 웹사이트에 접속하면, 웹 서버가 HTML/JSON 등의 응답을 만들어 돌려줌Java/Spring에서는 Controller, Service, DB 연결 등이 서버 역할 수행즉, 클라이언트(브라우저, 앱)가 요청하면, 서버는 그 요청을 처리해 결과를 보낸다. 2. 세션(Session)이란?"클라이언트와 서버 사이의 연결 상태를 유지하기 위한 저장 공간"사용자가 로그인하거나 인증번호를 받을 때처럼, 상태를 기억해야 할 때 서버에 데이터를 잠깐 저장하는 방식세션은 서버에 저장되며, 사용자마다 고유한 세션 ID로 구분됨브라우저는 쿠키(cookie)로 이 세션 ID를 가지고 있고, 서버는 이 ID로 어떤 사용자인지 확인함세..

웹 개발 2025.05.04

DAO 버전 UP하기

[ Model 파트 ] - DAO 버전 UP 하기DAO를 버전 업 하는 방법에 대해 학습했다.⇒ “성능 최적화” 를 드러내자 기존의 DAO VS 새로운 DAO기존 DAOJDBCUtil이라는 아주 대표적인 공통로직(횡단관심)을 사용함(JDBCUtil은 ctrl + c, v이므로 모듈화(성능 최적화)를 함)(4단계(conn, pstmt, 실행, close를 통해 진행함. 이 중 “실행”만 핵심로직이고 나머지 3개가 공통 로직.)새로운 DAO“Template 패턴” (MVC, 싱글톤, 팩토리, 템플릿, .. 등등의 패턴 존재)반복적인 로직 OR 복잡한 로직을 모듈화한 클래스JDBC Template 클래스를 Spring에서 제공 중이다.pom.xml에 dependency 추가템플릿 사용하여 DAO 구현하기(JD..

웹 개발 2025.05.02