본문 바로가기

전체 글110

패스트캠퍼스 환급챌린지 24일차 미션 (2월 24일) : 프론트엔드개발 강의 후기 오늘의 목표 뱃지 남은 내용들 강의 듣고, 순차적인 애니메이션 13 14 15 이다. 오늘은 으아 토요일이라서 더더 하기 싫어서 몸부림치는 몸을 붙들고 책상에 앉았다.\으아 어제 그제 스타벅스 예제를 하면서 문득 생각나는 게 있다. 굳이 안 붙여도 되지만, 매번 끝나는 태그에 뒷 쪽에 /이걸 붙이시는 거다. js에서는 필요한 부분이라고는 했다. 굳이 안 붙여도 된다는 이야기도 했지만 갑자기 생각난 내용. 으아 애니메이션은 보통 "transform", "transition", "@keyframes", "animation" 이 있다. 그 중에서 대표되는 transition 에 대해서 정리를 했다. 트랜지션(transition)은 CSS 프로퍼티의 값이 변화할 때, 프로퍼티 값의 변화가 일정 시간(durati.. 2024. 2. 24.
패스트캠퍼스 환급챌린지 23일차 미션 (2월 23일) : 프론트엔드개발 강의 후기 -오늘의 목표 오늘은 Ch 10. 스타벅스 예제의 전반적인 내용을 다시 듣고, 헤더와 드롭다운 내용 그리고 추가로 배지 내용까지! 오늘은 회사 일을 끝내고 강의를 들었다. 듀얼 모니터로 강의를 들으니 한 화면에서 강의 듣고, 다른 화면에서 예제를 바로 vscode로 작성할 수 있으니까 너무 편하다. 확실히 효율도 올라간다. 사실 처음에 강의활용을 잘 할 줄 몰랐다. 깃허브에서 다운받고 css 내용을 복사하는 건 어디서 해야하는 지를 몰라서 계속 헤맸다. 강의를 들으면서 바로바로 예제를 해보고 확인을 바로 하고 싶었는데.. 울면서 할 수 있는 것들을 찾아서 하고 있었다. 그런데 오늘 천천히 다시 들으면서 찾아보니 강의듣는 곳 하단 탭을 보니 강의자료가 있는 게 아닌가!!!!! 강의를 시작한지 한달이 되어가.. 2024. 2. 23.
패스트캠퍼스 환급챌린지 22일차 미션 (2월 22일) : 프론트엔드개발 강의 후기 오늘의 목표 헤더와 드롭다운 메뉴를 살펴보장~! 오늘은 눈이 너무너무 많이 온다 후하아 오늘은 아침부터.. 회사 출근 전에 카페와서 강의를 듣는다... 일찍 일어나서 시작하는 삶은 또 나름 뿌듯하고 행복한 삶이구낭ㅎㅎ 포커스드 (확대되는) 어느정도 기본적인 헤더와 마우스를 오버해서 나타나는 드롭다운 메뉴는 html 구조와 css 만 사용해서 만들 수 있다 물론 그렇다고 단순히 css만 이용한다고해서 드롭다운 메뉴를 만들 수 있는 것은 아니다. css의 :hover 가상클래스를 사용해서 드롭다운 메뉴를 노출시켜야 하기 때문에 :hover 가상클래스를 사용할 수 있는 구조로 만들어야 한다. ul 태그 안에 li 태그를 추가하고(ul과 li는 세트다. 단독으로 쓰이는 경우는 거의 없다 봐야함) *그리고 기본적.. 2024. 2. 22.
패스트캠퍼스 환급챌린지 21일차 미션 (2월 21일) : 프론트엔드개발 강의 후기 오늘은 수요일 오늘은 본격적으로 스타벅스 예제 사이트를 만들기 시작했다. 후하 너무 어렵고 헷갈렸는데 막상 또 따라하기 시작하니 할만하다. 일단 메타 태그? 에 대해서 처음 알게 되어서 메타 태그에 대한 정보를 간단하게 정리해보았다. 태그 태그는 해당 문서에 대한 정보인 메타데이터(metadata)를 정의할 때 사용한다. 요소는 , , , , 요소와 같은 다른 메타데이터 관련 요소들이 나타낼 수 없는 다양한 종류의 메타데이터를 제공할 때 사용되며, 이렇게 제공된 정보는 브라우저나 검색 엔진, 다른 웹 서비스에서 사용하게 된다. 이러한 요소는 언제나 요소 내부에 위치해야 한다. 만약 name 속성이나 http-equiv 속성이 명시되었다면 반드시 content 속성도 함께 명시되어야 하며, 반대로 두 속성.. 2024. 2. 21.

티스토리툴바