2022 01 12 수요일 공부 (Sub PJT 1 웹 기술 명세서 : 프로젝트 진행에 참고할 내용, 소프트웨어 요구사항 명세서)

명세서를 읽고 정리하면서 느꼈지만, 인증 부분은 아직도 이해가 잘 가지 않았다. 개념이 명확히 머릿속에 그려지지 않는 느낌이 들었다. 반면 ORM 이나 JPA 부분은 김영한 쌤의 강의를 통해 조금이라도 접해서 그런지 낯설지 않은 느낌이 들었다. 그래서! 우선 스프링 입문 강의를 내일 중으로 코드나 빠뜨린 내용을 정리하면서 다시 들어보고, 이후 모든 개발자를 위한 HTTP 웹 기본 지식, 스프링 핵심 원리 - 기본편 를 들으면서 웹과 스프링 개념을 튼튼히 잡아야 할 것 같다.

 

스프링 입문 - 코드로 배우는 스프링 부트, 웹 MVC, DB 접근 기술
모든 개발자를 위한 HTTP 웹 기본 지식
스프링 핵심 원리 - 기본편

 

기타 알아야 할 내용 : REST API, JPA에서의 테이블 매핑, Web Socket, STUN/TURN, Kurento

 

---

 

4. 프로젝트 진행에 참고할 내용 (Vue 제외)

 

 

애플리케이션이나 서비스를 제작하기 위해 프로젝트를 진행하는 대부분의 경우, 제작 하려는 대상의 특성에 적합한 다양한 기술을 선택하여 진행합니다. 이번 공통 프로젝트 역시 구현하려는 목적에 적합한 기술을 포함하여 진행하며, 이들 기술과 더불어 참고할 만한 추가적인 내용 몇 가지를 소개합니다. 프로젝트에 바로 적용해야하는 기술과 함께 학습을 병행하여, 프로젝트의 이해를 높이고 기술적인 시야를 넓히는 데에 활용하시기 바랍니다.

 

세션 인증과 토큰 인증

웹 기반의 서비스를 제작하는 대부분의 경우, 사용자의 인증과 관련된 기능은 가장 기본적인 기능이자 가장 중요한 기능으로 분류됩니다. 사용자의 인증 기능을 구현하기 위해 사용되는 대표적인 방식은 세션을 사용하는 방식과 토큰을 활용하는 방식이 있으며, 대부분의 경우 서비스의 특징에 따라 이 두가지 방식 중 한 가지를 선택하여 구현합니다.

 

이번 공통 프로젝트는 JWT (JSON Web Token) 라는 토큰을 활용하여 사용자 인증 기능을 구현합니다. 그러나 세션을 사용하는 방식 역시 다양한 곳에서 활용되고, 웹 서비스의 동작을 이해하는 데에도 중요한 역할을 하므로, 각 두가지 방식에 대해 간략히 소개된 아래 내용을 시작으로 각 방식의 학습을 진행해보시기 바랍니다.

 

세션 인증

출처 : https://velog.io/@kingth/%EC%84%9C%EB%B2%84-%EC%9D%B8%EC%A6%9D-%EB%B0%A9%EC%8B%9D%EC%84%B8%EC%85%98%EC%BF%A0%ED%82%A4-%ED%86%A0%ED%81%B0 (세션 인증 방식 이미지)

• 쿠키 : 일종의 서버와 클라이언트가 대화하기 위한 수단, 브라우저가 서버와 연결이 되었을 때 브라우저에서 자동적으로 쿠키를 생성하고, response 할 때 쿠키를 담아서 보낸다
• 세션 : 서버와 클라이언트의 연결이 활성화된 상태, 클라이언트가 서버와 통신을 시작하면 서버는 해당 클라이언트에 대해 유일한 값인 세션 id 부여, 세션 스토리지에 세션 정보를 저장, 클라이언트는 이 세션 id를 쿠키를 통해 기억
• Multiple Page Application (MPA)
• 전통적
• Server Side Rendering
• 서버의 메모리, 클라이언트의 쿠키
• 성능, 보안을 위해 대규모 시스템 구축에 전략적으로 사용

 

토큰 인증

출처 : https://velog.io/@kingth/%EC%84%9C%EB%B2%84-%EC%9D%B8%EC%A6%9D-%EB%B0%A9%EC%8B%9D%EC%84%B8%EC%85%98%EC%BF%A0%ED%82%A4-%ED%86%A0%ED%81%B0 (토큰 인증 방식 이미지)

• 토큰 : 인증을 위해 사용되는 암호화된 문자열, 사용자가 보내는 요청에 포함, 토큰을 사용하는 인증에서는 요청을 받은 서버는 토큰이 유효한지 확인만 함, 사용자는 Access Token(JWT Token)을 HTTP 헤더에 실어 서버로 보낸다
• Single Page Application (SPA)
• 비교적 최신 트랜드
• 사용자 경험이 중요한 복잡한 Front-end 구현에 적합
• Vue, React, Angular 등
• 웹 브라우저 외 모바일, IoT 등 다양한 플랫폼 및 디바이스의 클라이언트를 하나의 Back-end 서비스 API로 대응

 

ORM(Object Relational Mapping)

 

JPA (Java Persistence API)

• 객체 지향 개념을 기반으로 데이터 관리
• 비즈니스 로직 구현에 집중 가능
• 테이블의 생성 및 관리 용이
• Database Query 보다 객체에 집중
• Database 제품 및 버전에 대한 종속성을 낮춰 개발의 효율성 증가

 

Hibernate

• JPA 의 구현체 역할을 하는 Java ORM 프레임워크
• 가장 널리 사용되는 JPA 구현체

 

QueryDSL

• type-safe 한 쿼리의 제작과 실행을 위해 사용하는 프레임워크
• String으로 쿼리를 직접 작성할 때 발생할 수 있는 오타 혹은 잘못된 테이블의 참조, 낮은 가독성 극복
• 컴파일 시점에 선언한 Entity 클래스를 기반으로 Q 클래스가 생성되므로, 더 안전한 DB 쿼리 작성 가능

 

5. 소프트웨어 요구사항 명세서 (별로 중요하지 않은 내용)

 

소프트웨어 요구사항 명세서는 요구사항 정의서라고도 불리며 영어로는 Software Requirement Speicifcation (SRS)로 표기합니다. 소프트웨어 요구사항 명세서에는 제작하려는 소프트웨어 제품 혹은 서비스에 대한 화면 및 기능에 대한 구체적인 내용을 포함합니다. 실무에서 사용되는 엄밀한 수준의 요구사항 명세서는 방대한 분량을 포함하고 기능이 구체적인 내용이 규격화된 양식 내에서 작성되므로, 스프레드시트, 문서 편집기, 때에 따라 프리젠테이션 툴 등 다양한 도구를 활용합니다.

 

일반적으로 사용되는 규격화된 요구사항 명세서의 양식은 처음으로 본격적인 팀 프로젝트를 진행하는 입장에서 보기에 가독성이 다소 떨어지고, 내용면에서 당장 필요하지 않은 부분을 많이 포함합니다. 따라서 이번 프로젝트에서 제공되는 소프트웨어 요구사항 명세서는 여러분이 프로젝트 진행에 집중할 수 있도록, 구현해야 하는 내용을 되도록 직관적으로 표현하고, 양식을 간소화한 형태로 구성되어 있습니다.

 

이번 공통 프로젝트 Sub PJT 1 에서는 Front-end 및 Back-end 에 대한 기본적인 요구 사항이 포함되어 있으니, 팀의 역할을 잘 분배하여 각 기능을 구현해보시기 바랍니다.

 

Front-end 요구사항

 

인증/토큰 관리

- 로그인 및 토큰 발급 시, 해당 토큰을 localStorage 에 저장하여 관리

- 페이지 진입 시 : 토큰이 존재할 경우 해당 토큰을 통해 해당 유저의 정보를 받아오고, 각 분류 별 (로그인) 화면을 표시하고, 토큰이 존재하지 않을 경우 각 분류 별 (비로그인) 화면을 표시

- 공동 Axios 처리 : 토큰이 존재할 경우 { Authoriztion : Bearer 토큰 값 } 으로 헤더에 전송, 에러처리

- 로그 아웃 처리 : localStorage에 저장된 토큰을 삭제, "홈" 메뉴로 페이지를 리프레시

 

로딩 스피너

- Front-end 영역에서 기능 수행의 응답 완료 시점까지 사용자의 다른 인터렉션을 방지하기 위해 사용

- Element Plus 의 Notice > Loading 을 활용하여 아래 화면 목록에 로딩 스피너를 적용 (홈 > 방 목록 조회 : 전체 조회, 검색, 정렬), 홈 > 방 목록 > 방 상세 정보, 지난 회의 이력)

 

입력 필드 유효성 체크

- Element Plus 의 Validation 을 활용하여, 입력 필드의 유효성 체크가 실패했을 경우 입력 폼에 에러 메시지를 표시

 

네비게이션 (비로그인) : 메뉴(홈), 회원가입(회원 가입 버튼, 회원 가입 팝업), 로그인(로그인 버튼)

 

네비게이션 (로그인) : 메뉴(홈, 지난 회의 이력, 로그아웃), 회원가입/로그인 버튼(로그인 상태에서 숨기기)

 

Back-end 요구사항

 

Database

- INIT, SQL : 초기 Database SQL 스크립트가 수행 user table, conference_catagory table 셋팅

- MySQL : Entity Relationship Diagram (ERD) 작성

- JPA : Entity (각 테이블의 Entity를 구현), Repository (각 테이블 별 Repsitory 와 RepositorySupport 구현)

 

API

- 공통 : API Version Prefix, API Model, Service & Service Implementation, Controller, Swagger

- 인증 : [POST] /auth/login (ID 와 Password를 요청 받아 인증 및 JWT 토큰을 발급하는 API 제공)

- 유저 : 회원가입, 내 프로필, 유저 정보, 유저 정보 삭제 (탈퇴)