안녕하세요. Graham 입니다.
html 코딩에 대해 강좌를 시작할건데요.
사내 웹디자이너들에게 코딩 가르치면서 만든 강의 자료를 오늘부터 함께 보시도록 무료로 배포할 생각입니다.
코딩에 코자도 모르던 직원에게 가르친거라 정말 쉽습니다.
그리고 제 스타일답게 실전스러울거구요. 잘 따라와주세요.
코딩은 누구나 할 수 있다?
사실 코딩은 뭔가가 있어야만 코딩할 수 있는게 아니라 누구든지 어느 특정 장비가 있어야만 코딩을 할수 있는게 아닙니다.
물론 일부는 반드시 맥북이 있어야만 가능한 것도 있겠지만 반드시는 아닙니다.
특수한 경우는 있겠지만 항상 그런 것은 아니예요.
컴퓨터만 있다면 당신은 코딩을 하실 수 있습니다.
메모장으로도 코딩이 가능하다?
많은 분들이 잘못 알고 계신 내용 중 하나가 바로 코딩을 하려면 반드시 어떤 특정 프로그램을 설치해야만 되는 줄 아십니다.
하지만 메모장으로도 코딩이 가능합니다.
다만 손이 좀 더 힘들뿐이죠.
아래 소스를 드래그해서 메모장에 붙여넣어 보세요.
<html>
<head>
<title>Hello World</title>
</head>
<body>
Hello World
</body>
</html>
메모장에 붙이셨나요?
편한 확인을 위해 바탕화면에 그대로 저장하겠습니다.
test.html 로 저장해주세요.
이 파일을 여러분의 익스플로러나 크롬 브라우져에 새 창을 열어 드래그 해보세요.
Hello World
가 보이시나요?
여러분들은 방금 메모장으로 웹코딩을 하셨습니다.
그리고 성공하신거구요.
손이 너무 힘든데? 도움 프로그램 설치방법
메모장으로 코딩이 되는건 확인했는데, 일일이 받아적으려면 코딩이 너무 어렵다고 생각되실거예요.
그래서 코딩하는 전문가들은 다른 프로그램을 설치해서 도움을 받는겁니다.
VS code 다운받기
https://code.visualstudio.com
그냥 next만 누르시면 됩니다. 어렵지 않죠?
다시 코딩 분석을 해볼까요?
아까의 소스를 다시 봐봅시다.
<html>
<head>
<title>Hello World</title>
</head>
<body>
Hello World
</body>
</html>
특징이 보이네요. 그쵸?
코드는 2번씩 쓰이네요?
<html>
***
</html>
html 도 이렇게 쓰여있고
<head>
***
</head>
head 역시 그러하네요.
<body>
***
</body>
body도
이렇게 2번 써짐으로써 감싼 것 같은 느낌을 주네요.
완전 까막눈이었을때보다 뭔가 규칙이 있는걸 눈치 채셨을거예요.
코딩은 그냥 컴퓨터의 언어일뿐
외국말 하려면 그 나라 언어를 배워야 하잖아요.
미국 말하려면 영어를 알아야 하고...
코딩도 똑같습니다. 컴퓨터가 이해할 수 있는 언어(외국어)를 배우시기만 하면 되요.
조금 감이 잡히시나요?
다음 강의에서 뵙겠습니다.
2019/07/08 - [프로그램 강좌] - [html02]html = head + body
2019/07/11 - [프로그램 강좌] - [html03]CSS가 뭔데? 텍스트 꾸며보기
2019/07/24 - [프로그램 강좌] - [html04]이미지로 코딩하기!
2019/07/25 - [프로그램 강좌] - [html05]이미지로 코딩하기2
2019/07/26 - [프로그램 강좌] - [html06]이미지로 코딩하기3 (문법설명이니 스킵해도 됨)
'프로그램 강좌' 카테고리의 다른 글
| [html03]CSS가 뭔데? 텍스트 꾸며보기 (0) | 2019.07.11 |
|---|---|
| [html02]html = head + body (0) | 2019.07.08 |
| [ES6]Arrow function (화살표 함수) (0) | 2019.04.17 |
| 마크다운 문법 정리2 (0) | 2019.04.13 |
| 마크다운 문법 정리1 (0) | 2019.04.11 |
