lyuna's story

과제 개요순수 바닐라 자바스크립트만으로 영화 리스트 조회 및 검색 UI 구현필수 요구사항- [1] jQuery 라이브러리 사용없이 순수 바닐라 자바스크립트 사용하기- [2] TMDB 오픈 API를 이용하여 인기영화 데이터 가져오기- [3] 영화정보 카드 리스트 UI 구현    - TMDB에서 받아온 데이터를 브라우저 화면에 카드 형태의 데이터로 보여줍니다.    - 카드에는 title(제목), overview(내용 요약), poster_path(포스터 이미지 경로), vote_average(평점) 이렇게 4가지 정보가 필수로 들어갑니다.- [4] 영화 검색 UI 구현    - API로 받아온 전체 영화들 중 영화 제목에 input 창에 입력한 문자값이 포함되는 영화들만 화면에 보이도록..

팀원끼리 회의해 보았을 때 강의를 먼저 듣는 것이 낫다고 판단하여 5주차까지 배속해서 다 듣기로 하였으나.우리도 하면서 이건 아니라는 것을 깨달았고 튜터님과 매니저님께 상담을 받고 난 후에1,2주차만 우선 듣고 손코딩을 해보라고 하셔서 팀원들과 뒤늦게서야 실습을 해보기로 하였다.이런식으로 실습을 하면서 기본 코드를 익힌 후에 개인과제의 틀을 먼저 잡아보기로 하였다.

오늘은 메인 페이지를 각자 만들어보기로 한 날~!개인페이지로 숙련을 좀 해둔 탓에 머릿속으로 어떻게 해야할지 대충 그려졌다.각자 메인페이지 틀을 잡아보자 해서 만들고 다른 팀원분 것이 채택돼서 그 코드로 진행하기로 했다.팀원 한 분이 맡아서 메인페이지를 완료 해주셨댜! 이렇게 완성된 우리 팀 메인페이지  각자 zep 캐릭터를 넣어서 게임느낌이 나게 메인을 설계했다! 마우스를 올리면 밝기를 낮춰주는 hover기능도 사용하였다.

어제 수업이 끝나기 전에 튜터님께 숙제를 하나 받았다. flex를 사용하여 본문 박스와 해시태그 박스를 일정하게 배치 하는? 숙제.어제 받았던 flex 관련 포스트를 읽어보고 사실 이것 저것 다 넣어보니 되더라,, 해보는게 답이다.프로필과 해시태그 박스를 묶은 main div에 dislpay: flex; 을 선언해주고 세로로 정렬 후에  아이템 사이에 균일한 간격을 만들어주는 space-between을 선언했다. 그러니 오른쪽처럼 쨔잔 하고 떨어지더라. margin-top을 주어도 모양은 같았음 하지만 여러 아이템이 있다면 이 방법이 훨씬 간단할 것 같다. 하나 끝내고 나니 또 과제를 내주셨다. h2태그로 작성한 해시태그에 마진을 없애고 div안에서 가운데 정렬하기이건 생각보다 쉬웠다 무족건 flex관련..

부캠 시작주는 미니 프로젝트로 주제 : 팀원 소개 웹사이트 일단 와이어프레임은 팀원과 거의 2시간? 동안 끊임없이 대화하고 튜터님들과 의견공유 하면서 꽤나 멋들어지게 짰다 물론 다 구현할 수 있을지 걱정했지만 도전해보자! 하고 알차게 구성했다 우선 다들 제로베이스라 각자 강의내용을 숙지한 후에 개인 페이지를 구현해보기로 하였다 전체적인 틀 잡는 것은 어렵지 않았으나 Flex에 대한 개념이 부족해서 계속 박스들이 여기저기 나뒹굴고,, 결국 튜터님께 sos를 쳤다 https://studiomeal.com/archives/197 이번에야말로 CSS Flex를 익혀보자 studiomeal.com 문제점은 display : flex 한 문장으로 해결됐다 얼레벌레 til을 처음 써보니 문제가 생겼을 때 화면들을 캡..