내가 해냄/패스트캠퍼스 (71) 썸네일형 리스트형 패스트캠퍼스 챌린지 06일차 - 한 번에 끝내는 프론트엔드 개발 초격차패키지 online 6일차. 챌린지를 진행한지 약 1주일 정도가 되었다. 50일 동안 진행하는 프로젝트이기는 하지만 문득 너무 정해진 것 없이 강의를 수강하고 있다는 생각이 들었다. 진도를 많이 빼려던 어제의 내 목표와도 다르게 강의 4개정도밖에 듣지 못했고(강의가 조금 길다...) 이러다가는 50일이 되어도 강의를 반절도 진행하지 못하면 어떡하나 싶은 걱정이 들었다. 그리하여 챌린지에 나만의 룰을 살짝 추가해보기로했다. 바로 일일 강의 계획서 작성이다! 강의 시작전에 계획서를 따로 작성하지 않았기에 중간에 진행하는 것이 조금 웃기기는 하지만.. 7일차의 시작은 강의 계획을 작성하는 것으로 시작해보도록 하겠다. 주간 목표를 간단하게 나눈뒤 일일 목표를 세세하게 정리하여 하루하루 그 날의 목표는 다 끝내는 것으로 목표를 잡고.. 패스트캠퍼스 챌린지 05일차 - 한 번에 끝내는 프론트엔드 개발 초격차패키지 online 챌린지 05일차. 스타벅스 웹 사이트의 상단 메뉴 부분 만들기를 끝냈다. 사실 혼자서 한다면 절~~대 못했을 거 같지만 강사님이 이해하기 쉽게 CSS요소들을 전부 설명해주시기에 차근차근히 따라나가고 있는 중이다. 이전에 메뉴 버튼을 만들고나서 버튼 하단의 펼쳐지는 드롭다운 메뉴들을 만들었는데 구조적으로도 차근차근 설명을 잘 해주셔서 한눈에 파악하기 쉽도록 정리를 해보았다. COFFEE 라는 메뉴 버튼의 드롭다운 메뉴로 커피/ 에스프레소 음료/ 커피 이야기/ 최상의 커피를 즐기는 법 이라는 1차 드롭다운 메뉴가 있다. 각각은 li 구조를 가지게 되고 보기 쉽게 li1, li2, li3, li4로 구분지어 각각의 태그를 만들어주었다. 또한 각 드롭다운 메뉴의 소메뉴들로 있는 스타벅스 원두/ 스타벅스 비아/ .. 패스트캠퍼스 챌린지 04일차 - 한 번에 끝내는 프론트엔드 개발 초격차패키지 online 챌린지 04일차. 스타벅스 예제를 진행하였고 헤더와 드롭다운 메뉴들을 만들었다. 그간 position 개념에 대해서 조금 헷갈렸었던 부분이 있었는데 로고를 가운데로 배치하는 과정에서 position에 대해 조금 더 자세하게 배울 수 있었다. position : relative; position: relative 속성일 경우 상대적으로 위치를 지정할 수 있다. position: relative;의 top: 100px; left: 100px; 속성 때문에 원래 위치보다 위에서 100px, 왼쪽에서 100px 떨어진 위치에 배치된다. position: absolute; position: absolute 값일 경우 position: relative 속성인 상위(부모) 요소를 기준으로 상대 위치를 지정할 수 있다.. 패스트캠퍼스 챌린지 03일차 - 한 번에 끝내는 프론트엔드 개발 초격차패키지 online 패스트캠퍼스 챌린지 03일차. 강의 part1의 마지막 단계인 스타벅스 웹 페이지 클론코딩을 위한 기본 준비를 마쳤다. 강사님의 깃에서 필요한 파일을 다운하고 폴더정리를 하고 오픈그래프까지 설정하였다. 오픈 그래프는 일상생활에서 익숙하게 알고는 있었지만 용어나 사용법에 대해 배운 것은 오늘이 처음이였다. 오픈 그래프(The Open Graph protocol) 웹페이지가 소셜 미디어(페이스북 등)로 공유될 때 우선적으로 활용되는 정보를 지정합니다. og:type: 페이지의 유형(E.g, website, video.movie) og:site_name: 속한 사이트의 이름 og:title: 페이지의 이름(제목) og:description: 페이지의 간단한 설명 og:image: 페이지의 대표 이미지 주소(U.. 패스트캠퍼스 챌린지 02일차 - 한 번에 끝내는 프론트엔드 개발 초격차패키지 online 챌린지의 두번째 날. 모든 수업의 초반은 역시 HTML인 것 같다. 아직 HTML파트를 공부하고 있는데 아는 내용이기도 하고 내일은 진도를 확 빼놓아야겠다. 수업에서 배우는 언어도 다양하고 길게 구성되어 있기 때문에 앞부분에 시간을 많이 할애하면 안 될 것 같다. 아는 내용이여도 이 수업의 좋은 점은 개념에 대해 보다 세세하게 알려준다는 점이다. 대략적으로만 알고 있던 개념들이나 정보들에 대해 의미와 이유등을 자세하게 알려주어 보다 더 깊게 공부할 수 있다는 점이 장점같다. Doctype (DTD, Document Type Definition) 문서의 HTML 버전을 지정한다. 마크업 언어에서 문서 형식을 정의하며, 웹 브라우저가 어떤 HTML 버전의 해석 방식으로 페이지를 이해하면 되는지를 알려주는 용.. 패스트캠퍼스 챌린지 01일차 - 한 번에 끝내는 프론트엔드 개발 초격차패키지 online 50일 환급일 첫 날이 시작되었다. 2022년 새해부터 여러가지 챌린지를 진행하다가 알게된 패스트캠퍼스의 환급단. 우선 첫 날에는 프론트엔드의 기본에 대해서 배웠고 그냥 막연하게 알고 있었던 용어나 개념을 조금 더 디테일하게 배울 수 있었다. 오늘은 시간이 조금 부족해서 챕터1, 2의 강의를 진행하였는데 프론트엔드 개발의 기본 개념과 vscode의 기본 설정 까지 진행한 첫 날이였다. vscode를 설치하고 사용에 유용한 확장팩들을 설명하고 설치하였는데, 나는 개발 공부를 원래 했었던터라 모두 설치가 되어 있었다. 따로 추가 설치를 하지는 않았고 1일차 강의를 정리하며 마무리하였다. 프론트엔드 개발 HTML, CSS, JS를 사용하여 데이터를 그래픽 사용자 인터페이스(GUI)로 변환하고, 그것으로 사용자.. 패스트캠퍼스 50일 챌린지 시작! 이전 1 ··· 6 7 8 9 다음
