codestates / codestates/codestory2.0

[이서용][08/19]

Open
#193 0 comments 0 reactions 1 assignee Claimed by @seoyong-lee View on GitHub
클라이언트
Dominant language
JavaScript
Stars
1
Forks
1
PR merge metrics
No merged PRs in 30d

Description

### 오늘은 어떻게 프로젝트에 기여했나요?

- 랜딩 페이지 페이드 인 / 아웃 효과 추가 및 로그인 API 연결

### 오늘의 프로젝트에서 느낀 점이나 기억에 남는 점은 무엇인가요? (필수 1개)

- 어제 어바웃 페이지 제작에 사용하였던 GSAP의 타임라인 기능을 통해 랜딩 페이지도 같은 방식으로 쉽게 구현할 수 있었다. 로그인 관련 API 연결은 _app.js에 상태를 둘 수 있는지 여부 확인과 추후 작업의 편의를 위해 기존 api.codestory 를 이용하여 진행해 보았다. 결과적으로는 큰 문제가 없는 것으로 확인되었으며, 나머지 랭킹 및 마이페이지 컴포넌트도 기존 api를 연결한 뒤 새로운 연결 방식이 도입되면 그에 맞추어 마이그레이션 할 예정이다. 상태 관리와 관련하여 한 번 정리가 필요하다는 생각이 들어서 일러스트를 통해 관계도를 도식화 해 보았다.
![](https://raw.githubusercontent.com/seoyong-lee/images/main/props.png)

사실 이정도로 복잡해 진다면 상태 관리를 위한 라이브러리를 사용하는 것도 고려해 볼 수 있으나, 이제 1주 남짓한 기간 만이 남았기 때문에 일단은 리액트 hook 만으로 최대한 정리하면서 연결해보려 한다.

- 추가적인 고민으로는 게임 진행 이전의 애니메이션 구성을 어떻게 할 것인지와 CSS 게임 구성이다. 일정이 맞추어 최대한 진행해 보아야 하겠지만 만약 정리되지 않는다면 완성도가 높은 게임을 먼저 정리하는 것이 발표를 위해서라도 나은 선택이라고 생각된다.

- 게임이라는 컨셉 때문인지 진행하다 보니 사이트가 웹 페이지 보다는 어플리케이션의 느낌을 가지게 되었다. 또한 일반적인 사이트가 흰 배경을 중심으로 구성된 이유를 알 것 같았다. 색 위에 올라간 글은 확실히 읽기가 힘들다.

### 내일은 프로젝트에 기여하기 위해 무엇을 해야 하나요?

- [ ] 랭킹 및 마이페이지 api 연결 준비

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.