javacafe-study / chainity-web Goto Github PK

• 샘플 및 가이드 작성

1. 로그인 후 화면에서 새로고침 시 로그인 유지가 되지않음
2. 새로고침 시 로그인 후 SessionStorage에 저장되어 있는 token으로 로그인 유지
3. root로 이동 시 에러 해결

대상

• chainity-web
• chainity-landing

https://chainity.co.kr/login-page
https://chainity.co.kr/profile-page

버튼 클릭하여 이동시 정상적으로 처리되나
그 후 새로고침을 하게 되면 404 Not Found 발생

mockup 데이터를 사용하는 로직 구성

• 초대 링크 router 추가
  • 샘플 링크
    http://localhost:8080/invitation/coNLhPFKwYJya+1p9SA0jauT9itqSK324AmBsBo4+yXRKcyhPW6dMQdAmGUpmg4QhG2TjJYWAWZNeOaaT96uuw==
• 그룹 가입 router 추가 및 UI 기능 구현

[UI]
https://docs.google.com/presentation/d/1Hd_Wu3Z0HMUzFC1qz39DzuK2XreEECSkPljCbNB9Fp4/edit#slide=id.g5188504861_1_14

[그룹 가입 프로세스]

1. 새탭을 통해 암호화된 URL로 이동
   • 참고
     https://github.com/JAVACAFE-STUDY/chainity-api/blob/master/controllers/mail.controller.js#L31
2. URL을 decode하여 validation 체크 후 그룹 가입 화면으로 이동
   • 참고
     https://github.com/JAVACAFE-STUDY/chainity/blob/master/frontend/src/router/index.js#L185
3. 그룹 가입
   • API : POST /v1/groups/:groupId/register
     https://docs.google.com/document/d/188ltFzEhpHYZ0fJUuO20wMbCeFm5OTqEyItZmXEgEEQ/edit#heading=h.aypzlu70e8wf
   • 참고
     https://github.com/JAVACAFE-STUDY/chainity/blob/master/frontend/src/views/Register.vue
4. 그룹 가입 완료 후 로그인 화면으로 이동

특정 링크(ex: 이벤트 상세보기)를 세션없이 접근하였을 때 로그인 후 해당 페이지로 이동하기

• 로그인하여 토큰 받고 저장
  (모든 API호출시 토큰 사용)
• 토큰이 없을 경우 로그인 창으로 이동
• API 호출 시 토큰이 유효하지 않을 경우 로그인 창으로 이동
  (401 Unauthorized HTTP response)"

• 상단 메뉴
• 2단 레이아웃

우측사이드 하단

https://docs.google.com/presentation/d/1Hd_Wu3Z0HMUzFC1qz39DzuK2XreEECSkPljCbNB9Fp4/edit#slide=id.g507c958227_0_176

이벤트 상세페이지 구성

https://docs.google.com/presentation/d/1Hd_Wu3Z0HMUzFC1qz39DzuK2XreEECSkPljCbNB9Fp4/edit#slide=id.g507c958227_0_63

이벤트 링크를 3rd-party 서비스(카톡, 밴드...)에 공유시 이벤트 제목이 미리보기로 제공 될 수 있어야함
(현재 모든 페이지의 Html title이 blockchain)

• 페이지 이동
  (이벤트, 랭킹)
• 로고 적용
• 우측 아이콘 프로필 이미지 적용

사용 유입 파악을 위한 GA 적용

Describe the bug
이벤트 생성하기 버튼 show/hide 오작동

To Reproduce
Steps to reproduce the behavior:

1. javacafe.chinaity.co.kr 일반 유저 로그인(어드민 아님)
2. 메인 화면으로 이동

Expected behavior
일반 유저 로그인 시에 이벤트를 생성할 수 있는 +버튼이 보이지 않아야 함

Screenshots

Desktop (please complete the following information):

• Browser chrome

• 샘플 및 가이드 작성

각자 개발한 파트 API 연동테스트 진행

우측 사이드바 화면 구성

https://docs.google.com/presentation/d/1Hd_Wu3Z0HMUzFC1qz39DzuK2XreEECSkPljCbNB9Fp4/edit#slide=id.g507c958227_0_176

이벤트 내용에 new line 처리

https://docs.google.com/presentation/d/1Hd_Wu3Z0HMUzFC1qz39DzuK2XreEECSkPljCbNB9Fp4/edit#slide=id.g51b61b1ed7_1_74

• 프로필 등록 및 수정
• 이름 수정
• 지갑 정보
• 보상 내역
• 이벤트 참여 수

• 검색된 목록으로 재구성

• 페이지 이동
  (프로필, 로그아웃)
• 로그아웃 시 토큰 만료"

Describe the bug
이미지 수정이 정상적으로 안됨

To Reproduce
Steps to reproduce the behavior:

1. 프로필 페이지로 이동
2. 이미지 수정 버튼 클릭
3. 이미지 선택하여 등록
4. 선택한 이미지가 반영되는 듯 보이지만 저장안됨

Expected behavior
선택한 이미지가 정상적으로 등록되고 등록이 정상적으로 되었다는 안내를 할수 있어야함

Screenshots

Desktop (please complete the following information):

• OS: [Mac OS]
• Browser [chrome]
• Version [75.0.3770.142]

원인 파악

• 로그인시 ID 입력란에 공백을 넣을 경우 에러 발생

Cannot read property 'avatar' of null

@JAVACAFE-STUDY/blockchain
https://www.michaelbromley.co.uk/blog/enable-rich-social-sharing-in-your-angularjs-app/#nginx
위 방법처럼 nginx에서 proxy로 돌려주고, 서버사이드 렌더링할수 있게 추가하는게 가장 좋은 방법일 것 같습니다.
더 좋은 의견 있으면 알려주세요~
@yoonhona
#110 해당 이슈는 이 PR로 처리하고, 위 내용으로는 별도 이슈 만들께요.

Originally posted by @rygh4775 in #111 (comment)

이벤트 목록에서 이벤트 생성 버튼 표시

• 관리자만 생성 가능
  상세화면에서 목록으로 가기를 하는 경우 이벤트 목록으로 이동

• 텍스트 길이 생략 처리
• 페이징 처리(더 보기)
• 이벤트 목록 클릭 시 개별 상세 페이지로 이동
  (이벤트 마다 고유의 URL 존재)"

• chainity-web @youngbeomrhee
• chainity-landing @yoonhona

Describe the bug
이벤트 상세보기에서 생성자 정보를 불러올 때 간헐적으로 실패

To Reproduce
Steps to reproduce the behavior:

1. 이벤트 목록 화면에서 이벤트 선택

Expected behavior
이벤트 상세 화면에 생성자가 출력이 되어야 함

Screenshots

Desktop (please complete the following information):

• Browser chrome
• Version 75.0.3770.142 (Official Build) (64-bit)

Additional context
소스 코드 아래 부분도 같이 수정 요청
// TODO 유저정보 조회시 status, role 파라미터가 필수로 되어있음. 이벤트 상세정보에서 어떠한 사용자가 생성한 정보인지 조회시에는 불필요한정보임. 임시로 고정처리

회원 가입과 같은 컨셉으로 수정

이벤트 참여/취소

https://docs.google.com/presentation/d/1Hd_Wu3Z0HMUzFC1qz39DzuK2XreEECSkPljCbNB9Fp4/edit#slide=id.g507c958227_0_63