본문 바로가기
반응형

분류 전체보기166

[Spring] 암호화(BCrypt) 및 쿠키(Cookie) 복습 자료 암호화(BCrypt) 및 쿠키(Cookie) 복습 자료이 문서는 제공된 Java 코드와 학습 노트를 바탕으로 BCrypt를 이용한 비밀번호 암호화와 쿠키를 활용한 로그인 상태 관리 방법을 정리한 복습 자료입니다.1. 비밀번호 암호화 (BCrypt)1.1. 암호화 기본 개념정의: 데이터를 보호하기 위해 사람이 이해하기 어려운 형태의 문자(암호문)로 변환하는 과정입니다.목적: 개인정보(특히 비밀번호)를 안전하게 보호하고, 데이터의 무결성을 유지합니다.단방향 암호화: 평문을 암호문으로 변경할 수는 있지만, 암호문을 다시 평문으로 되돌릴 수 없는(복호화 불가) 방식입니다. 비밀번호 저장에 필수적입니다.1.2. BCrypt란?정의: 비밀번호 저장을 위해 설계된 대표적인 해시 함수 기반의 단방향 암호화 알고리즘입니.. 2025. 10. 21.
[Spring] Redis 개념 및 활용법 with Spring Boot Redis with Spring Boot 복습 자료이 문서는 제공된 Java 코드와 학습 노트를 바탕으로 Redis의 기본 개념과 Spring Boot에서의 활용법을 정리한 복습 자료입니다.1. Redis 기본 개념1.1. Redis란?In-Memory Data Store: 데이터를 주기억장치(RAM)에 저장하여 매우 빠른 읽기/쓰기 속도를 제공하는 키-값(Key-Value) 구조의 저장소입니다.NoSQL: 관계형 데이터베이스(RDB)와 달리 정해진 스키마가 없는 NoSQL의 한 종류입니다.주요 목적: 데이터베이스의 부하를 줄이기 위한 캐싱(Caching), 실시간 순위표, 세션 관리 등 빠른 응답이 요구되는 다양한 시나리오에 사용됩니다.1.2. 데이터 저장 방식 비교저장소특징주요 용도데이터베이스 (My.. 2025. 10. 21.
[React] 기타 컴포넌트 : 한국어 교육 웹 서비스 '재밌는한국어' 프로젝트 7. 기타 컴포넌트 및 라우팅 분석이 문서는 관리자 페이지의 시작점 역할을 하는 AdminHome.jsx와 공통 네비게이션 메뉴인 AdminNav.jsx를 분석하고, 이 컴포넌트들이 react-router-dom을 통해 어떻게 연결되는지 설명합니다.7.1. AdminHome.jsx: 관리자 홈 페이지이 컴포넌트는 관리자가 로그인 후 처음 마주하는 대시보드 페이지입니다. 주요 기능으로 바로 갈 수 있는 버튼들을 제공합니다.코드 전문 (주석 포함)// react-router-dom에서 useNavigate 훅을 가져옵니다.import { useNavigate } from "react-router-dom"export default function AdminHome(props) { // useNavigat.. 2025. 10. 16.
[React] 수정 컴포넌트 : 한국어 교육 웹 서비스 '재밌는한국어' 프로젝트 6. 컴포넌트 분석 (3): AdminStudyEdit.jsx이 컴포넌트는 AdminStudyCreate의 확장판으로, 기존 교육 콘텐츠를 수정하는 기능을 담당합니다. 새로운 데이터를 입력받는 것뿐만 아니라, 기존 데이터를 불러와서 보여주고, 개별 항목을 수정, 추가, 삭제하는 훨씬 복잡한 로직을 포함하고 있습니다.6.1. 코드 전문 (주석 포함)// 필요한 훅과 API, Redux 액션들을 모두 가져옵니다.import { useDispatch, useSelector } from "react-redux";import { useNavigate, useParams } from "react-router-dom"import { genreApi, studyApi, examApi, audioApi } from "... 2025. 10. 16.
[React] 등록 컴포넌트 : 한국어 교육 웹 서비스 '재밌는한국어' 프로젝트 5. 컴포넌트 분석 (2): AdminStudyCreate.jsx이 컴포넌트는 새로운 교육 콘텐츠(장르, 주제, 여러 개의 예문, 파일 등)를 한 번에 등록하기 위한 복잡한 폼(Form) 페이지입니다. 여러 종류의 입력(텍스트, 선택, 파일)과 동적으로 추가/삭제되는 필드들을 관리하는 방법을 보여주는 좋은 예시입니다.5.1. 코드 전문 (주석 포함)// React 훅들을 가져옵니다.import { useEffect, useState } from "react";// React Router와 Redux 훅들을 가져옵니다.import { useNavigate } from "react-router-dom"import { useDispatch, useSelector } from "react-redux"// API.. 2025. 10. 16.
[React] 전체 목록 컴포넌트 : 한국어 교육 웹 서비스 '재밌는한국어' 프로젝트 4. 컴포넌트 분석 (1): AdminStudyList.jsx이 컴포넌트는 관리자 페이지의 핵심 기능 중 하나로, 서버에 저장된 모든 교육 데이터(장르, 주제, 예문, 음성)를 불러와 계층 구조(아코디언 UI)로 보여주고, 각 항목을 삭제할 수 있는 기능을 제공합니다.4.1. 코드 전문 (주석 포함)// React에서 필요한 훅(hook)들을 가져옵니다.import { useEffect, useState } from "react"// Redux와 상호작용하기 위한 훅들을 가져옵니다.import { useDispatch, useSelector } from "react-redux";// 페이지 이동을 위한 훅을 가져옵니다.import { useNavigate } from "react-router-dom";/.. 2025. 10. 16.
반응형

티스토리툴바