![]()
Spring Security를 이용해 회원 관리나 로그인 기능을 구현할 때, 비밀번호를 평문(plain text)으로 저장하면 보안상 매우 취약합니다. 이번 글에서는 Spring Security에서 제공하는 BCryptPasswordEncoder를 사용하여 안전하게 비밀번호를 암호화하는 방법을 소개하겠습니다. 1. BCryptPasswordEncoder란?BCryptPasswordEncoder는 Spring Security에서 제공하는 비밀번호 암호화 도구로, 단방향 해싱(hashing)을 수행합니다. 한번 암호화된 비밀번호는 복호화가 불가능하며, 로그인 시에는 입력된 비밀번호를 다시 암호화하여 데이터베이스에 저장된 암호화된 비밀번호와 비교하여 인증합니다.주요 특징:단방향 암호화 방식안전한 salt 자..
![]()
https://devjunyeok.tistory.com/193 답변형 게시판 구현 (2) https://devjunyeok.tistory.com/192 답변형 게시판 만들기 (1) 네이버 카페 등의 게시판을 주로 보면 질문에 대한 답글이 게시되어 있는 기능을 종종 볼 수 있습니다. 이번에는 답글을 달 수 있는 게시판을 devjunyeok.tistory.com 📝 실행결과 지난 글에 이어 이번에는 게시글 생성 기능구현을 해보겠습니다. 💻 프론트 작업 게시글 추가 페이지를 만들기 위해 AddReplyBoard.tsx 페이지를 생성합니다. rfce 단축키를 이용해 함수를 생성하고, return 문 아래에 html 코드를 작성합니다. // return문 아래에 작성 {submitted ? ( You submit..
https://devjunyeok.tistory.com/192 답변형 게시판 만들기 (1) 네이버 카페 등의 게시판을 주로 보면 질문에 대한 답글이 게시되어 있는 기능을 종종 볼 수 있습니다. 이번에는 답글을 달 수 있는 게시판을 제작해 보겠습니다. 단, 간단한 예제를 위해 답글은 devjunyeok.tistory.com 지난 시간에 답변형 게시판 전체조회 기능까지 구현하였습니다. 이번에는 답글을 생성하는 기능을 구현해보겠습니다. 프론트 작업은 이미 앞에서 답변글 생성 함수 및 Service를 코딩하였으므로 백엔드 부분만 코딩하도록 하겠습니다. ReplyBoardService에 답변글 저장(수정) 함수 추가 📂 src > main > java > 프로젝트 폴더 > service > normal > Rep..
![]()
네이버 카페 등의 게시판을 주로 보면 질문에 대한 답글이 게시되어 있는 기능을 종종 볼 수 있습니다. 이번에는 답글을 달 수 있는 게시판을 제작해 보겠습니다. 단, 간단한 예제를 위해 답글은 1번만 달 수 있도록 제한하고 테이블 설계 및 코딩을 하도록 하겠습니다. 요소 기술 및 테이블 설계는 아래와 같습니다. 요소 기술 : - 프로젝트 키워드 : ReplyBoard - 프론트엔드 : 리액트 & 타입스크립트 - 벡엔드 : 스프링부트 & JPA & Oracle 18xe(Oracle Cloud 19c) 프론트 작업 1) 답변형 게시판 TYPE 정하기 IReplyBoard.ts 파일을 types 폴더에 저장합니다. export default interface IReplyBoard { bid?: any | nul..
![]()
📖 프론트엔드 작업 (1) Qna Type 지정 // IQna.ts : 타입 인터페이스 export default interface IQna { qno?: any | null, question: string, answer: string, questioner: string, answerer: string } (2) Qna 게시판 CRUD 함수 생성을 위한 QnaService 생성 // QnaService.ts : axios 공통함수 (벡엔드 CRUD 연동함수) import IQna from "../../types/basic/IQna"; import http from "../../utils/http-common"; // 전체 조회 + like 검색(paging 기능 : page(현재페이지), size(한 페..
![]()
이번에는 페이징 처리를 적용한 게시판을 만들어보겠습니다. 우선 DeptList 라는 페이지를 생성하고 변수를 정의합니다. 1) 부서 배열을 담을 변수 정의 const [dept, setDept] = useState([]); 2) 상단 검색어 값을 담을 변수 정의 const [searchDname, setSearchDname] = useState(""); 3) 공통 변수 정의 : page(현재페이지 번호), count(총 페이지 건수), pageSize(3, 6, 9 배열) const [page, setPage] = useState(1); const [count, setCount] = useState(1); const [pageSize, setPageSize] = useState(3); // 한 페이지당 ..
![]()
https://devjunyeok.tistory.com/186#3)%20%EB%B6%80%EC%84%9C(Department)%20%EA%B2%8C%EC%8B%9C%ED%8C%90%20%EC%83%9D%EC%84%B1%ED%95%98%EA%B8%B0-1 front + backend 게시판 CRUD 구현 (1) 안녕하세요 ! :) front + backend 를 통합한 게시판을 생성하는 예제를 만들어보겠습니다. 📖 frontend작업 프론트 작업은 VSCode를 이용하여 프로젝트를 생성하였습니다. frontend 프로젝트는 React + typescri devjunyeok.tistory.com 지난시간에 이어 이번에는 부서 게시판 기능 중 부서 추가 페이지를 생성해보겠습니다 :) 먼저 프론트 프로젝트 작업..
📖 연관관계 매핑 종류와 방향 연관관계를 맺는 두 엔티티 간에 생성할 수 있는 연관관계의 종류는 아래와 같습니다. One To One : 일 대 일(1:1) One To Many : 일 대 다(1:N) Many To One : 다 대 일(N:1) Many To Many : 다 대 다(N:M) 데이터베이스에서는 두 테이블의 연관관계를 설정하면 외래키(FK)를 통해 서로 조인해서 참조하는 구조로 생성되지만, JPA를 사용하는 객체지향 모델링에서는 엔티티 간 참조 방향을 설정할 수 있습니다. 데이터베이스와 관계를 일치시키기 위해 양방향으로 설정해도 무관하지만, 비즈니스 로직 관점에서 봤을 때는 단방향 관계만 설정해도 해결되는 경우가 많습니다. 단방향과 양방향 관계에 대해 아래에 간단하게 정리하면 다음과 같습니..
// -------------------------------------------- // JPA 페이징 처리 : 요청 페이징 객체 - Pageable(매개변수) // 결과 페이징 객체 - Page (리턴값) // -------------------------------------------- 📂 DeptRepository.java ✅ 쿼리 메소드 페이징 처리 Page findAllByDnameContaining(String dname, Pageable pageable); 📂 DeptService.java //-------------------------------------------- // 페이징 예제 //-------------------------------------------- // 1) pu..
![]()
💡 SQL을 추상화한 JPQL JPA : ORM(Object-Relational Mapping) 프레임워크 JPQL(Java Persistence Query Language) JPA는 SQL을 추상화한 JPQL이라는 객체 지향 쿼리 언어를 제공합니다. 따라서 테이블을 대상으로 쿼리 하는 것이 아닌 엔티티 객체를 대상으로 쿼리합니다. JPQL은 SQL을 추상화했기 때문에 특정 데이터베이스 SQL에 의존하지 않는 장점이 있습니다. JPQL은 SQL과 문법이 유사하며, SELECT, FROM, WHERE, GROUP BY, HAVING, JOIN을 지원합니다. 💡 쿼리메소드를 사용한 쿼리문 만들기 ✅ TODO 1) 전체 조회 + 정렬(내림차순) 📂 DeptRepository.java package com.ex..
![]()
이전 블로그 글 : https://devjunyeok.tistory.com/181 JPA를 활용한 CRUD 구현하기 안녕하세요! 이번 시간에는 JPA 를 활용한 예제 프로젝트를 생성해보겠습니다. 들어가기 전에 JPA의 특징으로는 SQL문을 자동생성하는 것이 특징입니다. 💡 프로젝트 준비 및 환경설정 프로젝트 devjunyeok.tistory.com 📂 DeptService.java package com.example.jpaexam.service; import com.example.jpaexam.model.Dept; import com.example.jpaexam.repository.DeptRepository; import org.springframework.beans.factory.annotation.A..
![]()
안녕하세요! 이번 시간에는 JPA 를 활용한 예제 프로젝트를 생성해보겠습니다. 들어가기 전에 JPA의 특징으로는 SQL문을 자동생성하는 것이 특징입니다. 💡 프로젝트 준비 및 환경설정 프로젝트 준비시 스프링부트의 종속성을 추가합니다. 생성 후 시간이 소요됩니다. 한글 깨짐 방지를 위해 설정 - 에디터 - 파일 인코딩 부분에 UTF-8로 변경해줍니다. build.gradle 파일의 dependencies 부분에 오라클과 logback, log4jdbc 종속성을 추가해줍니다. // todo: 오라클 라이브러리( 19c ) implementation 'com.oracle.database.jdbc:ucp:19.14.0.0' implementation 'com.oracle.database.security:orac..
