Keyword - html css 페어 프로그래밍
첫 번째 페어프로그래밍, 트위터의 짝퉁 트위틀러 페이지를 html css로 구현하는 과제였다. 원래 페어분이 아프셔서 다른 페어 없으신 분과 짝을 이뤄서 만들었다.
내가 오븐에서 디자인 했던 목업 사이트이다. 리스트형 트윗이 아닌 카드형 트윗목록을 중점으로 디자인하였다.
이게 실제로 짠 사이트 html css인데, vscode에서 잘 작동하던 google icon이 code sandbox에서는 먹히지 않아서 로고는 넣지 않았으며, 우상단 newtweet버튼은 필요없어서 넣지 않았다.
애먹었던 부분을 꼽자면 트윗 하나하나가 js에서 html요소를 생성하는 식으로 짜여 있는데, 트윗 생성 날짜 부분이 두번째 순서로 위치한 것을 아래쪽으로 빼는 것에서 조금 해맸다. position : relative와 top 속성을 활용해서 실제 순서와 상관없이 아래쪽에서 표시되게 바꾸었다.
아이스커피