[스파르타 _ 리액트 과정] 3일차

et Ji·2022년 11월 2일
0

TIL

목록 보기
8/40

📜 진행 내용

  • 팀 소개 웹페이지 프로젝트
    • 개인 소개 페이지 작업 마무리
    • 메인 화면 페이지 본 작업 시작

💡 배운내용

  • 개인 소개 페이지
    • 스타일링 마무리
      • 스타일 효과에만 치중되다 보니, 미디어쿼리가 적용되었을 때 화면 레이아웃이 제대로 잡히지 않았다.
      • 레이아웃을 먼저 생각하고, 그 다음에 스타일을 디자인하도록 연습해야된다.
      • 개인 페이지의 메인화면은 이전에 연습했었던 예제를 참고해서, animation- blink 로 반짝이는 효과를 주었다.
    • 기능 구현
      • nav 바에서 각 카테고리 버튼를 클릭하면 해당 영역으로 스크롤 되도록 했다. 이 부분은 HTML에서 button의 프로퍼티 data-target을 이동하려는 태그의 아이디로 설정한다.
  • 메인 화면 페이지
    • 첫 화면에서 팀원의 이름과 탄생석 이미지가 담긴 카드 이미지 작업을 포토샵으로 완성했다.
    • 역할을 분담할 때, 프론트의 경우 어떤 식으로 나눠서 작업해야할지 난감해서 결국 팀원 중 한명이 거의 도맡아서 하고, 나머지 팀원이 API 연결, 발표자료 준비, 파일 관리 및 취합 등으로 나눠서 작업 중이다.

⁉️ 어려웠던 내용

  • 프론트엔드 영역을 작업할 경우, 어디까지 나눠서 분담해야할지, 어떤식으로 나눠서 작업해야할지 좀더 생각해야한다.

❎ 한 번 더 공부할 내용

  • git 원활하게 사용하면서 작업하기.
    • 협업시 gitHub에 push하는 것.
  • 미디어쿼리 적용 잘되도록 레이아웃 짜기

🎯 문제와 해결

  • 개인화면 페이지의 레이아웃을 잡느라 시간이 많이 걸렸지만, 어느정도 정돈하여 80% 마무리를 했다.
  • 메인화면 페이지구성에 대한 회의 후 마크업과 스타일링 작업 중으로, 오늘 안으로는 링크 연결 외에의 프론트 영역까진 마무리가 될 듯하다.

profile
codesign

0개의 댓글