[DevLog] 서외구 / 2022-03-23

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

- 태스크 카드 세분화 작업
- 필름로그 레이아웃 구성

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

- 이미지 슬라이드 구현을 마무리 하지 못함 (Dom을 이용하는 법을 좀 더 찾아봐야함)

- 모달창 구현시 뒷배경 구현, 뒷배경 클릭시 꺼지는 기능 추가시 스타일드 컴포넌트 사용이 여러웠으나 role: "dialog" 를 이용함
```js
const ModalBG = styled.div`
position: fixed;
z-index: 999;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0, 0, 0, 0.6);
`;

const ModalWrting = styled.div.attrs((props) => ({
role: "dialog",
}))`
width: 70vw;
height: 70vh;
padding: 1.5rem;
background: white;
border-radius: 2px;
margin: 0;
> span.close_btn {
margin-top: 5px;
cursor: pointer;
}
> div.desc {
margin-top: 25px;
color: #4000c7;
}
`;

function FilmLogWriting() {
const [isOpen, setIsOpen] = useState(true);

const openModalHandler = () => {
setIsOpen(!isOpen);
};

return (
<>
{isOpen ? (
openModalHandler()}>
e.stopPropagation()}>

×

) : null}

);
}
```

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

- [ ] 필름로그 레이아웃 마무리
- [ ] 필름토크 레이아웃 / 상세 페이지