mimii
-
2일차 - 퍼블리싱 스터디 기록Front-end Dev./HTML_CSS 2022. 1. 2. 23:16
은정 멘토님이 진행하시는 퍼블리싱 스터디에 참여하게 되었다. 배우면서 헷갈리는 것과 피드백받은 내용 위주로 기록하려고 한다! 2일 차에는 네이버 홈페이지, 회원가입, 가입정보 입력 페이지 마크업 연습 코드 리뷰 위주로 스터디가 진행되었다. 배운 내용을 잘 정리해서 올리고 싶지만 우선 기록이라도 하는 것에 목표를 두고 있다! nav 태그 한 사이트에 편하게 이동할 수 있게 만들어줌 사이트 내 탐색하는 버튼으로 nav를 사용 외부 링크로 이동할 때 묶는 방법으로 사용 X ex) 쥬니어네이버, 해피빈은 같은 회사지만 다른 서비스, 외부 링크 main 태그 안에 nav 태그가 들어가지 않음 시각적으로만 바라봐선 안됨 label 태그 사용하지 않을 경우 접근성이 확 떨어짐 1) 시각적으로 텍스트 클릭이 안됨 2)..
-
TIL 06. 5주차 회고☺️Front-end Dev. 2021. 12. 4. 02:41
🦁 멋쟁이 사자처럼 프론트엔드 스쿨 1기 🦁 - 5주 차 회고 - :) 블로그에 너무 소홀했던 지난날을 반성하며 5주 차 회고를 해보려고 한다! 씻는 건 허락해주세요... ✨ 5주 차 회고 일기 4주 차에 HTML/CSS 수업 진도를 나간 후 SASS를 배웠고 5주 차 때 자바스크립트 수업을 시작했다. 수업이 나에겐 아직 너무 어렵지만 수업에서 놓친 부분을 반복적으로 알려주셔서 좋았다. 자바스크립트 뿌셔..! 앞으로 남은 2달동안 현실적으로 지킬 수 있는 계획을 세워서 꾸준히 개발 공부를 하는 것이 목표이다. 추가로 그날 배운 내용, 스터디 활동 내용을 블로그에 기록하는 것도 계획하고 있다. 📍액션플랜 1. 스터디에 집중하기 1) 게으른 스터디 (화, 목, 토) ☺️ - 시디즈 클론 코딩 : HTML /..
-
TIL 05. CSS 단위 (em, rem, px) 정리Front-end Dev./HTML_CSS 2021. 11. 15. 23:32
평소 헷갈리던 단위 개념인 rem, em, px 단위를 정리해보려 한다. CSS 공부를 하면서 어떤 상황이든 px을 사용하곤 했는데, 디자인 의도에 따라 단위의 사용 목적이 바뀐다는 것을 알게 되었다. 오늘은 상대적 단위인 rem, em에 대해서 더 알아보고자 한다. 1. rem (root em) : 루트 요소(html)의 폰트 크기를 기준으로 사용하는 단위. font-size를 조절하는데 유용하게 사용된다. 사용자가 브라우저 폰트 크기를 설정한 경우 rem도 영향을 받는다. 루트 요소의 폰트 크기를 62.5%로 지정한 후 rem을 사용하는 방법은 1 rem = 10px이 되어 계산하기 편하다. 계산을 편하게 하기 위해서 Html에서 font-size를 10px으로 설정한 후, 모든 요소에 1 rem =..
-
TIL 04. 레이아웃 구현 프로젝트Front-end Dev./HTML_CSS 2021. 11. 14. 23:39
조.미.진 개발 공부를 시작한 지 2주 차 되다. 멋사 프론트엔드 스쿨 레이아웃 과제를 통해 마크업 구현과 CSS 연습을 했다. 간단한 레이아웃 구현을 하면서 생긴 질문들과 배운 것들을 적어보려고 한다! 아직 손이 너무 느리고 개발 머리가 빠릿빠릿하게 돌아가지 않아서 잘 따라가지 못할까 봐 두려운 마음이 있지만! 부정적인 생각에서 벗어나 내 주변에 감사할 일에 집중하려고 노력하고 있다! 같은 목적을 갖고 불철주야로 서로 힘써서 도와주는 동료들과 함께하니 지금 하는 과정이 정말 너무 좋고 같이 공부할 수 있어서 감사하다💛 1. 시맨틱 한 코드를 위해✨ 1) 이번 과제는 독립적인 콘텐츠를 나타내는 article 태그로 전체 박스 구조를 잡아야 한다. 이번에 div를 최대한 안 쓰려고 main, section..
-
TIL. CSS 설계 기법Front-end Dev./HTML_CSS 2021. 11. 13. 01:51
기대하고 기대하던 CSS 설계 기법을 학습했다. 저 이제 class명 고민 그만할래요..✋ 마크업에서 기준없이 class명을 정하다보니 오래 걸리는 것과 기억하기 힘든 것이 문제였다. CSS 설계 기법으로 BEM을 알게 되어서 이제 좀 더 클린한 마크업이 되길 기대하고 있다. ✅ 우선 방법론에는 크게 3가지가 있다. 1. OOCSS 2.SMACSS 3.BEM 그 중에 3번째 방법론인 BEM에 대해 먼저 정리를 한 후 나머지 2가지 방법론을 다뤄보겠다. BEM (Block Element Modifier) - 러시아에 있는 얀덱스(Yandex)사가 만든 설계방법이다. - HTML, CSS의 클래스의 설계 규칙이다. - OOCSS와 같은 모듈기반의 방법을 뿌리로 한다. ✅ 기본규칙 ▶ 원활한 가중치 계산을 위..
-
TIL 03. CSS position카테고리 없음 2021. 11. 5. 01:13
| Position position이란? Position의 종류 static relative absolute fixed 1. Position이란? - html 태그나 id, class 등 하나의 키워드 값을 선택해 위치를 지정해주는 속성이다. 2. Position의 종류 👉 static (정적 위치) - 모든 태그들의 처음 상태(기본값)이다. - 왼쪽에서 오른쪽, 위에서 아래로 쌓인다. 👉 relative (상대 위치) - 자신이 있어야하는 위치에 상대적이다. - 태그의 위치를 변경하고 싶을 때 사용한다. - absolute의 기준점이 된다. - relative가 없다면 전체 body가 기준이다. 👉 absolute (절대 위치) - 마이웨이같은 속성이라고 생각하면 된다. - 기준점이 html 위치에 있..
-
TIL. Html/CSS 기초 #1카테고리 없음 2021. 11. 4. 01:16
멋쟁이 사자처럼 프론트엔드 스쿨 1기 👇액션플랜,피드백 더보기 + 이제 점점 수업 속도가 붙는 것을 느꼈다! 복습할 양이 점점 쌓여가고 미처 복습하지 못한 부분도 생겨서 약간 눈 앞에 안개가...🌫🌫 훠이..훠이.. 수업 전,후에 시간을 효율적으로 쓰는 법이 필요하다고 느꼈다. 매니저님이 일찍 자고 새벽에 일어나는 것을 추천해주셨다. (feat. 나의 하루는 새벽 4시30분에 시작된다) 책을 통해서 올바른 습관이 만들어지는 것을 경험해본 적이 있어서 나도 얼른 저 책을 읽고 실천해보고 싶다. 이번주 나의 목표는 + 이번 프론트엔드 스쿨을 통해서 아침형 패턴을 만들어 가고싶다. + 이번 주 안에 Html과 CSS 구조와 기능을 잘 이해하는 것이다. 👊내일부터 밤 11시에 자고 아침 5시에 일어나기. 👊내일..
-
TIL. 멋사_1차 포트폴리오 워크샵#1카테고리 없음 2021. 11. 2. 22:55
🦁멋쟁이 사자처럼 프론트엔드 스쿨 1기🦁 👉 포트폴리오 워크샵 Am 9:00 - Pm 4:00 _ 프론트엔드 스쿨 수업 이틀째✌️ 멋쟁이사자 팀에서 포트폴리오 워크샵을 진행해 주셨다. 파워 비전공자인 나는 현재 개발 공부 의지에 비해 학업 목표&취업 방향에 대해 막연한 상황이는데, 적절한 때에 워크숍을 진행해주시다니..! 매번 프론트엔드 스쿨 커리큘럼에 감탄하고 있다.✨ 크으.. (매일 가족들한테 멋사 프론트엔드 스쿨 너무 좋다고 찬양 중이라는 TMI..) TIL(Today I Learned)을 습관을 들여서 개발을 꾸준한 사랑하는 마음이 드러났으면 좋겠다.🥰 없던 습관을 만드는 것이기 때문에 처음에는 시간도 오래 걸리고 신경도 많이 쓰이겠지만, 시간을 투자하는 만큼 돌아온다는 것을 알기에..✨ 오늘 인..