본문 바로가기

developer/Udemy - 100일 코딩 챌린지

[Udemy - 100일 코딩 챌린지] 2주차 (5주차 같은)

블로그로도 정리를 해야 나한테 남는다. 라고 먼저 개발하신 분들이 유튜브에서 다들 같은 얘기를 하시더라.

그래서 고민이 많아지고 얼마나 잘 써야 하나 고민하다가 블로그를 선뜻 다시 쓰기도 힘들어졌다.

그러다 주 1회 글쓰기의 날을 제안해준 든든한 내편인 아내덕에 다시 시도해본다.. 지치지 않게 가볍게 써보자! (막상 쓰다보니 역시 욕심 나서 결코 가벼울 수 없었다.../완벽주의를 버리자 내다버리자 분리수거 하자 일단 쓰자!)

10배의 법칙을 블로그 개발일지 작성에 적용해본다.

 

4주동안 1.5배속으로 틈틈히 들어서 206강까지 들었다 ㅋㅋㅋ

어차피 반복할 생각으로 개발공부에 달려들었으니까 일딴 오답노트 위주로 빠르게 간다

 

1. img element 의 attribute 중 src 오타나면 이미지 자체를 못 불러온다. scr 아니고 src 다.

<img src="images/challenges-trophy.jpeg" /> vs <img scr="images/challenges-trophy.jpeg" />
 
 vscode에 오타 입력해도 왜 색깔 바뀌는 건데.. 흑 한참 찾았던 기억이 난다.
 
 

2. 스니펫(snippet)은 재사용 가능한 소스 코드, 기계어, 텍스트의 작은 부분을 일컫는 프로그래밍 용어이다 / 출처: 위키피디아

3. div vs span 

span은 inline element(요소 display에 필요한 특정 영역만 차지함) 이고 div는 block element(기본적으로 할당된 화면 row 전체를 차지함, ) 이다. span과 div의 차이에 집중해서 실습해보자.
용도는 거의 비슷함. 따로 표시되는 건 아니지만, element끼리 묶어서 꾸미기 쉽게 해준다.
근데 display로 결국 inline과 block을 설정해줄 수 있는데 굳이 나눠놓은 건... 왜왜왜 굳이 ㅋㅋㅋ 이건 좀 더 공부를 해야 할 듯
 

4. skeleton

뭔소린지 몰랐다. 골격이 왜 필요해 처음에 그랬었는데 막상 200강 가까이 듣다보니
<head> <body> 이외에 개별요소들을 큼직큼직하게 구분하기 위해 필요하다. 웹페이지에 표시할 때 큰 가닥을 잡기 위해 필요하달까
<header> <main> <footer> 등이 있다.
기본적으로 다 <div>의 속성(block element)을 가지고 있지만, 의미가 부여된(semantic) element임.
 
여기까지 쓰고 아내 맥북에서 github에 업로드한 작업내역 내려받기는 했는데 push가 안 된다. 
해결하고 다시 왔지만.. 지쳤다..
 
간단하게 다시 용기내서 써본다.
 

<ul> vs <ol>

unordered 냐 ordered 냐 차이. 글머리가 문자냐 숫자냐 차이.
css에서 list-style: none; 해버리면 의미 없지 않냐고!
 

padding-inline-start  vs padding-left, padding-top

Formal syntax

padding-inline-start = 
  <'padding-top'>  
 
라고 mdn(링크 넣고 싶은데 ㅋㅋㅋㅋ) 에 나와있는데, writing-mode가 vertical-tb, horizontal-rl에 따라 =padding-top인지 =padding-left인지 달라야 하는 것 같다. tb(top bottom), rl(right left)
 
추가로 써도 한단락 ㅋㅋㅋㅋㅋ 수고했다 내자신아 잘했어 토닥토닥
 
206강은 너무 많았다. 그날 그날 커밋도 하고 블로그도 쓰자.. 흑흑
 
시작은 창대했으나, 끝은 미약하구나 ㅋㅋㅋ 에라이 ㅋㅋㅋㅋㅋ