클라이언트/ 서버/ 엔지니어 "게임 개발자"를 향한 매일의 공부일지

이제 둘째 마당의 첫 번째 장이 끝나고 두 번째 장으로 들어갔다. 앞장에서는 HTML의 기본 구조가 어떻게 첫 페이지를 구성하는지에 대한 기초 학습을 진행했다면, 이번 장에서부터는 본격적으로 웹 페이지를 만들게 된다.웹 문서를 작성할 때 가장 많이 사용하는 형식은 텍스트, 이미지, 표이다. 먼저 텍스트를 입력할 때 기본이 되는 제목과 본문, 단락, 줄 바꿈 등의 태그를 학습해 볼 것이다.  텍스트 입력하기 제목을 나타내는 hn 태그 웹 문서에서 제목은 다른 텍스트보다 크고 진하게 표시한다. 이렇게 자주 사용하는 제목 스타일을 미리 태그 형식으로 만든 것이 제목 태그이다.제목 n의 자리에는 1~6의 숫자가 들어가며 제목 텍스트를 크기별로 표시할 수 있다.    텍스트 단락을 만드는 p 태그, 줄을 바꾸는 ..

오늘도 9시가 넘어서 저녁 공부를 시작해 본다. 내 목표는 8시 반쯤 시작하는 건데 저녁 먹고 정리하다 보면 어느새 9시가 넘어간다. 오늘은 자기 전까지 HTML 기본 문서 만들기 장은 끝내고 취침할 생각이다. 요즘 잠이 많이 부족한 것 같아 이제부터는 하루 6시간 정도 충분한 수면을 취할 생각이다. 5시간보다 더 적게 자면 언제나 하루종일 피곤하고 정신이 몽롱한 것 같았다. 그럼 오늘의 저녁 공부를 시작해보자! 조금 전 일기를 쓰며 마음을 많이 회복했고 다시 학습을 진행할 수 있는 상태가 되었다. 공부할 때 가장 중요한 점은 진도를 많이 나가는 것보다 내 마음을 살피는 일이다. 마음이 흐트러지면 아무리 시간을 들인 들 효과가 없기 때문이다.웹 개발은 항상 HTML부터 시작한다. 인사교 수업이나 엘리스와..

이제 새벽 공부할 시간이 1시간도 남지 않았지만, 남은 시간 웹 개발 환경에 대해서 학습해보려고 한다.분량이 조금 많은데 다 할 수 있을지 의문이다. 그래도 하는 데까지 최선을 다해보자!웹 개발은 웹 편집기로 소스를 작성하고 웹 브라우저에서 결과를 확인하며 진행한다. 보통 비주얼 스튜디오 코드를 많이 사용하는 것 같다. 아직 내 PC에는 설치가 되어 있지 않아, 설치 작업도 해주어야 할 것이다.    웹 브라우저와 웹 편집기 웹 브라우저웹 브라우저는 웹 사이트를 방문할 때 사용하거나 웹 개발자가 웹 편집기로 작성한 문서를 화면에 나타내는 프로그램을 말한다. 종류가 매우 다양하지만 우리가 흔히 알고 있는 웹 브라우저는 다음과 같다.  대부분 요즘은 크롬을 많이 사용하고 나도 크롬 이용자이니 이 브라우저로 ..

HTML의 기본에 대해서 동영상 학습을 했으니 이제는 책으로 한번 내용을 깊이 있게 다루어보기로 했다. 책에 밑줄도 긋고 연습문제도 풀어보면서 공부하면 더 재미있게 학습할 수 있을 것 같다.먼저 1장 웹 개발 시작하기 단원의 내용을 정리해본다. 조금 전에 밑줄을 그으며 한 번씩 읽어보았다.그러면서 앞으로 백엔드 개발자가 되기 위해 어떤 공부를 해야하는지도 알게 된 것 같다.웹 개발은 생각보다 광범위하고 공부해야 할 것도 아주 많은 분야이다. 이 단원에서는 웹 개발이 무엇인지 정의하고 그 안에 어떤 분야가 있는지 학습해 볼 것이다.    웹 개발 알아보기 웹 개발이란? 웹 개발이라면 가장 먼저 '웹 사이트를 만드는 것'을 생각한다. 사이트는 크게 2가지로 나눌 수 있다.정적 사이트 : 방문자에게 정보를 보..

이어서 바로 HTML/CSS 중에서 HTML 마지막 단원 학습을 시작해 본다. 여기까지 해서 6시까지 다 마친 후에 2시간 20분 정도는 책으로 학습을 진행할 예정이다.중복되는 내용은 빼고 중요한 내용들을 정리해볼 수 있을 것 같다. 바로 네번째 학습을 진행해 본다. 어제 저녁에 처음 해볼 때는 실습하는 것도 정말 어려웠는데, 지금은 어느 정도 손에 익어 재미있어졌다.   이론 4 - HTML 태그의 두 가지 성격   p 태그를 연달아 쓸 때 y축 방향으로 정렬이 되는 것을 말한다. 공간을 만들 때 사용하는 모든 태그들은 block 요소이다. 이 블럭 요소는 width, height를 설정할 수 있다.   자신이 사용하는 태그가 block 요소인지, inline 요소인지 파악해야 원활한 작업을 할 수 있..

이제 본격적으로 오늘의 새벽 공부를 시작해 본다. 조금 전에 어제 하다만 실습을 진행하며 잠도 깼고, 이제 맑은 정신으로 다음 학습을 이어가 본다.두 단원만 학습하면 HTML 이론 학습은 끝이 난다. 그다음에는 HTML 책과 수업 내용까지 정리해 보는 시간을 갖고자 한다.지난번에 딱 하루치 분량의 수업만을 정리했는데, 추가로 메모할 부분이 있으니 수업을 다시 들으며 기록해 봐야지!그럼, 바로 두 번째 단원 학습을 시작해 보자~  이론 3 - 구조를 잡을 때 사용하는 태그   목차는 내비게이션이고, 본문은 웹사이트의 내용이 담길 부분이며, 부록은 회사의 정보 등이 기입된 부분으로 나눌 수 있다.    header 태그와 nav 태그는 함께 사용하는 편이다. nav에는 내비게이션과 관련된 정보를 넣는다. n..

일단 시작을 하면 뭐든 하게 된다. 그럼, 두 번째 단원 학습을 시작해 보자!    이론 2 - HTML 기본 태그 눈에 보이는 정보란 텍스트나 이미지이다. 담겨 있는 정보의 특징을 파악해서 그 정보의 특징별로 구역을 설정하는 작업도 HTML 언어에서 담당한다.     HTML에서 지원하지 않는 언어들은 지원하지 않겠다는 의미이다. 5가 표시되어 있는 부분은 HTML 5에서 새롭게 등장한 신조어다.    어떤 정보를 넣을 때 고유의 태그를 입력해야 한다. 속성에는 자신이 만든 이름이나 별명을 붙일 수 있다. 디자인적인 작업을 속성으로 활용할 수 있다.   HTML 문서는 .html의 확장자를 갖고 있는 파일 안에서 입력해야 한다. 태그는 원래 열린 태그와 닫힌 태그로 구성되어 있지만, 일부 태그는 열린 ..

오늘부터 자바 스크립트 수업을 나갔는데 속도도 빠르고 정말 따라가기 힘든 수업이었다. 오늘 새벽까지 난 엘리스에서 들어야 하는 기초 및 심화 필수 과목들을 듣느라 인사교에서 현재 배우는 과목들을 따로 공부하거나 복습할 시간이 없었다.근데 이제부터는 수업을 잘 따라갈 수 있게 HTML/CSS 공부도 하고 자바 스크립트도 공부해 보기로 했다. 주말까지 해서 엘리스로 HTML/CSS와 자바 스크립트 기초 수업을 80% 이상 완료하고, 자바 응용 수업도 처음부터 다시 들어볼 생각이다.진도가 엄청나게 빠르지만 기초도 부족해서 전 수업부터 차근차근 듣는 것이 좋을 것 같다.그럼 우선, HTML의 첫 수업을 시작해보기로 하자!    수업 소개 - HTML/CSS 커리큘럼 1장에서는 HTML 언어가 갖고 있는 특징을 ..

3교시 수업에서는 HTML 태그를 하나하나 익히면서 웹 페이지를 만들어보았다. 그리고 거의 끝 무렵에 위키백과사전을 보고 웹페이지를 만들어보는 실습도 진행했다.   HTML 태그 알아보기 문단과 문장 태그 p태그와 span 태그를 사용해서 문장과 문단을 작성할 수 있다. 문장 안에 효과를 줄 때는 그 안에 작성하면 된다.    줄 바꿈 및 개행, bold체 줄 바꿈을 할 때는 br를 쓴다. 이건 내가 블로그를 쓸 때도 자주 사용하는 기능이다. 사실 이 태그는 별로 낯설지가 않은데, 얼마 전에 벨로그가 마크업으로 되어 있어 태그를 작성하면 효과를 줄 수 있다는 걸 알게 되었다.처음에는 줄 바꿈이 없이 바로 쓰려니까 문단 사이가 나누어지지 않아 무척 불편했고 칸을 띄우는 싶은데 아무리 많은 칸을 띄워도 한 ..

1교시 수업에 이어 2교시에서는 HTML에 대한 설명과 실제로 만들어보는 실습이 이어졌다.     1. HTML이란 무엇인가?HTML을 한 번 더 정리해 본다.      HTML은 하이퍼텍스트를 제공하는데 이는 글자를 참조한 곳으로 이동하는 것이다.      우리가 책을 읽을 때는 앞에서부터 차근차근 읽게 된다. 하지만 하이퍼텍스트는 링크를 타고 참조한 곳으로 이동한다. 이때 태그를 사용한다.즉, HTML은 태그를 이용해 표시해 주는 언어이다. 표시가 없다면 이처럼 보이 어렵다.    표시가 없을 때와 있을 때의 차이   어디로 오라는 것인지 알 수가 없다. 표시를 해주는 것이 태그이다.   HTML은 꺽쇠로 구분하고, 시작 태그와 끝 태그로 나뉜다. 이 사이에 들어가는 것을 Content 내용이라고 한..