개발 웹 서버란 무엇일까요?
"로컬 개발 웹 서버"다. 왜냐하면 우리 컴퓨터에서 웹사이트를 로컬로 제공하는 웹 서버 소프트웨어이기 때문이다. 이건 우리의 머신이나 웹사이트를 인터넷에 노출시키는 것이 아니다. 여러분은 오직 로컬(즉, 여러분의 기기에서)을 방문하고 접근할 수 있습니다. 이 "웹 서버 소프트웨어"(이 경우 "Live Server" 확장)는 실제로 들어오는 HTTP 요청을 수신하고 적절한 응답(예시: HTML 코드 포함)을 다시 보내는 소프트웨어다.
이 주소는 무엇일까요: 127.0.0.1?
위에서 언급했듯이 이 개발 웹 서버는 로컬 머신에서 로컬 머신으로 웹사이트를 호스트(= 제공)한다.
앞의 섹션에서 사용자가 브라우저 주소 표시줄에 주소(URL)를 입력해서 웹사이트에 접속하고 이러한 요청을 보내는 것을 배웠다. 또한 사람이 읽을 수 있는 "도메인"(예: google.com)이 인터넷에 연결된 시스템의 고유 식별자 역할을 하는 IP 주소로 변환된다는 것도 배웠습니다.
127.0.0.1.은 그런 특별한 IP이다. 이것은 로컬 컴퓨터에 예약된 IP며 모두를 위한 로컬 머신이다. 이것을 브라우저에 입력하면 각자의 머신에 도달하게 된다. 다른 컴퓨터에 할당되지 않은 IP 주소며 이를 통해 노출하지 않고 로컬에서 테스트 할 수 있다. 127.0.0.1: localhost 대신 로컬에서 사용할 수 있는 별칭(기본적으로 "특수 도메인 이름"과 유사합니다)도 있다. 브라우저에 localhost를 입력할 수도 있고 127.0.0.1을 입력한 것과 동일하다. 따라서 localhost:5500은 127.0.0.1을 대체한다.
그러면 :5500 이것은 무엇일까
소위 "포트"라고 한다. 포트는 네트워킹 세계의 또 다른 개념이다. 다른 포트를 통해 다른 프로세스를 노출할 수 있다.
로컬 시스템의 IP 주소는 항상 동일하지만(127.0.0.1) 모든 웹사이트에는 자체 포트가 있다(예: 5500, 3000, 8080).
OL ( = order list )
특성 순서로 이뤄진 항목이 있는 목록이다. 예를 들어 요일을 연이어 입력할 경우 순서 목록으로 표현하는 것이 좋다. 또한 이 경우에는 숫자로 정렬되게 된다.
<ol>
<li>Monday</li>
<li>Tuesday</li>
<li>Wednesday</li>
</ol>UL ( = unorder list )
비순서 목록의 경우 순서가 그다지 중요하지 않지만 서로 관련된 정보가 포함되어있다. 예를 들면 포도, 바나나, 사과 등 목록으로 묶어두는게 중요한 경우 표현하는 것이 좋다. 또한 이 경우에는 dot으로 정렬되게 된다.
<ul>
<li>Apples</li>
<li>Bananas</li>
<li>Tomatoes</li>
</ul>HTML / CSS 규칙
상속 ( Inheritance )
특정 컨테이너 규칙이 하위 항목에 적용된다. 부모 요소의 특정 규칙이 자식 요소의 규칙에도 영향을 준다.
계단식 스타일 시트 ( Cascading Style Sheets )
하나의 요소에 여러 규칙을 적용할 수 있다. 하지만 CSS 문서 중 아래의 요소가 적용이 우세하게 작용한다. 시작점이 요소의 적용에 영향을 미친다.
우선순위 ( Specificity )
더욱 구체적인 선택자의 규칙이 덜 구체적인 선택자의 요소보다 우선시 적용된다. 위의 계단식 스타일 시트의 규칙을 생각해보자.
li {
color: rgb(251, 100, 0);
}
ol {
color: rgb(251, 255, 0);
list-style: none;
}
이런 경우에는 계단식 스타일 시트로 ol의 요소의 rgb 값이 적용될 것 같지만 우선순위로 인해 rgb (251, 100, 0)이 실제로 리스트에는 적용되는 것을 알 수 있다.
