👩‍💻 가연의 개발자취 📚

Intro... 어제까지 해서 HTML/CSS 강의가 끝이나고, 오늘부터 새로운 강사님의 JS 강의를 들었다. JavaScript 간단 소개부터 앞으로 무얼 배울 지와 자바스크립트, ECMA 탄생 배경에 대해 학습했다. 오늘 학습한 내용 자바스크립트 학습 목표 : 유저의 Pain Point(소비자가 불편, 불안, 고통을 느끼는 지점)를 해결하기 위해 ➡️ 서비스를 만든다. 서비스를 만들기 위해 ➡️ 웹 개발을 배운다. 웹을 개발하기 위해 ➡️ JavaScript를 배운다. 브라우저와 디버깅 - console console.log: 입력한 값을 콘솔에 한줄 한줄 출력 console.dir: 주입된 값의 모든 속성을 확인할 때 console.table: 표 형식의 데이터를 테이블로 표현 자바스크립트 특징 인..

Intro... 지금까지 배운 HTML/CSS를 토대로 간단한 반응형 웹 페이지를 만들어보는 실습 강의를 들었다. 실습 따라할 땐 쉬웠는데 막상 혼자 해보려니 조금 어려웠다. 🥲 오늘 학습한 내용 : HTML/CSS 반응형 웹 실습 👩‍💻 개발 팁 / 중요 Point! a 태그 href 속성 : href 속성에는 이동하고자 하는 URL을 입력하는데 mailto, tel을 사용할 경우 브라우저가 지원하는 스킴을 사용할 수 있다. mailto: URL을 사용하는 이메일 주소 tel: URL을 사용하는 전화번호 mailto를 사용한 a 태그를 클릭헀을 경우, Mail 어플로 이동한다. (Mac 기준) tel을 사용한 a 태그를 클릭하면, FaceTime으로 연결된다. (Mac 기준) ⚠️ a 태그는 inlin..

Intro 일주일 방학 기간을 갖고 다시 공부를 시작했다. 오랜만에 강의를 들으려니 집중이 살짝 떨어졌는데 그래도 다시 열심히 해봐야지 오늘 학습한 내용 학습 주제: 반응형 웹 페이지 디자인 반응형이란? : 하나의 웹 사이트에서 PC, 태블릿, 모바일 등 접속 기기 화면 크기에 맞게 사이트가 자동으로 반응하는 기법 ✅ 적응형?? : 접속하는 기기에 따라 PC용 웹사이트, 태블릿/모바일용 웹사이트를 보여주는 기법 (PC용, 모바일용 별도로 구축하는 기법) HTML 반응형 코드 viewport meta name: viewport 사용하겠다 선언 content: viewport가 가진 content 값을 지정해서 사용 width: 브라우저에게 "페이지의 가로 너비"를 계산하는 방법을 알려줌 (device-wi..

Intro.. 오늘은 CSS에서 가장 중요한 내용을 많이 배웠다. 특히, CSS의 꽃(?)이라고 알고 있는 flex에 대해 학습했다. 헷갈리고 어렵지만 재밌는 CSS! 오늘 학습한 내용 : CSS margin, padding, border, display, float, position, flex, grid... 박스 모델 크기 지정 width, height (너비, 높이) / max-width, max-height (최대 너비, 최대 높이) 블록 레벨 요소에서만 사용 가능하다. auto 값을 사용해 브라우저가 값을 계산해서 지정하게 할 수도 있다. margin, padding (박스 외부, 내부 여백) 블록 레벨 요소에서만 사용 가능하며, 인라인 요소에선 좌/우만 적용 가능하다. margin은 음수 값이..

Intro.. 어제까지 HTML을 끝내고 오늘부터 CSS에 대한 강의를 들었다. CSS 기본적인 문법부터 많이 쓰이는 속성들에 대해 학습했다. 오늘 학습한 내용 : CSS CSS란, Cascading Style Sheets 약자이고 Cascading 뜻을 찾아보니 위에서 아래로 흐르는(상속하는)이라는 의미를 가지고 있었다. 우선 순위부터 적용되는 상속을 가진 스타일 시트라고 보면 될 것 같다. 기본 문법 선택자 { 속성1: 값1; 속성2: 값2 } 여러 속성을 지정할 수 있고 속성은 세미콜론(;)으로 구분한다. div { font-size: 16px; letter-spacing: 5px; } 내부 CSS, 외부 CSS, inline CSS 내부 CSS 태그 안에 태그를 사용해서 작성 외부 CSS 일반적으..

Intro.. 오늘은 HTML의 다양한 태그들에 대해 학습했다. 얼른 CSS도 마스터해서 예쁘게 꾸며주고 싶다. 오늘 학습한 내용 : HTML 콘텐츠 오늘은 HTML 다양한 태그들에 대해 학습하였다. 제목 태그 (h1 ~ h6) h1 태그는 제목 역할을 하기 때문에 페이지 내에 한번만 써야한다. (책 제목을 여러번 쓰진 않으니!!) 제목 태그 구획의 순서 잘 지키기 title1 title2 title3 title2 title1 title2 title3 title5 -- X h4가 나와야 함 title3 title6 -- X title4 문단 태그 : 문서에서 문단을 나타내는 태그이며 div처럼 레이아웃으로 사용하진 않는다. 서식 태그 , 단순 굵은 글씨 굵은 글씨 + 강조의 의미 , 기울임 + 텍스트가 ..

Intro. 데브코스 2일차, HTML에 대해 학습했다. 알고있던 내용이었지만 복습하는 느낌으로 꼼꼼하게! 들었다. 🤓 오늘 학습한 내용 : HTML I HTML 기본 문법 콘텐츠를 갖는 태그 Content 콘텐츠를 가지지 않는 태그 HTML 속성과 값 content HTML 구조 : HTML 문서 버전 : html 문서 시작, (lang="ko" 언어를 설정하는 속성 (ko: 한국어 문서)) : 사용자에게 보이지 않는 정보이며 문서의 필요한 정보를 작성 : 메타 데이터 (인코딩 정보, 문서 설명, 작성자 등) charset (character set): 문서의 문자 인코딩 방식 설정 (기본 UTF-8) : 페이지 제목 CSS, Script : 실제로 보이는 콘텐츠 영역 HEAD : style 태그를 써..

TIL은 "Today I Learned"의 약자로 오늘 내가 공부한 내용을 정리하는 것이다. 데브코스 교육을 들으며 매일 배운 내용을 블로그에 기록할 예정이다. Intro.. 오늘은 데브코스 첫 날이라 가볍게 코스 관련해서 OT를 들었다. OT는 앞으로 학습 방법과 출결 관련한 내용이었다. OT 중간에 좋은 개발자가 되는 자세에 대한 강연도 들었다. 좋은 개발자란.. 문제 정의와 해결을 잘 하는 개발자 (개발자 == IT 기술을 사용해서 문제를 해결하는 사람) 이해하기 쉬운 코드를 작성하는 개발자 협업과 소통을 잘하는 개발자 지속적으로 학습하는 개발자 끊임없이 개선하는 개발자 어쩌면 기본적인 내용이면서도 신경쓰지 않으면 놓치기 쉬운 부분인 것 같다. 머릿속으로 자주 되새기고 좋은 개발자가 될 수 있도록 ..