본문 바로가기

분류 전체보기327

메가박스 사이트 만들기 학습일지#3 - 헤더 반응형(모바일) 요새는 웹사이트를 접속할 수 있는 채널이 굉장히 다양해졌다. 나조차도 맥북, 아이패드, 핸드폰 등등 여러 채널로 사이트를 접속하다보면은 불편한것들이 느껴질때가 있다 그때는 알지 못했다ㅠㅠ 이게 이런 작업들이 이루어져야하는것인지를...!! 그냥 이용자 입장에서 접속할때 화면이 잘리거나 어떤 사이트는 팝업창은 뜨는데 닫기 버튼이 잘려서 닫히지않는 사이트들도 있었다 그런걸 보면서 이 수업에서 반응형에 대한 중요성을 새삼 느끼게 되었다. 한편으로는 이런것들을 다 고려해서 코딩을 해야한다고 생각하니 정말 테스트도 많이해봐야할것같고 꼼꼼하게 봐야할것같다는 생각이들었다 일단은 반응형을 코딩하는데 있어서 가장 중요한 개념부터 알고 지나가자! * 미디어쿼리 적용방법 이중에 주로 1번을 가장 많이 사용한다고 한다! 보통 .. 2021. 5. 20.
메가박스 사이트 만들기 학습일지#2 - 배너영역 배너영역에서는 이미지슬라이드 기능 및 메뉴 등 위치잡는 부분에 신경을 써서 배웠던 것 같다. 우선 이 강의에서 가장 좋은건 반응형까지 같이 완성할 수 있다는 점이다. 우선 PC환경에 맞춰서 작업을 한 이후에 반응형까지 공부를 해보자! 03. 메가박스 사이트 만들기 - 배너영역 * 코딩의 기본 습관 → 디자인물을 참고하여 해당 영역에 필요한 부분에 대해 뼈대를 잡는다(HTML) 예를들어, 위 사진과 같이, 배너영역을 잡을 section / 배너 메뉴 영역 / 이미지슬라이드 영역 으로 나누어서 뼈대가 되는 코딩을 작성하고 시작을 해야 나중에 코드가 복잡해지지않고 정리가 쉽다! class 또한 해당영역이 어떤 부분인지 짐작가도록 작성하는게 포인트 * background로 이미지를 표현하는 방법(IR기법) ① .. 2021. 5. 20.
메가박스 사이트 만들기 학습일지#1 - 헤더영역 유투브채널을 통해 메가박스 사이트 만들기를 따라하면서 그당시에는 처음부터 어떻게 만들어야 할지 막막함이 크다보니 따라해보면서 완성해보자라는 생각으로 했던 것 같다! 생각보다 오랜 시간 진행을 하여 완성을 하였고 그러면서 많은것을 배울 수 있었던 것 같다. 나중에 소스들을 보면서 활용할 수 있도록 정리를 해보려고한다. 02. 메가박스 사이트 만들기 - 헤더영역 * 특정영역을 만들때 영역을 구성하는 스타일 1) 제일 큰 영역을 시맨틱 태크로 id값 생성 2) 가운데 영역 Container class 생성 3) 여백을 위한 row 영역 생성 4) 주요 메뉴부분이 들어갈 영역 생성 (div header class 생성) * 태그 → 주로 웹사이트에서 1번 쓰거나 사이드메뉴가 있는경우 2번까지 사용을 한다.(기본.. 2021. 5. 19.
개발일지#4 - 나만의 웹 서비스 만들기(지도API 구상) 그동안 강의를 열심히 들어온 보람을 느끼는 순간이다! 물론, 강의에서 배운내용들을 활용해서 나만의 웹 서비스를 만들기 실습을 하고있지만 복습 이후 다시 소스를 보니까 훨씬 이해가 빠른 것 같다! 우선은 아직까지는 예상한대로 순조롭게 진행이 되고있는듯하다! * 나만의 웹서비스 상세 개발 계획 (완성) 1. 기본 화면 기획(HTML+CSS) 2. 회원가입/로그인 기능 3. 맛집정보 DB저장 , 저장된 데이터 불러오기 (앞으로 계획) ※ 카카오지도 API활용 1. 지도 위치 검색 기능 → 특정위치를 검색하면 해당 위치에 있는 맛집정보를 보여주기 2. 지도를 마우스로 이동하는 경우 → 해당 위치를 이동을 해서 새로고침을 누르면 해당 위치에 맞집정보를 보여주기 3. 지도 내 마커로 표시 + 마커 클릭 시 info.. 2021. 5. 19.