안녕하세요. @u robotics 입니다.
오늘은 웹개발을 시작해볼려고 합니다.
생각해보니깐, 너무 기초라고 해서
전혀 모르고 넘어간 것 같아요.
그래서 뭔가 문제가 생기면
와르르 무너지는 게 아닌가 생각해요.
그래서 웹의 프론트개발에서
(프론트 : 고객이 실제로 쓰는 웹 화면)
제일 기본인 HTML. CSS, Javascript를
차례로 정복하려고 합니다.
오늘은 그 첫 번째 공략목표인
가장 만만한 HTML을 시작해볼게요.
html은 그냥 일반 편집기로 작성을 할 수 있습니다.
윈도우를 사용하시는 분의 경우에도
바탕화면에서 마우스 오른쪽 클릭하면,
파일 만들기가 나옵니다.
![텍스트 문서 만들기.jpg]
(
거기서 텍스트 파일(.txt)로 프로그래밍을 하시고요.
.html로 파일명을 바꿔주시면,
웹페이지가 완성이 됩니다.
자 그러면 본격적으로 시작해봅시다.
첫번째 예제입니다.
일단 텍스트 파일을 만들어서
이 내용을 타이핑 하신 다음,
파일 이름을 1.html 등. html 파일로 만들어 줍니다.
그리고 html 파일을 더블클릭 해보세요.
브라우저(크롬, 인터넷 익스플로러 등)가 열리면서
프로그래밍된 웹 페이지가 나옵니다.
제 소스를 여러분의 소스랑 비교해보세요.
맞습니다.
그 달라진 부분을 바꿔보시면
여러분이 원하는 부분에
원하는 내용을 출력할 수 있습니다. ㅎㅎㅎ
여기까지 따라하셨다면
아무래도 예상되는 문제는 2가지 인데요.
1번째는 text 에서 html로 파일을 변환한 이후에
재수정이 불가능하다는 것이죠.
html파일에서 마우스 오른쪽 클릭을 한 다음에
연결프로그램 > 메모장. 을 선택해주시면 됩니다.
그러면 다시 텍스트 파일로 열려서 수정을 할 수 있게 됩니다.
저장하실 때 txt 파일로 저장하시면,
수정 가능한데 클릭해도 웹페이지가 안 열리구요.
html로 저장하시면, 더블클릭하면 웹 페이지가 열리고, 수정은 안 됩니다.
2번째 문제는 한글이 깨지는 문제가 일어날 수 있어요.
원래 영어를 기본으로 지원하기 때문인데요.
한글을 지원하라고 써주면 더 쉽게 알아먹습니다.
이 코드를 html 바로 밑에
그러니깐 3번째 줄에 추가해주시면
에러가 잡히고
한글이 잘 출력됩니다.
그리고
소스를 간단히 설명해드리겠습니다.
첫날에는 조금만 하고
조금씩 조금씩 더 늘려나가겠습니다.
여러분도 웹페이지 한 번 만들어보세요.
재밌습니다.
감사합니다.
p.s. 좀더 해보실 분들은
이 사이트를 가보세요.
https://www.w3schools.com/html/default.asp