오늘 공부할 내용

• WEB2 강의
• 프로젝트 준비
• 화요일 수업준비(퀴즈 준비)
• 질문사항 조사 및 정리
• TiL 정리 및 블로그 업데이트

오늘 공부한 것 & 배운 내용

• WEB2 강의

  • 오전에 가볍게 들을 수 있는 HTTP, Domain Name System강의를 마지막으로 WEB2 를 마치려고 했으나 공부에 욕심이 나서 JavScript부터 공부를 시작한다..

    • 시간안에 다마칠수 있을지는 모르겠지만 공부를 하고 싶은것부터, 그리고 내가 더 필요한 것부터 공부를하는게 맞는것 같아서 결정하고 실행하고 있다

  • JavScript강의

    • 1-수업의 목적
      • JavaScript가 Html을 제어하는 언어라는 특징을 이해하기 위해 실행코드를 말로 설명해주셨다
        • Html안에서 CSS와 JavaScript같은 다른언어들이 함께 동작하는 것이 신기하게 느껴졌다
    • 2-HTML과 JS의 만남1 : script 태그
      • script 태그를 통해 js를 사용한다는 것을 알릴 수 있다
        • document.write()를 통해 내용을 화면에 출력할 수 있다
      • html과 js의 차이는 html은 정적이라 있는그대로 출력하지만(string 같이), js는 동적이라 연산결과를 출력할수 있다
    • 3-HTML과 JS의 만남2 : 이벤트
      • 실습
        • Input type="button "을 통해 버튼을 만들 수 있다 . value속성은 버튼안에 메세지를 넣을수 있게한다
        • onclick= 뒤에는 js코드가 나와야된다고 약속되어 있다
          • 버튼을 클릭시 js코드대로 웹브라우저가 동작하게 되어있다
          • alert()은 onclick시 경고창이 나타나게한다
        • 이렇게 웹브라우저에서 일어나는 일들을 사건(이벤트)라고 한다
          • 이벤트가 일어났을시 js가 실행되게 하는것이 onclick이라는 아이
        • type="text" (텍스트입력창나타남) onchange = 텍스트 입력이 변화되었을때 행동을 입력받음
        • onkeydown -> key를 입력시에 행동을 입력받음
      • 정리
        • on~으로 시작하는애들을 event라고 하고 이런것들 이용해서 사용자와 상호작용 하는 기능을 만들 수 있다
    • 4-HTML과 JS의 만남3 : console(콘솔)
      • 실습
        • 크롬 - 개발자도구 - Console을 통하여 JS를 즉석해서 작성해서 실행할 수 있다
          • 웹페이지와 독립적인게 아니라 열려있는 웹페이지 위에서 실행되게 된다
          • ' '로 문자열을 감싸면 문자가 되고 .length를 치면 길이를 알 수 있다
        • 어떤 페이지에서 Elemnt창에서 esc를 누루면 Console이 아래의 동시에 뜨게된다
          • 페이스북 댓글들 중에 당첨자뽑는 과정을 통해 웹페이지를 직접 수정하는것이 아닌 그대로 활용하여 데이터를 처리하는 방법을 보여주셨다
            • 필요에 따라 웹페이지를 사용할 수 있는 방법으로 웹페이지 활용에 새로운 관점이 되는것 같다
    • 5-데이터타입 : 문자열과 숫자
      • 실습
        • 개발자도구 콘솔창에서 실습을함
          • 숫자
            • alert을 통해서 메세지를 띄울수도 있고 아니면 그냥 수식을 사용하면 값이 콘솔창에 뜬다
            • +/-/*/ 로 4가지이항 연산자이면서 산술연살자가있다
          • 문자열
            • 문자열은 ""로 하거나 '' 묶어주면된다
            • .length를 하면 길이를 알려준다
            • 그외에도 .indeOf .trim . toUpperCase()등 반가운 문법들이 등장했다
            • +로 문자열을 이어줄 수 있다
        • 자바와 자바스크립트의 연관성
          • 자바 메소드가 자바스크립의 메소드와 비슷해서 연관성을 찾아보려 검색했는데 이는 두언어 모두 C언어를 기반으로하고 있기 때문이라고 한다. 이름만 비슷할 뿐 그외에 연관성은 없다고 한다
    • 6-변수와 대입 연산자
      • 실습
        • 자바에서 처럼 변수를 선언하고 대입연산자로 값을 대입할 수 있다
        • 변수앞에는 var을 붙여 준다 . var name = "egoing"
        • 변수를 왜사용하는가?
          • 변해야 되는 데이터를 지정해줌으로 여러데이터를 한번에 변할 수 있게 한다
    • 7-웹브라우저 제어
      • 웹브라우저를 제어하기 위해서는 CSS에 대한 기초적인 내용과 자바스크립트를 알아야된다
    • 8-제어할태그 선택하기
      • document.querySelector('body')를 통해 body 태그를 선택할 수 있따
      • .style.backgorundColor , .sytle.color 를 통하여 불러온 선택자의 style속성에 접근할 수 있다
    • 9-프로그램, 프로그래밍, 프로그래머
      • HTML은 언어이고 javaScript는 프로그래밍 언어이다. 그차이는 무엇일까?
        • 시간에 순서대로 실행되어야 하는 컴퓨터의 여러기능들을 글로적는 방법을 고안한 것이 프로그래밍 언이다
        • HTML은 웹페이지를 만든 것이기 때문에 시간에 순서에 따라 실행될 필요가없다
        • 하지만 JS는 사용자와 상호작용에 따라 시간순서에 따라 실행되야 되기 대문에 프로그래밍의 형태를 띄고 있다
        • 이후에 더 발전된 형태를 통해 시간순서가 아닌 조건에 따라 실행되거나 반복해서 실행되는 것등으로 점점더 발전되가기 시작하였다
    • 24 - 함수의 소개
      • 함수는 코드의 수납상자이다. 여러 코드를 한줄로 수납하고, 수납장 이름을 사용하면 해당 코드들을 바로사용할 수 있다
    • 28 - 함수의 활용
      • 함수에서의 this는 자기자신의 태그를 가르키지 않기 때문에 매개변수를 만들고 함수를 사용할 때 매개변수에 this를 넣어주면 해당 태그를 가르키게 된다.
        • 함수에서의 this는 전역객체를 가르킨다는데 전역객체가 뭔지는 아직 모르겠다
    • 35- 라이브러리와 프레임워크
      • 라이브러리: 프로그램을만들고자 할대 쓰는 부붐들을 잘정리정돈해둔 소프트웨어,
        • 내가 필요한 도구를 가져와서 사용하는 느낌
      • 프레임워크: 만들고자하는 목적에 맞게 구성해놓고 달라지는 부분만 내가 조금씩 만져서 만들도록 해놓은 반제품과 같은 것
        • 우리가 프레임워크 안에 들어가서 작업하는 느낌
      • jQuery- JS에서 가장 유명한 라이브러리
        • 로컬드라이브에 다운 받을 수 도 있지만 CDN을 통해 주소를 링크하는것만으로도 사용가능하다 wow
        • 자바는 거의 대부분 import하는 걸로 사용이 가능했는데 그게 편안하게 사용한거구나라는걸 느꼇다
      • 문법도 중요하지만 이렇게 라이브러리 사용법을 잘 배워놓으면 훨씬 할수 있는일이 많아진다고 설명하셨다
    • 36- UI & API
      • UI (User Interface): 사용자가 시스템을 제어하기 위해 사용하는 조작장치
      • API (Application Programming Interface): 에플리케이션을 만들기 위해서 프로그래밍을 할때 사용하는 조작장치,(alert 함수 사용하면 웹브라우저 내부에 경고창 뜨듯이)
        • 프로그래밍 할때 사용하는 도구로 이해를 하였다 => 라이브러리랑 다른점은 무엇일까?
    • 37-마무리
      • 공부를 했으면 프로젝트를 시작해라. 공부만 하고 사용하지 않으면 머리만 커서 자신이 짠 코드를 인정하기가 어렵다
      • 모든 개념을 총동원하기보단 가장 최고한의 도구로 문제를 해결해보려고 노력하라. 최소한의 도구는 순서대로 명령을 실행하는 것
      • 그리고 나서 그것으로 해결하지 못하는 문제가 발생하는데 그 때 주의 깊게 다른 도구를 신중하게 도입하여 익숙해지면 또다시 한계가오는 시간이 온다. 그 때가 다시 공부를 시작할 때이다.
    • 느낀점
      • 다른 프로그래밍 언어를 배우는 것은 생각보다 재밌는 일이 었다.
        • 물론 아직 자바도 알아가는 과정이지만 자바를 이해하기 위해 노력했던 개념들이 다른 프로그래밍 언어들을 배울 때 등장하니 반갑고 수월하게 받아들일 수 있게해주었다
        • 여러 언어를 정통하기는 어렵겠지만 그래도 이렇게 튜토리얼 식으로 할 수 있는게 있다면 도전해보고 필요한 언어를 빠르게 습득하여 사용해볼 수 있겠다는 자신감을 얻은것 같다
      • JS까지 해서 웹 프론트 엔드의 3대장 HTML CSS JavaScript의 튜토리얼을 끝냈다
        • 이제 튜토리얼 단계이고 아직 프로젝트도 해보진 않았지만 다음 HTML수업때 덜해매고 재밌게 수업을 따라갈수만 있다면 이 시간들이 가치가 있을 것 같다
        • 무엇보다 3개의 언어가 어떻게 어우러져서 웹을 이루는지 어느정도 개념을 잡을 수 있어서 소기의 목표를 달성한 것 같다
      • JS는 생각보다 욕심이 나는 언어인 것 같다
        • 프론트 엔드쪽에도 연관이 있으며 백엔드까지 커버할수 있는 언어라니.. 올인원을 좋아하는 편이라 관심이 있었지만 조금 배워보니 더 욕심이난다
      • 마무리에서 들은 말에 많이 공감이 됬다. 수업을 빠르게 나가고 잘하는 코드들을 계속 보기 때문에 스스로의 코드를 인정하기가 어려웟다. 그리고 내가 아는 것을 다써보기도 전에 새로운 개념들이 등장해서 뭐가 뭔지도 모르고 사용한 것이 많았다..
        • 그러나 몇번은 내가가진 전부를 써도 안되는 것을 경험해 본 것 같다. 그때가 정말 배우기 좋은 타이밍인 것을 공감한다
        • 일단은 내가 아는 것 내가 가지고 있는 것을 최대한 활용한게 좋은 코딩이라고 생각하고 해보자. 내가 아는 것이 한계에 봉착할때마다 배운것들을 하나씩 들춰가며 기능을 추가하며 연습해 그것또한 내것으로 만들어보자
          • 그렇게 하나하나 쌓아가는것이 공부라고 생각하면 되게 재밌어보인다.. 처음부터 완벽할 수는 없다는 평범한 말을 다시한번 돌아봐보자
      • 중복의 제거
        • 이고잉선생님 강의는 대부분 튜토리얼로 소개하는 것에 목표를 두지만 단한가지 프로그래밍적으로 강조하는 부분이 있다면 중복의 제거이다.
          • 그것이 많은 프로그래밍 기법과 도구들의 발전을 가져왔기 때문인 것 같다.
          • 앞으로 내코드에서도 중복을 발견한다면 최대한 줄이는 방향으로 해봐야 겠다

  • nodjs수업

    • 환경설정과 기본 구동확인을 마치는 곳 까지 보고 마무리하였다 .
      • 앞으로 출퇴근길 강의와 아침시간을 활용해서 최대한 들어보고 가능하다면 생활코딩의 다른강좌들도 들어볼수있는 기회로 확장될 수 있기를 바라본다

공부하면서 느낀점

• 생활 코딩 강좌를 들으며 등장한 페이스북 페이지가 궁금해서 들어가 보니 생각보다 큰 개발자 커뮤니티가 있었다

  • 앞으로 생활하게될 커뮤니티 이기때문에 여기 뿐만아니라 다양한 곳을 둘러보고 활동하면서 개발자는 어떤문화 가지고 있는지 적응하면 도움이 될 것 같다

• NodJs까지 들으면서 웹 어플리케이션 강의를 완성 시키고 싶었는데 시간부족으로 하지 못했다. 다음에 조금이라도 여유가 생긴다면 NodJS까지 들는것을 도전해봐야될 것 같다

  • 아무래도 해보고 싶은 마음이 강해서 출퇴근시간에 강의를 보고 가서 실습을 해보는 방식으로 한번 도전해봐야 겠다
    • 어차피 일을하면서도 계속 공부를 해야되고 시간을 어떻게든 효율적으로 사용하는게 목표가 되야되는데 연습할 수 있는 기회가 될 수 있다
    • 어려움을 극복할때 창의성은 극대화된다는 말을 한번더 믿어보자

• 드디어 내일부터 오프라인 개강이 확정되었다. 어제의 불안한 마음은 가시고 이제 본격적으로 시작해야지 하는 마음이 들기 시작한다.

내일 공부할 내용

• 오후 수업준비
• 프로젝트 준비
• 오후 수업 복습 및 과제
• 질문사항 조사 및 정리
• TiL 정리 및 블로그 업데이트