코딩 배움 1주차
나는 코린이다ㅋㅋㅋ
그래서 스파르타 코딩 클럽에서 코딩 왕초보 탈출반을 듣고 있다.
항상 티스토리 할때 HTML에서 수정하라고 하는 게 많았는데 이제 나도 조금은 안다.
HTML이 무엇인가?
-HyperText Markup Language의 약자이다. 하이퍼본문표식달기언어.
-웹의 뼈대를 만들어 주는 기능을 한다.
예를 들어 검색창이 있으면 '네모 안에 돋보기 그림이 있다.'
'뉴스 카테고리 옆에 경제 아이콘이 있다.' 이런 식으로 큼직큼직하게 뼈대를 만들 수 있다.
-문서 형태를 기반으로 한다. 그래서 HTML 파일 열면 <head>, <body>, </p>, <h1>.. 이런 것들이 보일 것이다.
이것들이 무엇인지는 아래에 적겠다.
CSS는?
-Cascading Style Sheets의 약자이다. 종속형 시트 또는 캐스케이딩 스타일 시트라고 부른다.
-세부 사항을 꾸며주는 역할을 한다.
예를 들어 글꼴이나 색깔 변경 등을 할 수 있다.
JS는?
-javascript이다.
-웹에서 구성요소가 움직이게끔 만들어 주는 것.
HTML의 구성 요소
일단 <> 이렇게 돼있는 것을 '태그'라고 읽는다.
예를 들어 <head>라고 적혀있으면 '헤드 태그'인 것이다.
-<head> : 헤드 태그라고 읽는다. 이 태그는 바탕이 되는 흰 부분 빼고 나머지 보이는 부분이 head 부분이다.
예를 들어서 어떤 사이트를 카카오톡으로 공유했을 때 공유한 링크가 바로 보이는 부분이 헤드 부분이다.
-<body> : 바디 태그이다. 이건 우리가 웹사이트를 볼 때 바로 보이는 흰 바탕 부분이 body 부분이다.
-<div> : 디브 태그이다. 어떤 것을 묶어서 한 번에 옮길 때 많이 쓴다.
-</p> : 문단을 나타내는 태그이다. p는 paragraph의 약자이다.
-<h1> : 헤드 1 태그. 큰 제목 (페이지마다 하나씩 있는 것이 좋다.)
-<h2> : 작은 제목
-<span> : span 태그. 특정 글자를 꾸밀 때 쓴다.
-<a href="사이트 주소"> 하이퍼링크 </a> :하이퍼링크 연결하는 코드
-<img> : 이미지 태그. 사진, 그림 넣는 태그
-<button> : 버튼 태그. 버튼 모양 생성
-<textarea> : 텍스트 입력창 생성
-<hr> : 가로선
* ▶ :토글이라고 한다.
이걸 열고 닫는 단축키는 windows에서 ctrl+alt+t이다.
* pycharm은 무엇인가?
코딩 메모 툴이다. 파이썬을 쓰기에 가장 편한 툴이다.
pycharm에 코딩 입력하고 저장할 때는 ctrl+s
입력한 거 어떻게 나타나는지 보고 싶을 때는 옆에 구글 아이콘 클릭해서 볼 수 있음.
코드 고치고 나서 새로 보고싶을때는 열린 웹페이지에서 새로고침 해주면 된다.
일단 오늘은 여기까지 배웠다.
외계어 같았던 코딩 용어를 알고 나니 그나마 위화감이 덜해졌다.
이걸 배우면서 깔았던 새로운 프로그램도 신기했다.
pycharm, slack
이 수업을 듣지 않았더라면 이런 게 있는지도 몰랐을 것 같다.
웹페이지를 어떻게 만드는지 배우려던 참에 8차시 밖에 못 듣는.. 것 때문에 내일 들어야 한다.
아쉽다ㅋㅋ
오늘 내가 배웠던 신기한 포인트
웹사이트 안에 있는 카테고리 이름 바꾸기↓
'4차 산업혁명에 대한 지식 > 코딩' 카테고리의 다른 글
open api 예쁘게 보는 방법(JSONView) (0) | 2021.07.18 |
---|---|
티스토리 블로그 글씨체 변경하는 방법 (5) | 2021.06.29 |
개발일지 HTML로 로그인 페이지 만들기, 폰트 바꾸기 (0) | 2021.06.29 |