본문 바로가기

학원에서 배운 것85

KDT 5th 웹개발자 입문 수업 8일차 주말 간 헤더를 세 개의 사이트(인프런과 청년몽땅정보통, 투썸플레이스)에 만들어 보면서 그래도 좀 실력이 늘었을까 싶다. 완벽하게 모작하지는 못했지만(아직 자바스크립트 활용법을 모름..) 모양만 대애충 ... 오늘부턴 스타벅스 페이지를 클론 코딩 한다고 하신다! 스타벅스 홈페이지 클론 코딩 - 1 1. 문자 인코딩 설정 - UTF-8 : 초성, 중성, 종성으로 문자를 구분하여 작성 (ex. ㄱ, ㅏ, ㅇ, ㅇ, ㅏ, ㄴ,...) - EUC-KR : 하나의 완성된 글자를 인식 (ex. 강, 안, ...) 2. 뷰포트 렌더링 방식 설정 - width=device-width : 화면의 가로 너비를 각 디바이스의 가로 너비와 동일하게 적용 - initial-scale=1.0 : 화면의 초기 화면 배율(확대 정도.. 2023. 2. 6.
KDT 5th 웹개발자 입문 수업 7일차 - clone 1. Clone git clone 아래에서 복사한 주소(.git) 실행해주면 원격 저장소의 내용이 로컬 저장소에 clone 된다. 커밋과 푸쉬로 다른 공간, 다른 컴퓨터로 수정해도 반영이 된다. github desktop으로 clone을 진행하려면, File > clone repository > url 에서 위의 링크를 붙여넣기 하면 된다. 2. GitHub 홈페이지에서 저장소 들어간 뒤, .을 누르면 온라인 비쥬얼스튜디오 코드와 연동이 된다. 3. Pull git fetch origin 변경 사항을 상태 체크 후 로컬에 상태만 가져오는 것으로 반영되지는 않음 -> merge 해야함 두가지 작업을 한번에 하는 것이 git pull -all 로 원격 저장소의 변경 사항을 로컬에 반영 하는 것 4. git .. 2023. 2. 3.
KDT 5th 웹개발자 입문 수업 7일차 인프런 헤더 만들기 간단하게 헤더를 만드는 방법에는 2가지가 있는데, 첫번째로는 position absolute로 고정시키는 것 두번째로는 display flex로 만들기 ✔️ 이 방식을 사용함 1. HTML 파악하기 - 로고 - Nav 메뉴 - 검색창 - 추가 메뉴 - 로그인/회원가입 버튼 1-1. B.E.M (Block / Element / Modifier) CSS 클래스 이름을 짓는 방법 기본적 룰을 가지고 통일이 되어야 협업하기에 용이, 추후 SCSS 와 함께 사용하기 편리 (React 때문에 점점 덜 사용되는 추세지만 기본으로 알아 둬야함) - 요소__일부분 : 요소의 일부분을 표시할 때 언더바(__) - 요소--상태 : 요소의 상태를 표시할 때 대쉬(--) 1-1-1. Block 가장 바깥쪽 .. 2023. 2. 3.
KDT 웹개발자 입문 강의 6일차 - 오버워치 캐릭터 선택창 실습 드디어 제대로된 실습 시작! 해당 화면을 만들어본다고 한다. 1. 가장 먼저 ... reset CSS 크롬, 사파리, 파이어폭스, ... 등의 다양한 브라우저가 존재함 각기 브라우저가 가지고 있는 디자인 요소 값을 초기화해줄 필요가 있다. https://www.jsdelivr.com/package/npm/reset-css jsDelivr - A free, fast, and reliable CDN for JS and Open Source Optimized for JS and ESM delivery from npm and GitHub. Works with all web formats. Serving more than 150 billion requests per month. Built for productio.. 2023. 2. 2.