TIL(Today I Learned)_미니프로젝트_2일차_24.11.05.Tue

728x90

 오늘은 미니프로젝트 진행 2일차입니다. 사실 어제 적당히 할거하고 TIL을 쓸려고 했는데 마음에 안들어서 고치다보니.. 잘 시간이 되어버렸습니다. 이런저런 홈페이지들을 보고, 반응형도 제작해봤다보니 이렇게 마음에 안 들수가 없습니다. 심지어 어제 만들었던 뼈대(HTML)을 전부 갈아엎고 새로 만들었습니다. 디자인이 1순위로 생각할거는 아니지만 하다보니 욕심 생기는거는 어쩔 수 없나봅니다.

  1. 우리 첫 프로젝트 주제는?
    1. 우리 팀, 우리만의 이야기를 담을 수 있는 ”팀 소개 웹페이지”
    2. 포함 내용
      1. [팀]과 [자신]에 대한 설명 및 MBTI
      2. 객관적으로 살펴본 자신의 장점
      3. 자신의 스타일 협업 스타일 소개
      4. 우리 팀만의 특징과 추구하는 궁극적인 목표
      5. 우리 팀의 약속
      6. 팀원들의 블로그 주소

 첫 프로젝트의 개요입니다. 간단하게 얘기하면 팀 홈페이지를 제작하는겁니다. 어제는 개발일정 짜고, 기본적인 뼈대(HTML)을 제작했습니다.

처음으로 만든 뼈대입니다.

 어제 대충 요정도까지만 하고 오늘은 여기에 살(CSS)를 붙이기로 했습니다. 하지만 이런저런 화려한 홈페이지를 보다보니 이정도로는 만족이 되지 않더라구요. 그래서 오늘 새로 만들고 기능도 이것저것 추가했습니다.

오늘 만든 메인 페이지입니다.

 좀 더 깔끔하게 바꿧고, 네비게이션바를 만들어 클릭하면 화면이 이동하도록 만들었습니다. 추가로 밋밋함을 없애기 위해 오른쪽 위에 일기예보를 달아놨습니다. 오늘 날짜, 현재와 가까운 시간에 사용자의 위치를 전달받아 기본적인 정보를 알려줍니다. 저거 넣으려고 얼마나 고생했는지...🔥

 그리고 오늘부터는 Git도 제대로 사용할려고 합니다. 어제 ~ 오늘 오전까지는 Github에 main에 모든 파일을 git pull, git push로 저장했는데 이제는 팀원들 각자 branch를 가지고 올린 후 마지막에 최종으로 합치기로 했습니다.


 현재 완성한 메인 페이지입니다. 네비게이션바의 hover 이벤트를 꾸몄고 날씨도 기상청 API를 끌어와서 오른쪽 상단에 올려놨습니다.

 네비게이션바는 부트스트랩에서 좋아 보이는 디자인으로 가져와서 꾸몄습니다. 생각보다 연결이 잘 안되고, 원래 있던 코드들과 충돌해서 조율하느라 힘들었습니다.

 날씨 API는 이전에 환경공단에서 API를 끌어와 써본적이 있어서 나름 쉽게 했던거 같습니다. 풍향, 위치 등 여러 정보가 더 있는데 깔끔하게 3개만 넣었습니다. 추가로 마우스 휠로 홈페이지를 내려가도 여전히 화면 오른쪽 위에 붙어있게 해놨습니다.

728x90
반응형
LIST