codestates / codestates/Reciper-client

[✍️ Dev Log] 이우성 / 2021-05-11

Open
#8 0 comments 0 reactions 1 assignee Claimed by @useonglee View on GitHub
@useonglee/기록은 성장의 밑거름 💨 Dev Log
Dominant language
TypeScript
Stars
13
Forks
7
PR merge metrics
No merged PRs in 30d

Description

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

클라이언트 개발 시 필요한 초기세팅을 했다.

그 후, 재사용성이 높은 컴포넌트들을 제작했다. 먼저 워크스페이스(사용자가 로그인 후 칸반보드나 일정, 채팅을 할 수 있는 공간) 페이지를 제외한 모든 페이지에서 사용되는 Header를 제작했다.

![init header](https://user-images.githubusercontent.com/75570915/117836178-6e0a7000-b2b3-11eb-9bd1-7cbd93e7d887.png)

정말 심플하게 헤더를 제작했고, `border-bottom` 부분에 쉐도우를 주어서 포인트를 넣어주었다.

로고 제작 후에 로고를 적용시키면 더 이쁜 헤더가 될 것 같다!



그 다음은 Button 컴포넌트를 제작했다.


```ts

```


![button](https://user-images.githubusercontent.com/75570915/117837719-a6f71480-b2b4-11eb-9604-1af3036f620e.png)



`size`에는 small, large 값의 따라 크기가 달라지고 `buttonType`은 basic이냐 cancel이냐에 따라 달라지게 컴포넌트를 만들었다.





그 다음은 Select Box도 직접 커스터마이징을 하였다.


```ts
우성
```


![Select](https://user-images.githubusercontent.com/75570915/117838484-56cc8200-b2b5-11eb-996d-97535ff656c4.gif)



직접 옵션 정보만 넣어주면 옵션 정보들이 밑에 나올 수 있게 직접 디자인을 해보았다!



이렇게 만든 컴포넌트들을 이제 내일부터 마구마구 사용해주면 된다!

### 오늘의 프로젝트에서 힘든 점은 무엇인가요?

- redux를 활용한 로그인 인증에 대해 더 공부할 필요가 있다.
- localStorage 사용에 대해 아직 많이 미흡하다.
- 로그인 요청을 보내고 받을 때 console을 하나씩 찍어가며 토큰이나 필요한 정보들을 잘 받아 오는지에 대한 확인이 부족하다.

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

- [x] 프로필 페이지 디자인 및 입력 폼 제작
- [x] 프로필 페이지에 작성된 유저 정보를 서버에 요청

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.