프로젝트21 CSS 만들기 기능구현 페이지 영역 나누기 grid-template-areas: ". sort search" "category main main" ". main main"; 영역이 여러개로 나눠져있는 페이지를 구현하기 위해 Grid-template-areas를 사용했다. 1분코딩님의 게시글을 많이 도움이 됐다. https://studiomeal.com/archives/533 이번에야말로 CSS Grid를 익혀보자 이 포스트에는 실제 코드가 적용된 부분들이 있으므로, 해당 기능을 잘 지원하는 최신 웹 브라우저로 보시는게 좋습니다. (대충 인터넷 익스플로러로만 안보면 된다는 이야기) 이 튜토리얼은 “ studiomeal.com 영화티켓 위에 사진 올리기 .movieTicket { position: relative; } ... 2024. 1. 15. 상세페이지 구현 기능구현 헤더 클릭시 상세페이지 -> 메인으로 이동 document.querySelector("header").addEventListener("click", () => { this.location.href = "../main/main.html"; }); querySelector를 이용해 header를 선택하고 click 이벤트시 main.html(메인홈)으로 넘어가도록 구현했다. 메인에서 카드이미지 선택시 상세페이지 이동 let temp_html = ` 태그를 이용해서 카드 이미지에 하이퍼링크 걸기 function findCardIdFromUrl() { const searchParams = new URLSearch- Params(window.location.search); const cardID = se.. 2024. 1. 15. 첫 팀프로젝트 주제, 역할 정하기 과제 개요 개인과제에서 작성한 [내배캠 인기영화 콜렉션]을 발전시키는 팀 프로젝트 팀원들의 프로젝트 N개 중 1개를 대표로 선택, 팀 프로젝트로 발전 팀플 전에 [내배캠 인기영화 콜렉션]이라는 개인프로젝트를 진행했다. TMDB api를 이용해 영화사이트를 만드는 것으로 영화 검색기능, 간단한 css, api를 불러와 fetch로 html에 정렬시키는 기능을 만들어보았다. 이렇게 진행한 개인프로젝트 중에 1개를 대표로 골라 팀 프로젝트로 발전시키는게 이번 팀 과제이다. 필수요구사항 영화정보 상세페이지 구현 상세페이지 영화리뷰작성 기능 구현 github PR 사용한 협업 UX를 고려한 validation check 제시된 javascript 문법 요소를 이용해 구현 선택요구사항 CSS - flex, grid.. 2024. 1. 15. 이전 1 2 3 다음
