2021.12.18~12.19의 기록

- 오늘의 자체 평가 및 느낀점 - 

내가 주말을 보내는 방식은 스터디가 없기 때문에 혼자서 부족한 부분을 따로 공부하거나 국비 과정중 예습을 하는 편이다.

이번 주말에는 자바스크립트와 깃을 공부하기로 계획했었고, 목표한만큼 많이 듣진 않았지만 어느정도 DOM의 이해를 하며 주말을 마쳤다. 다음주는 더 열심히 살자. 

주말 간 저번주 금요일 스터디 때에 말을 떠올려 보았다. 요새 스터디원들 사이에는 세미나 파이널 프로젝트 얘기가 자주 나온다. 아무래도 국비 과정중 제일 중요한 협업 프로젝트이기도 하고 1달만 지나면 바로 시작하기 때문인 것 같다. 강사님이 밸런스패치를 마친 뒤 팀원 조를 수요일에 발표 하신다고 하셨다. 누구와 팀이 될지는 모르겠지만 적어도 실력도 실력이지만 서로 간의 "불통" 이 아닌 "소통"이 되었으면 좋겠다. 적절한 팀장급이 있으면 좋겠지만 없으면 내가 해볼 생각이다.

또 프로젝트의 의지(?)에 대해서는 스터디원들 각자가 선호하는 프로그래밍을 하실 생각인 것 같다. 나는 백엔드로 진로를 잡을 생각이기에 기능 구현이 프론트쪽 UI단보다 더 우선순위이다. 그리고 내년에 바로 취업을 할 예정이지만 국비 과정이 끝나고 취업 전 알고리즘과 병행하여 따로 개인 프로젝트를 2, 3개 더 만들어 보고 취업을 할 생각이었기에 국비 과정 세미나, 파이널 프로젝트의 욕심? 기대가 좀 없었던 것 같다. 이러한 생각들을 반성한다. 가슴에 손을 대고 생각해보니 몸이 편한 방법을 찾고 있었던 것이다. 내가 불편하고 귀찮은 현실을 도피하려 하는 나의 행동은 크나큰 패착이라 생각한다. 더 열심히 해도 모자랄 판에 이러한 생각을 하고 있었다니.. 다시 스스로에게 채찍질을 할 생각이다.

---

- 주말 공부 계획 -

1. 깃 공부( git bash 이용!)
2. 자바스크립트 공부 (뉴렉처)

---

- 공부 내용 - 

- 강의를 들으며 필기한 것.

//Ex4 : childNodes를 이용한 노드 선택
window.addEventListener("load", function () {
  var section4 = this.document.querySelector("#section4");

  var box = section4.querySelector(".box");

  var input1 = box.children[0];//.childNodes[0];
  var input2 = box.children[1];//.childNodes[1];

  input1.value="hello";
  input2.value="okay";
});

//Ex3 : Selectors API Level1
window.addEventListener("load", function () {
  var section3 = this.document.getElementById("section3");
  var txtX = section3.querySelector("input[name='x']");
  var txtY = section3.querySelector(".txt-y");
  var btnAdd = section3.querySelector(".btn-add");
  var txtSum = section3.querySelector(".txt-sum");

  btnAdd.onclick = function () {
    var x = parseInt(txtX.value);
    var y = parseInt(txtY.value);

    txtSum.value = x + y;
  };
});

//Ex2 : 엘리먼트 선택방법 개선하기
window.addEventListener("load", function () {
  var section2 = this.document.getElementById("section2");
  var txtX = section2.getElementsByClassName("txt-x")[0];
  var txtY = section2.getElementsByClassName("txt-y")[0];
  var btnAdd = section2.getElementsByClassName("btn-add")[0];
  var txtSum = section2.getElementsByClassName("txt-sum")[0];
  /*
  var inputs = section2.getElementsByTagName("input");

  var txtX = inputs[0];
  var txtY = inputs[1];
  var btnAdd = inputs[2];
  var txtSum = inputs[3];
  */

  btnAdd.onclick = function () {
    var x = parseInt(txtX.value);
    var y = parseInt(txtY.value);

    txtSum.value = x + y;
  };
});

//Ex1 : 계산기 프로그램
window.addEventListener("load", function () {
  var txtX = document.getElementById("txt-x");
  var txtY = document.getElementById("txt-y");
  var btnAdd = document.getElementById("btn-add");
  var txtSum = document.getElementById("txt-sum");

  btnAdd.onclick = function () {
    var x = parseInt(txtX.value);
    var y = parseInt(txtY.value);

    txtSum.value = x + y;
  };
});

- 뉴렉처 유튜브의 자바스크립트 강의를 들으며 적은 예제용  js 코드. HTML의 각 태그들은 브라우저에서 DOM의 형태로 객체화 되고 그 DOM을 이용하여 태그의 ID속성이나 class로 부여된 이름을 가져와 js 스크립트를 작성할 수 있게 된다.

---

- 스터디 계획 및 결과 - 

주말이라 스터디가 없는 날.