프로젝트 작업일지 : 회원가입 (스프링 - 리액트 회원가입)

작업일지에 들어가며 이전 프로젝트의 경우 멤버 테이블을 하나만 운영해서 프론트에서 데이터를 받아오고 DB에 저장하는데 크게 어려움이 없었다. 이번에는 멤버 테이블은 회원의 중요 정보를 담는 Main과 세부 정보를 담는 Detail로 나눠서 일대일 관계 설정이 되어있고,  또 Main 테이블은 회원 주소에 따라 위치 정보를 담는 location_roads 테이블과 다시 일대일 관계로 설정되어있다.  시작도 전에 난항이 생길 것 같은 기분이다.  아무튼 최선을 다해보자!회원가입 로직 구현 과정1. 테이블 구조 확인members_mainmembers_detaillocation_roads members_main을 기준으로 detail과 roads가 일대일 관계로 설정 되어있는 모습이다. 2. Entity데이터베..

• format_list_bulleted Project/Team
• · 2024. 12. 24.
• textsms

241224 인증 / 인가

241224 에이콘 아카데미 수업에 기반하여 작성되었음을 알립니다.권한 부여(어제 내용과 이어서 진행됩니다.)login.html 로그인 페이지 사용자명 : 비밀번호 : 로그인 성공적으로 로그아웃 되었다! 세션 시간 만료로 로그아웃 되었다! Testcontroller@Controllerpublic class TestController { @GetMapping("/login") public String login() { return "login"; }}SecurityConfigauthorize / formlogin / logout@Configuration@EnableWebSecuritypublic class SecurityConfig { // Spring Security의 Role(역..

• format_list_bulleted Study/Acorn
• · 2024. 12. 24.
• textsms

프로젝트 작업일지 : 회원가입 (리액트 다음 주소 찾기 API)

작업일지에 들어가며이전 중간 프로젝트에서 JSP를 사용하여 카카오에서 제공하는 주소 찾기 API를 구현하였다. 이번 프로젝트는 리액트를 사용하기 때문에 처음에는 적용하기 어렵지 않으려나 생각했었는데 이미 여러 사람들이 리액트로도 API를 잘 구현하여 개인 블로그에 잘 정리하여 포스팅해주어서 잘 모르는 부분이나 에러가 나는 부분들은 쉽게 해결할 수 있었다. 내가 구현했던 과정을 하기에 좀 더 상세하게 기록을 남겨보겠다.리액트 다음 주소 API🙏 다음 우편번호 서비스카카오에서 제공하는 다음 우편번호 서비스 공식 설명 페이지이다.API의 특징과 기본 사용법이 아주 상세하게 설명되어있으니 처음 사용하는 사람들도 손쉽게 사용 가능하다. 하지만 본인은 공식 페이지의 설명만으로는 리액트에서 적용하기 쉽지 않아 쉽게..

• format_list_bulleted Project/Team
• · 2024. 12. 23.
• textsms

프로젝트 작업일지 : 회원가입 (폼 만들기_React Hook Form)

작업일지에 들어가며 이전에 ERD를 어느정도는 구성했지만 테이블간 관계를 더 고려해봐야해서 데이터베이스가 없다. 그래서 DB와 프론트쪽으로 우선 업무를 간단히 분담하여 프로젝트를 진행하기로하였다. 나는 프론트 업무를 담당하게되어 이번 글에서는 리액트로 화면을 구성해보도록 하겠다. 우리는 이미 구현이 되어있는 템플릿 사용과 아니면 차크라UI를 사용하여 필요한 것들을 직접 만들어 사용할 지 논의했고, 템플릿을 사용하면 기존 코드를 해석하는 시간도 오래 걸리고 우리가 원하는 방향으로 수정하기 까다롭다고 판단하여 차크라 UI를 사용하여 화면을 만들기로 하였다.Chakra UI 사용 방법하기 차크라 UI 홈페이지에 들어가서 기본 세팅을 해주면 된다.1. 라이브러리 설치npm i @chakra-ui/react @e..

• format_list_bulleted Project/Team
• · 2024. 12. 23.
• textsms

241223 인증 / 인가

241223 에이콘 아카데미 수업에 기반하여 작성되었음을 알립니다. 인증, 인가이전 시간에 세션과 JWT만을 이용한 인증, 인가 절차를 배워보았다.이번 시간에는 본격적으로 스프링 시큐리티와 JWT를 배워보자.시큐리티는 기본적으로 세션을 이용하지만 세션 말고 JWT와 연계하여 사용하게 된다면확장성과 SPA를 구현하기에 더욱 더 좋다.🙏 spring security는 session, jwtSpring Boot JWT 실습이전 시간에 했던 의존성 동일하게 사용 / 출력 부분도 복붙해주자build.gradle0.11.5 버전 사용, build.gradle에 의존성 부여해주고 리프레쉬!0.11 버전implementation 'io.jsonwebtoken:jjwt-api:0.11.2'runtimeOnly 'io...

• format_list_bulleted Study/Acorn
• · 2024. 12. 23.
• textsms

241220 인증 / 인가

241220 에이콘 아카데미 수업에 기반하여 작성되었음을 알립니다.스프링 시큐리티인증(Authentication) : 인증은 사용자의 신원을 입증하는 과정이다.간단히 말해 어떤 사이트에 아이디와 비밀번호 입력하여 로그인 하는 과정이다.인가(Authorization) : '권한부여'나 '허가'와 같은 의미로 사용된다. 즉, 어떤 대상이 특정 목적을 실현하도록 허용하는 것을 말한다. 예를 들면, 파일 공유 시스템에서 권한별로 접근할 수 있는 폴더가 상이하다. 관리자는 접속이 가능하지만 일반 사용자는 접속할 수 없는 경우에서 사용자의 권한을 확인하게 되는데, 이 과정을 인가라고 한다.스프링 시큐리티를 적용할 때 세션만 쓸 때의 장단점, JWT와 함께 적용할 때의 장단점이 있다.스프링 시큐리티는 필터 기반으로 ..

• format_list_bulleted Study/Acorn
• · 2024. 12. 20.
• textsms

241219 AWS RDS

241219 에이콘 아카데미 수업에 기반하여 작성되었음을 알립니다. 어제는 EC2 환경에서 리눅스를 설치하여 DB를 설치하였다.데이터베이스만 별도 관리를 원할 때 RDS를 사용하여 관리해줄 수 있다.현장에서도 RDS를 많이 사용한다고 한다. 오늘은 RDS를 배워보자!Amazon RDS (Relational Database Service)Amazon Web Services에서 제공하는 완전 관리형 관계형 데이터베이스 서비스이며 클라우드에서 관계형 데이터베이스를 더 쉽고 효율적으로 설정, 운영 및 확장할 수 있다. * Amazon RDS 주요 특징  - 지원하는 데이터베이스 엔진  - Amazon RDS는 다양한 인기 있는 데이터베이스 엔진을 지원    Amazon Aurora (MySQL 및 Postgre..

• format_list_bulleted Study/Acorn
• · 2024. 12. 19.
• textsms

241218 AWS EC2

241218 에이콘 아카데미 수업에 기반하여 작성되었음을 알립니다.클라우드 개념오늘의 AWS 실습 전 개념을 잡고가보자! 온 프레미스기업의 서버를 클라우드 같은 원격 환경에서 운영하는 방식이 아닌, 자체적으로 보유한 전산실 서버에 직접 설치해 운영하는 방식을 의미한다. 하나의 컴퓨터(서버)를 두고 서비스를 시작했는데 서비스를 이용하는 사용자가 많아진다면 서버의 성능을 늘려야 한다. 이렇게 자체적으로 서버 성능을 늘리는 것을 scale up이라고한다. 계속해서 사용자가 늘어난다면 여러 개의 컴퓨터를 사용할 수 있는데 이렇게 서버를 운영하는 것을 scale out이라고 한다. 이렇게 온 프레미스 방식의 장점은 기업의 비즈니스 정보를 보안성 높게 관리할 수 있다는 것이고 단점은 시스템을 구축하는데 있어서 많은..

• format_list_bulleted Study/Acorn
• · 2024. 12. 18.
• textsms

241217 가상화 (하이퍼바이저 프로그램 배포, AWS 실습)

241217 에이콘 아카데미 수업에 기반하여 작성되었음을 알립니다.배포파일(jar)을 Ubuntu에 전송윈도우, 스프링 부트로 만든 배포파일을 리눅스로 전송, FTP를 사용우분투$ ifconfig우분투 ip : 192.168.159.128스프링 부트application.propertiesspring.application.name=sprweb00sangdataserver.port=8080spring.thymeleaf.cache=false#mariadb server connectspring.datasource.driver-class-name=org.mariadb.jdbc.Driverspring.datasource.url=jdbc:mariadb://192.168.159.128:3306/test #우분투 ips..

• format_list_bulleted Study/Acorn
• · 2024. 12. 17.
• textsms

241216 리눅스 (기본 명령어, Java, MariaDB 설치)

241216 에이콘 아카데미 수업에 기반하여 작성되었음을 알립니다. 가상화 / 클라우드AWS가 지원하는 리눅스 서버에 마리아DB를 설치하고 자료를 공유해보자!sangdata를 배포파일로 만들어 AWS에 올려 전세계 어디서든 내가 만든 프로젝트를 서비스할 수 있을 것이다!1. 리눅스 명령어 연습2. AWS에서 직접하기엔 속도가 느리다.3. 컴퓨터 내에 가상화로 리눅스를 설치하여 연습4. AWS 계정 하나 만들어보기!🙏 가상화 개념 이해하기리눅스 기본 명령어 실습💡 WSL(Windows Subsystem for Linux)윈도우의 가상화 기능을 활용해서 윈도우 위에서 리눅스를 사용할 수 있게 해준다.이제 가상머신을 따로 구성하지 않고도, 윈도우에서 리눅스를 사용할 수 있다. 게다가 단순히 가상머신으로 리..

• format_list_bulleted Study/Acorn
• · 2024. 12. 16.
• textsms