본문 바로가기

전체 글46

[5주차] daily 📍 해야할 것들 ✅ 종찬 강사님 특강 과제 soldout 라벨 넣기 ✅ lotto 실습 / 블로그정리(HTML,CSS,JavaScript) ✅ 자기소개서 실습 / 블로그정리(HTML,CSS,JavaScript) ✅ 미니스타그래프트 실습 / 블로그정리(HTML,CSS,JavaScript) ✅ 로그인 모달 실습 한거 멘토님께 코드리뷰 받기 (이후 블로그 글에 추가로 의문점이 었던 것들 적기) ✅ [토요일 특강 과제] 랜딩페이지 반응형까지 ✅ 랜딩페이지 블로그 정리 👩‍💻 오늘 중요 학습 0327 SASS (scss) - sass 는스타일시트가 점점 더 커지고 복잡해지고 유지관리가 어려워질때 사용하는 시스템 - 한줄 주석은 컴파일 되지 않아서 본인들끼리 볼 때만 한 줄 주석으로 처리하기도 함 - '_'를 붙이.. 2023. 3. 26.
[HTML, CSS] portfolio 페이지 만들기 두개의 scene 으로 나눠진 porfolio 페이지를 반응형으로 만들었다. 구현해야 하는 요소만큼 오류도 많아 주말 하루를 받쳐서야 완성할 수 있었다😢 해당 글은 작업하면서 있었던 오류들을 정리한 글이다. 일단 처음에 폰트를 설정할때 나는 보통 @font-family 를 주는데 종찬 강사님 같은 경우엔 :root 변수 로 폰트를 설정했다 둘의 차이는 뭘까? 내 생각으로는 @font-family 는 설정을 한 뒤 한번더 폰트를 설정해야하지만 :root 변수는 전체적으로 해당 폰트가 설정된다는 차이가 있다. 1. 큰 레이아웃 잡기 처음에 제일 큰 씬을 먼저 잡고 시작했다 시각적으로 제일 눈에 띄는 보라색 배경과 핑크 배경으로 class 명을 주었다. 각 씬 안에는 안의 콘텐츠를 모두 담는 wrapper를 .. 2023. 3. 26.
[HTML, CSS] login modal 만들기 위 로그인 모달을 html, css 까지 구현을 해봤다. 로그인 방법이 2개로 나뉘어져 있는데 직접 아이디/ 비밀번호를 적어서 로그인을 하는 방법과 SNS 계정으로 로그인하는 방식이다. 내가 위 코드를 짠 순서는 큰 모달창 가운데 정렬 을 먼저 한 다음 단 으로 나뉘어진 부분이 없어 따로 레이아웃을 정렬할 필요가 없다는 생각이 들어 위에서부터 차근차근 내려오면서 html 과 css를 번갈아가면서 짰다 . 1. 모달창 가운데 정렬하기 일단 나는 로그인 모달은 어디서든 독립적으로 쓸 수 있다는 생각이 들어 크게 article 태그로 묶어 주었다. 넓이값은 figma에 있는 넓이값 그대로 520px 을 줬는데 후에 모바일로도 반응형을 만들것을 고려하여 max-width 로 주었다. 이후에 수평 가운데 정렬을 .. 2023. 3. 25.
[4주차] daily 📍 해야할 것들 ✅ 종찬 강사님 특강 과제 ( 마크업 접근성 생각해 넣기) ✅ 로그인 모달 실습 한거 멘토님께 코드리뷰 받기 (이후 블로그 글에 추가로 의문점이 었던 것들 적기) ✅ 로그인 모달 실습한거 셀프 코들 리뷰 블로그 정리 ✅ 로그인 모달 실습 - 0321 ✅ 자바스크립트 기초강의 함수 부분 듣기 - 0321 ✅ 오늘치 새로 배운것들, 느낀점 넣기 ✅ 밴딩머신 과제 완성 ✅ 종찬 강사님 과제 반응형으로 완성해보기 👩‍💻 오늘 중요 학습 0320 용어의 정의가 바뀌지 않는 것들은 dl, dt, dd 를 쓰는 것이 좋다 EX) 사전 독립적으로 사용가능한 요소는 article 태그를 독립적으로 사용가능하지 않은 것들은(흐름이 있는 랜딩페이지) section 태그를 오로지 css 꾸밈요소를 위한 것들은.. 2023. 3. 20.