군만두의 IT 공부 일지

목차 🚀 진행기간: 2023년 6월 26일 ~ 2023년 7월 13일 ⭐요약 이번 과제에서는 목업이 아닌 실제로 작동하는 계산기를 만들고, Github를 사용해 PR를 하는 과정까지 진행함. 1) 버튼이 잘 눌렸는지 확인 계산기의 숫자버튼을 클릭했을 때의 변화를 개발자 도구의 Console 탭을 이용하여 확인함. 2) 기본 계산 기능 구현 두 숫자의 사칙연산을 할 수 있는 계산기를 구현함. 3) 학습 목표 계산기 Github repository에 작성된 HTML, CSS를 이해할 수 있음. 두 숫자의 사칙연산을 구현할 수 있음. ⭐과제 원본 저장소를 fork 하고, 위 내용 진행하여 코드 수정 후 pull requests를 하는 과제임. ⭐과정 1. 원본 저장소 Fork 원본 저장소(레포지토리) 오른쪽 ..

목차 🚀 진행기간: 2023년 6월 26일 ~ 2023년 7월 13일 ⭐요약 HTML과 CSS를 활용하여 Flexbox를 이용한 레이아웃 구성 방법과 각 속성의 적용에 대해 정리함. 더보기 🚀 HTML 구성과 Flexbox 활용 1) HTML 구성 웹 페이지의 콘텐츠 흐름은 기본적으로 좌에서 우, 그리고 위에서 아래로 진행됨. 효율적 관리를 위해 Flexbox 레이아웃을 활용하여 수직 및 수평 분할을 적용할 수 있음. 2) Flexbox 레이아웃의 기본 Flexbox를 사용함으로써, 개발자는 컨테이너 내의 항목들을 유연하게 정렬하고, 각 요소가 차지하는 공간을 쉽게 조절할 수 있음. display: flex 속성은 요소들을 가로로 정렬하며, Flexbox 속성을 통해 세밀한 레이아웃 조정이 가능함. 3)..

목차 🚀 진행기간: 2023년 6월 26일 ~ 2023년 7월 13일 ⭐요약 웹 페이지의 스타일과 레이아웃을 결정하는 데 필수적인 CSS의 기초적인 내용을 정리함. 더보기 🚀 CSS 기초 1) CSS(Cascading Style Sheets) 웹 페이지의 스타일과 레이아웃을 결정하는 스타일시트 언어. CSS는 색상, 글꼴, 크기, 간격 등 웹 페이지의 시각적 요소를 제어할 수 있음. 2) 박스 모델 웹 페이지를 구성하는 모든 요소는 박스 모델로 표현됨. 요소의 콘텐츠, 패딩(padding), 테두리(border), 마진(margin)으로 구성됨. 3) 선택자 CSS에서는 다양한 선택자를 사용하여 특정 요소에 스타일을 적용할 수 있음. id 선택자, class 선택자, 태그 선택자, 속성 선택자 등이 포함..