2021.3.7 일요일

최대환·2021년 3월 7일
0

TIL

목록 보기
8/55
post-thumbnail

🚩 오늘 공부량

📚 공부내용

  • 생활코딩(WEB1 - HTML & Internet)
    17강.인터넷을 여는 열쇠: 서버와 클라이언트 ~ 18강.웹호스팅: github page
  • 생활코딩(WEB2 - CSS)
    1강.수업소개 ~ 6강.css속성을 스스로 알아내기
  • 자기소개 홈페이지 틀잡기

⏱ 공부시간

  • 2시간 23분

📖 오늘 배운 내용

📄 서버와 클라이언트

🍚 웹서버와 웹클라이언트란?

  • 인터넷이 동작하기 위해서는 web browser가 설치된 컴퓨터web server가 설치된 컴퓨터 이렇게 최소 2대의 컴퓨터가 있어야 한다.
  • web browser의 정보를 요청하는 컴퓨터를 클라이언트(client)컴퓨터, 정보에 응답하는 컴퓨터를 서버(server)컴퓨터라고 부른다.
  • 대부분 우리는 웹 클라이이언트에 익숙해 있다.
  • 웹 서버를 사용하 수 있다는 뜻은 내 컴퓨터에 있는 문서나 파일을 전세계 컴퓨터에 공유할 수 있다는 뜻이다.

🍚 웹 서버를 사용하는 2가지 방법

  1. 내컴퓨터에 직접 웹서버를 깔기
  2. 웹 호스팅(web hosting)업체에 맡기기

📄 웹 호스팅: 깃허브(github)

🍚 우리가 직접 웹서버를 운영하기 어려운 이유

  • 컴퓨터가 항상 켜져있어야 한다.
  • 내 컴퓨터에 웹서버를 깔아야한다.(어려움)
  • 집 밖에서도 인터넷을 통해 웹서버에 연결할 수 있게 여러가지 조치를 해야한다.

🍚 웹 호스팅이란?

  • 웹 호스팅(hosting)이란 웹서버 컴퓨터의 전체 또는 일정 공간을 이용할 수 있도록 임대해 주는 서비스를 말한다.
  • 대표적인 웹호스팅 업체로 깃허브가 있다.
  • 이러한 웹 호스팅 업체를 이용하여 우리는 웹서버를 운영할 수 있다.

📄 css의 등장과 사용하기

🍚 css의 등장배경

  • 원래 HTML만 만들어져 있었는데 조금 더 텍스트를 자유롭게 꾸미고 싶다는 열망이 개발자들 사이에서 생겨났다.
  • 이에 간단하게 font라는 태그를 만들어 일일이꾸몄지만 한계를 느끼고 css언어를 만들기 시작했다.
<p><font color="red">hello</font></p>

🍚 css를 사용하는 2가지 방법

  1. HTML 바로 옆에 HTML문법을 이용해 속성과 속성값을 사용한다.(선택자 사용x)
<a href="~~" style="color: red;">링크</a>

👉링크

  1. HTML에서 head태그의 자식으로 style태그를 이용해 컴퓨터에게CSS문법으로 해석하라고 명령하여 사용한다.(선택자 사용)
<style>
    a {
    color: red;
    }
</style>

🍚 css 기초문법

a {
    color: red;
}
  • 여기서 a를 선택자(selector), color: red;는 효과라고도 부르고 선언(declaration)이라고도 불린다.
  • color은 property, red는 value 라고 불린다.
  • 이를 통해 쓰고싶은 css 속성을 google에 검색해서 보고 쓰면된다.

    예시)

    • css가운데 정렬이 궁금할 때: css text center property
    • css텍스트 크기 조절이 궁금할때: css text size property

🤷‍♂️ 느낀점

  • 개념을 강의로 공부할 때에는 막연히 '열심히 공부한다' 이런 생각밖에 없었는데, 내 홈페이지를 만들면서 HTML,CSS 개념을 직접 적용하면서 공부하다보니 꽤나 흥미로었을 뿐만아니라, 위코드 과제인 '자기 소개 페이지'를 더 완벽하게 만들고 싶다는 욕심이 생겼다.
profile
나의 개발지식 output 공간

0개의 댓글