"게임 개발자"를 향한 매일의 공부일지 _ 1기

목록 만들기에 이어 표 만들기 학습을 시작해 본다. 조금 전에 학습했던 ol 태그부터는 수업 내용을 정리하지 않았다. 우선은 책 위주로 학습해 볼 것이다.분량이 꽤 많은데 중요한 내용이니 빠짐없이 정리해야겠다. 그럼 바로 시작해본다.  표 만들기웹 문서에서 자료를 정리할 때 자주 쓰는 태그는 표이다. 표의 구성 요소 알아보기표(table)는 행(row)과 열(column) 그리고 셀로 이루어진다. 셀은 행과 열이 만나 이루어진 곳으로 표의 내용이 들어가는 한 칸을 의미한다.   표를 만드는 table, caption 태그표의 시작과 끝을 알려주는 table 태그를 표시하고, 표에 제목을 붙이고 싶으면 caption 태그를 넣는다. 이 태그를 사용하면 제목은 표의 위쪽 중앙에 표시된다.  행을 만드는 tr..

이번에는 목록을 만드는 태그에 대해 학습해보려고 한다. 표 태그는 분량이 많아 다음 포스트에서 다루어야 할 것 같다. 목록을 만드는 것까지는 별로 어렵지 않게 진행할 수 있었다. 표를 만드는 건 많이 어려웠다.그럼 바로 시작해 보자!  목록 만들기웹 문서에서 목록은 단순히 어떤 항목을 나열할 때만 사용하지 않는다. CSS와 함께 사용해서 내비게이션을 만들거나 콘텐츠를 배치하는 등 다양한 용도로 쓰이게 된다. 순서 있는 목록을 만드는 ol, li 태그목록을 표시할 내용 앞뒤에 각각 ol을 두고 그 사이에 li를 삽입하는 형태이다.    ol 태그의 type, start 속성목록은 기본적으로 숫자 1, 2, 3, ...으로 번호를 붙인다. 이때 type 속성을 사용하면 영문자나 로마 숫자 등으로 순서를 나타..

이제 둘째 마당의 첫 번째 장이 끝나고 두 번째 장으로 들어갔다. 앞장에서는 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 언어가 갖고 있는 특징을 ..