본문 바로가기

웹 서비스 설계 및 실습 FOTD

백엔드 로컬로그인 JWT토큰 발급 받기 https://moca9012.tistory.com/539 백엔드 로컬로그인 JWT토큰 발급 받기 npm install @nestjs/jwt @nestjs/passport passport passport-jwt --save jwt 및 passport 관련 패키지 설치 user 컨트롤러에서 로컬 로그인 라우트 생성 nest g module auth nest g controller auth nest g service auth 로그인과 인증 인 moca9012.tistory.com 과 거의 동의한 과정으로 진행 완료. 더보기
백엔드 로깅 미들웨어, Exception filter, Interceptors 1. 로깅 미들웨어 api 요청에 대해 로그가 찍히는것을 확인 2. Exception filter 왼쪽은 필터 적용전 오른쪾은 필터 적용 후. 커스텀 한대로 잘 나온다. 3. 성공시 Interceptors 유저 컨트롤러 전체에 적용. 성공시 커스텀 한 형식으로 응답을 주는것을 확인할 수 있다. 더보기
백엔드 회원가입 nest g module user nest g controller user nest g service user nest cli로 user 모듈 기본 구조 세팅 npm i bcrypt 비밀번호 암호화를 위한 bcrpt 패키지 설치 dto 생성 및 signup 메서드 컨트롤러, 서비스단 완성. postman으로 api 통신 테스트 결과 데이터가 잘 넘어온다. 데이터베이스에도 해쉬된 비밀번호가 잘 들어온다. 더보기
3단계:콘텐츠구성 4단계 : 인포메이션 아키텍처 5단계 : 디자인 3단계:콘텐츠구성 4단계 : 인포메이션 아키텍처 3,4, 단계는 5단계 디자인 단에서 피그마를 사용해서 로우타입, 미들타입, 하이타입 프로토 타이핑을 통해 한번에 진행 하고자 한다. 5단계 : 디자인 로우파이 프로토 타입 [스케치(Lo-Fi)] 미드 파이 프로토 타입 [와이어 프레임] 하이파이 프로토타입 [프로토-타이핑] 급하게 프레임 사이즈를 신경 쓰지 않고 진행해서 프로토 -타이핑시 포맷이 안맞아서 가시성이 너무 안좋았다. 두달의 시간이 주어진걸 감안하여 워크 플로우만 포함한 미드 파이 프로토 타입까지만 진행. 더보기
2단계 분석 새로구축하려는웹사이트의목적을 명확히 한후수집된 정보를 분석 − 정보수집방법 로그분석을통한정보수집방법 경쟁사리서치를통한정보수집방법 신문이나통계청등이미공표된정보수집방법 사용성 테스트 (Usability Test)를 통한 정보 수집 방법 − 위와같은방법으로수집한정보를통하여환경요구분석,사용자요구분석, 콘텐츠 분석, 현재 웹사이트의 장단점 및 개선 방향 등을 분석한다. 서비스 블루프린트 (Service Blueprint) SRS 작성 (Software Requirement Specification) 우선 간단하게 식사관련 설문에 대한 통계에 대해 조사 하였다. 아래와 같이 가장 결정 장애가 일어나는 경우는 '음식 메뉴'라고 결과가 있다. 또한 해결 법으로 70프로에 육박하는 비율로 주변지인,혹은 SNS 라는 결과.. 더보기
백엔드 개발 시작 [데이터 베이스 연결 및 환경 변수 세팅] 도커에 mysql을 띄워 로컬에서 개발. docker run --name mysql-fotd-local -p 3307:3306/tcp -e MYSQL_ROOT_PASSWORD=[@@@@] -d mysql:8 . . 도커에 잘 띄어 졌는지 확인 외부 datagrip에 연결 성공 create database fotd_database; use fotd_database datagrip으로 데이터 베이스 생성 후 유저 테이블 만들기 CREATE TABLE `User` ( `userIdx`INTNOT NULL, `email`VARCHAR(30)NOT NULL, `password`VARCHAR(30)NOT NULL, `nickName`VARCHAR(30)NOT NULL, `longitude`DECIMAL(10, 7).. 더보기
1단계. 프로젝트 계획 수립의 PM의 주요 업무 1-1 업무 정의 업무는 크게 4개로 먼저 나누었다. 1. 기획 2. 디자인 3. 프론트엔드 개발 4. 백엔드개발 . 그 이후로 세부적으로 . 3. 프론트 엔드 개발 에서 3-1. 회원가입 및 로그인 UI 및 인증 인가 3-2. 홈(새로운 게시글) UI 및 인증 인가 3-3. 채팅 UI 및 인증 인가 3-4. 채팅 UI 및 인증 인가 3-5. 알람 UI 및 인증 인가 3-6 배포 . . . 4. 백엔드 개발 4-1. 데이터 베이스 설계 4-2. API 명세서 작성 4-3. 회원가입 로그인 인증, 인가 API 구현 4-4. 게시글 CRUD API 구현 4-5. 댓글 CRUD API 구현 4-6. 채팅 API 구현 4-7 알람 API 구현 4-8 배포 . . 정도로 우선 사전에 업무를 정의 하였다. . . .. 더보기
웹 서비스 기획 본격적으로 FOTD 프로젝트를 시작하려고 한다. 이번 프로젝트에서 PM을 맡게되었으며 백엔드와 프론트엔드 풀스택으로 개발을 할것이다. . . 우선 아래의 기획 프로세스의 7단계를 가지며 기획을 해보고자 한다. 1. 프로젝트 계획 수립 2. 분석 3. 콘텐츠 구성 4. 인포메이션 아키텍처 5. 디자인 6. 개발/제작 7. 테스트 런칭 . . 기획이 필요한 이유 1. 프로젝트 계획 수립 PM의 주요 업무 2. 분석 − 새로구축하려는웹사이트의목적을명확히한후수집된정보를분석함 − 정보수집방법 로그분석을통한정보수집방법 경쟁사리서치를통한정보수집방법 신문이나통계청등이미공표된정보수집방법 사용성 테스트 (Usability Test)를 통한 정보 수집 방법 − 위와같은방법으로수집한정보를통하여환경요구분석,사용자요구분석, 콘텐.. 더보기