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

점심을 먹고 눈 찜질도 하고 쉬었다가 이제 4시가 다 되어 오후 공부를 시작해본다. 오후에도 3시간 정도 열심히 공부할 생각이다. 2시간만에 3주차 학습을 마치고 자바스크립트 마지막 날 두 교시 분량의 수업도 절반 이상 마치는 것이 이번 오후 공부의 목표이다.     이론 4 - async/ await      원래는 .then(), .catch()를 사용하는데 await 키워드를 사용하면 then에서 data를 받을 수 있다.       fatchData2를 호출하는 경우에 fatchData3를 바로 실행하지 않고 fatchData2가 promise로 리턴된다. promise가 성공 혹은 실패가 될 때까지 제어를 멈추게 된다. 따라서 비동기 코드의 순서를 부여하는 것은 promise와 같다.      ..

어제 새벽에 7시 반까지 6시간 정도 새벽에 공부하다가 과목이 너무나도 어렵고 무슨 말인지 하나도 모르겠기에 일기를 쓰다가 아침부터는 쉬는 시간으로 보냈다. 집에 너무 추워서 감기 기운도 있는데다 계속된 장시간 컴퓨터 작업으로 인해 안구 건조증이 생긴 것 같았다.눈이 너무 시리고 아파서 눈을 뜨기도 힘들었다. 계속해서 눈물과 콧물이 나와서 심신이 지치고 정말 쉬어주어야겠다는 생각이 들었다. 아침에 1시간 정도 낮잠을 잔 후 다른 업무를 하며 시간을 보내다가 오후에 집에 와서도 여전히 공부할 상태는 아니었다. 오후에도 엄마와 볼일이 있어서 외출을 하고 그리고 다시 광주 집으로 향했다. 차가 많이 밀려서 집에 오니 밤 8시가 다 되었지만 그래도 감사했다. 어제는 저녁식사 후에 눈 찜질을 하고 평소처럼 9시쯤..

2주차 수업이 시작되었다. 심화 과정이 정말 어렵지만 그래도 공부를 계속해보기로 했다. 1시간만 더 공부하고 새벽 공부는 여기서 마치려고 한다.      이론 1 - 자바스크립트 변수 정의 과정       실행하기 위해서는 기계가 코드를 읽을 수 있어야 한다. 컴퓨터가 읽고 실행할 수 있어야 하는데 이것은 CPU 같은 기계 장치가 읽고 실행을 할 수 있다는 뜻이다. CPU에는 instruction 즉 기계가 알아들을 수 있는 몇 종류의 명령이 있다. 자바스크립트 코드가 어떠한 과정을 거쳐 CPU의 insturction으로 변환되는 과정이 필요하다.이 작업을 자바스트립트 엔진 즉 컴파일러가 해준다. 자바스크립트 코드는 엔진을 통해 파싱되고 실행된다. 파싱은 AST라는 나무 형태의 객체 코드로 변환되는데, ..

아침부터 다른 일정이 있어서 외출을 하고 오후 3시 반이 넘어서 다시 공부를 시작해 본다. 저녁에도 약속이 있어서 오늘은 공부를 거의 못하는 날이지만 그래도 하는 데까지 해볼 것이다. 제이쿼리 이 공부는 적어도 마치고 오늘 저녁 늦게라도 자바스크립트 심화 과정을 시작해 볼 생각이다.     실습 3 - 탭 버튼 기능 구현하기     특정 버튼의 속성값을 가져올 때 사용하는 메서드가 attr이다. 이번에는 탭 버튼을 눌렀을 때 내용이 바뀌도록 코드를 작성해보겠다.      문제 풀기 1. html 파일 살펴보기     이 코드가 탭 버튼을 구현할 부분인데 첫 번째에만 active가 클래스로 들어가 있다. 이 부분이 css에서 어디에 해당하는지 살펴볼 것이다.     2. css 파일 살펴보기  displa..

오늘은 공부를 별로 많이는 하지 않고 아침에 제이쿼리 수업 다 듣고 정리한 후 오후에는 수학 공부와 엘리스로 6주차 수업만 들을 생각이다. 그리고 시간이 남으면 지난번에 들었던 강의를 정리해볼 생각이다.그럼 제이쿼리 실습을 본격적으로 시작해보겠다.    임포트 실습하기 1. 파일을 불러오는 첫 번째 방식 : 내 파일로 로드 ..은 상위 폴더로 가는 것이다. 기능을 불러오기만 하는 것은 head 태그에 작성한다.   2. 파일을 불러오는 두 번째 방법 : CDN 네트워크제이쿼리 다운로드 파일에 들어가 링크를 복사하여 url을 붙여넣는다. 그러면 위의 코드와 같은 방식으로 동작한다.  내부 방식은 장점이 많아보이지만, 서버에 업로드할 때 불편하고 업데이트될 때 대응이 잘 안되는 점이 있다 . 네트워크 방식은..

웹 문서에서 사용한 여러 이미지 가운데 하나만 골라서 크기를 바꾸려면 콕 집어 지정할 수 있어야 한다. 이렇게 웹 문서에서 원하는 요소를 찾아가는 것을 '접근한다'고 한다. 여기서는 자바스크립트를 사용해 DOM에 접근하는 몇 가지 방법을 알아보겠다.    DOM에 접근하기CSS에서는 class, id, 태그 등의 스타일을 각각 구별해서 정의해야 한다. 이때 class, id, 태그 등을 선택자라고 한다. 이 선택자를 사용해서 DOM에 접근하는 방법을 알아보겠다.  id 선택자로 접근하는 getElementById() 메서드특정한 id가 포함된 DOM 요소에 접근할 수 있다.요소명.getElementById("id명")    class값으로 접근하는 getElementsByClassName() 메서드지정한..

DOM으로 버튼을 만드는 실습을 진행해볼 것이다. 실습이 조금 길어서 다음날까지 수업이 이어졌다.    DOM 버튼 생성 실습해보기    문제 풀기 1. 버튼을 클릭하면 태그가 생성되도록 하기메뉴 구성을 만들어보겠다. 버튼을 클릭하면 태그가 생성되도록 만든다. 이제 버튼을 누를 때마다 동적으로 만들어지도록 코드를 추가한다.   2. 태그를 클릭하면 alert창이 실행되도록 하기  하지만 지금은 클릭을 해도 태그가 나오지 않는다.   3. 버튼에 스타일 적용하기  html과 자바스크립트가 분리가 되지 않고 좋은 방식은 아니다. 태그를 확인하면 모두 다 볼 수 있는 보완에 취약하다는 문제점이 있다.  앞으로 할 실습 프로세스를 정리해보았다.   4. 실습 프로세스 구조 작성하고 텍스트 추가 태그 생성하기  ..

이번에는 재사용성 함수를 만드는 방법에 대해서 공부해보겠다. 그리고 새벽에 수업을 통해 공부했던 함수 표현식에 대해서고 학습해볼 것이다.    매개변수, 인수, return 알아보기 한번만 사용하는 함수라면 상관없지만, 프로그램 안에서 여러 번 사용하는 함수인데 입력값을 바꾸지 못한다면 매우 불편할 것이다. 이처럼 변수값이 자주 변하는 상황에서 사용하려면 값을 고정하지 않고 어떤 숫자든지 2개만 addNumber() 함수로 넘겨서 더해주면 된다. 즉, 함수를 실행하는데 필요한 값을 함수 밖에서 제공하는 것이다.이렇게 하려면 함수를 선언할 때부터 외부에서 값을 받아줄 변수를 미리 만들어야 한다. 이것을 매개변수라 하고 함수를 호출할 때 괄호 안에 매개변수의 이름을 넣는다.  함수 선언할 때 매개변수 지정하..

배열 관련 내용은 책에도 엘리스에도 없는 내용이라 수업 시간을 통해 개념을 읽히며 문제를 풀어보는 시간이 참 소중했다. 이제 오후 공부를 시작해보려고 한다.      배열 미션 문제 풀기 과목의 개수를 입력하고 과목을 이름을 입력할 입력창이 나온다. 그런 다음 각 과목의 점수를 입력하면 이와 같은 과목별 점수의 총합과 평균이 출력되도록 코드를 작성하는 문제이다.   문제 풀어보기 1. HTML 문서 기본 형태 만들고 제목 바꾸기 이제 여기에 표 형태를 작성해 볼 것이다.   2. 표 형태로 코드 작성하기 이 코드가 잘 출력이 되는지 확인해보자.  잘 출력이 된다. 오랜만에 HTML/CSS를 하려니 헷갈려서 몇 번이나 틀렸다가 다시 코드를 수정했다.   3. 변수 선언 및 초기화script 태그에 다음과 ..

점심을 먹고 3시부터 공부를 했어야 하지만 공부가 안돼서 계속 쉬다가 오후가 끝나갈 무렵 시작해 본다. 오늘은 심신이 지쳐서 목표했던 공부량을 많이 채우지 못할 것 같다.조금이라도 하며 하루를 마무리해야겠다. 자료형에 대해서 복습하며 공부해보겠다. 자료형이란 프로그램에서 처리할 자료의 형태를 뜻한다. 예를 들어 '3'을 숫자로 처리하는지, 문자열로 처리하는지에 따라 프로그램의 결과는 달라진다.   자료형이란컴퓨터가 처리할 수 있는 자료의 형태를 자료형이라고 한다. 자바스크립트의 자료형은 숫자, 문자열, 논리형과 같은 기본 유형과 배열, 객체를 다루는 복합 유형 그리고 undefined, null 같은 특수 유형이 있다. 아래는 자료형을 정리한 것이다.    숫자형자바스크립트에서 숫자형은 정수와 실수로 나..