패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 32일차입니다! 오늘은 9번째 커리큘럼 'HTML / 전역 속성, 기타' 과정 공부를 마쳤습니다. 이로써 HTML 파트가 마무리되었는데요. 많은 지식을 약 한 달 동안 꼼꼼하게 머릿속에 넣을 수 있어 기쁩니다. 😊 한 달 동안 다른 공부도 꽤 했는데, 시간이 너무 빨리 가서 그런지 매번 '뭐 했다고 시간이 이렇게...!' 라는 말만 나오네요. 오늘은 07~11. 전역속성 - hidden, tabindex / 절대경로와 상대경로 / 주석 (Comment) / 특수기호 (Entities) 를 공부했어요. 🔶 요소를 만들어두고 화면에서 숨길 때 사용 🔷 예제 - form은 숨겨져있지만 버튼을 누르면 form의 action 속성에 따라 이동 전송 (예..
패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 31일차입니다! 오늘은 9번째 커리큘럼 'HTML / 전역 속성, 기타' 과정 공부를 시작했습니다. 분량을 보니 내일이면 HTML 파트를 마무리할 것 같아요. 🎉 HTML 기본기를 충실히 다지고 실무에서 정확한 용어를 사용할 수 있는 개발자가 되고 싶습니다. 👩💻 오늘은 9번째 커리큘럼의 절반 분량인 01~06. 전역속성 - class와 id / style / title / lang / data-* / draggable 에 대하여 공부하였습니다. 🔶 모든 HTML 요소에서 공통적으로 사용 가능한 속성 🔶 공백으로 구분된 요소의 별칭 지정 🔶 중복 사용 가능 🔶 CSS 또는 JavaScript의 요소 선택기(CSS 선택자나 QuerySelect..
패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 30일차입니다! 어느새 미션의 3/5를 달성했네요. 이번 주까지는 HTML 파트를 들어야 할 예정이지만요. 분명 거의 매일 최소 3개 이상의 클립을 들었는데 아직 HTML 파트라니... HTML 내용이 많다는 걸 몸소 느낍니다. 제 생각엔 50일까지 CSS 파트를 다 듣는 걸 목표로 해도 될 것 같아요. 미션 완료까지 3주 정도 남았는데, CSS 파트도 중요하고 알찬 내용이 가득한 것 같아서, CSS까지 마스터하는 걸로! 오늘은 13~15. 양식 - FIELDSET, LEGEND / SELECT, DATALIST, OPTGROUP, OPTION / PROGRESS 를 공부했습니다. 🔶 같은 목적의 양식을 그룹화 🔶 속성 : form, disab..
패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 29일차입니다! 오늘은 8번째 커리큘럼의 'HTML/요소- 양식' 중, 과 태그에 대하여 공부하였습니다. (08~10. 양식 - INPUT (1), (2) / LABEL) 의 type 종류는 정말 많은데, 실무나 토이 프로젝트를 할 때, 필요한 기능을 그때그때 찾아쓰다보니 한정적으로만 사용하고 있었는데요. 이번 기회에 그 종류가 얼마나 많고, 어떻게 쓰이는지 몇 가지를 실습해볼 수 있었습니다. 과 태그 실습 자료는 아래 JSFiddle 에디터에서 확인할 수 있습니다. 🔶 display: inline-block 🔶 주요 속성 (1) autocomplete : 자동 완성 기능 / 기본값="on" / 값으로 on, off 를 가짐 🔶 주요 속성 (2..
패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 28일차입니다! 오늘은 8번째 커리큘럼의 'HTML/요소- 양식' 공부를 시작하였습니다. 순서대로라면 뒤에 강의를 들어야 하는데, 클립 양을 보고 제가 순서를 임의 조정하였습니다. 그래서 오늘은 04~06. 양식 - FORM / TEXTAREA / button 에 대하여 학습했어요. 🔸 여러 입력 양식의 범위 지정 ➡ 웹 서버에 정보를 제출하기 위한 양식 범위 정의, 특정 양식/주소로 정보 전송 🔸 태그 중첩 사용 불가 🔸 속성 (1) action : 사용자에게 입력받은 정보를 전송할 주소 🔸 속성 (2) autocomplete: 자동완성 기능 사용 여부, 기본값=on 🔸 속성 (3) method: 기본값=GET, 🔹 GET: URL 주소에 보..
패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 27일차입니다! 오늘부터 8번째 커리큘럼, 'HTML/요소- 표 콘텐츠 & 양식' 공부를 끝냈습니다. 3개 강의 중 2개 강의에서 설명된 태그는 처음 알게된 것들이고 (은 실무에서 써봤던 것 같기도 하고...) 나머지 1개 강의에서 설명된 태그의 쓰임새에 대해서는 정확하게 배웠습니다. 오늘은 04~06. 표 콘텐츠 - CAPTION / COLGROUP,COL / THEAD, TBODY, TFOOT 에 대하여 학습했어요. 🔸 표의 제목을 설정함 🔸 열리는 태그 바로 다음에 작성함 🔸 당 하나의 만 사용 가능함 🔸 표의 전체 열에 대한 공통 정의 🔹 안에 태그 작성 🔸 빈 태그 🔸 표의 열을 공통 정의 🔸 속성 span: 연속되는 열 수, 기본값=..
패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 26일차입니다! 오늘부터 8번째 커리큘럼, 'HTML/요소- 표 콘텐츠 & 양식' 공부를 시작했어요. 실무에서는 표를 만들 때 쉽게 만드는 방법으로 태그를 사용했는데 이 기회에 태그도 잘 활용하고 싶습니다. 오늘은 01~02. 표 콘텐츠 - TABLE / TH / TD 태그에 대하여 공부했어요. 🔸 테이블(표) 생성 🔸 display: table, block과 비슷한 개념 🔸 Table Row(행) 생성 🔸 display: table-row 🔸 Table Head(머리글 칸) 생성 🔸 display: table-cell 🔸 속성 (1) abbr : 열에 대한 간단한 설명 (중요도 ⬇) 🔸 속성 (2) scope : 무엇의 '머리글 칸'인지 명시..
패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 25일차입니다! 오늘은 7번째 커리큘럼의 10~12. script (1)~(2), noscript 에 대하여 공부했어요. 간만에 예전에 문득 궁금했었던 것에 대하여 알게 되었는데요. 이론상으로는 나 태그는 안에 쓴다고 하지만 html 문서의 코드는 순차적으로 읽히기 때문에, 실무나 프로젝트를 할 때 태그를 태그 가장 아래에 쓴다고 배웠었어요. 그런데 의 defer 속성을 사용하면 를 에 써도 에러가 나지 않을 수 있습니다! https://developer.mozilla.org/ko/docs/Web/HTML/Element/script 🔸 script 속성 (1) : async, 스크립트의 비동기적 실행 여부, Boolean 값, src 속성 필수..
패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 24일차입니다! 오늘은 내장 콘텐츠를 표현하는 2가지 태그에 대하여 공부했어요. 태그는 티스토리 블로그 글 안에 JS Fiddle에서 만든 자료를 첨부할 때 사용하고 있고, 태그는 전에 다닌 회사에서 인턴 프로젝트 할 때 사용해본 경험이 있습니다. 내일이면 7번째 커리큘럼도 끝납니다. 오늘은 08~09. 내장 콘텐츠 - iframe / canvas 에 대하여 공부했습니다. https://developer.mozilla.org/ko/docs/Web/HTML/Element/iframe : 인라인 프레임 요소 HTML iframe 요소는 중첩 브라우징 맥락을 나타내는 요소로, 현재 문서 안에 다른 HTML 페이지를 삽입합니다. developer.mo..
패스트캠퍼스 프론트엔드 올인원 with React 강의 수강 23일차입니다! 오늘은 멀티미디어를 삽입하는 태그에 대하여 학습했습니다. 항상 블로그 글쓰기나 웹 빌더를 통하여 오디오와 비디오, 그리고 이미지를 삽입해왔는데, HTML로 이러한 멀티미디어를 삽입하고 제어할 수 있는 방법을 배워 재미있었습니다. 🥰 오늘은 05~07. 멀티미디어 - AUDIO / VIDEO / FIGURE, FIGCAPTION 에 대하여 공부했습니다. https://developer.mozilla.org/ko/docs/Web/HTML/Element/audio HTML audio 요소는 문서에 소리 콘텐츠를 포함할 때 사용합니다. developer.mozilla.org 🔸 소리 컨텐츠 (MP3) 삽입, inline 요소 🔸 속성 ..