TIL 11 (2020.07.13)

<생활코딩 - WEB - WEB2 - JavaScript>

1. 라이브러리와 프레임워크

   1 코딩을 처음부터 끝까지 모두 작성할 필요 없이, 다른 사람들이 만들어놓은 것을 가져와 부품으로써 사용하는 방법이 있다. 
   2 즉, 소프트웨어의 사회성을 이용해 생산자이자 소비자로서 코딩을 작성하는 방법을 알아볼 예정이다. 
   3 library: 
        1) 내가 만들고자 하는 프로그램에 필요한 부품이 되는 소프트웨어를 재사용하기 쉽도록 잘 정리 정돈해 놓은 소프트웨어 
          (사용자가 library를 끌어와 쓰는 느낌)
        2) jQuery 가 대표적이다. 
        3) CDN 방식을 통해 script scr로 끌어와 쓸 수 있다. (관리, 비용 면에서 극히 효율적)
        4) 이용방법
           1 jQuery script를 카피한 후, color.js 위에 붙여 넣기 한다. 
           2 color.js 파일에서 반복문 대신 jQuery를 사용할 수 있다. 
           3 검색 “jquery css”
           4 결과: .css(“color”, ”red”);
           5 $(‘a’).css(‘color’, color);   <- 두 번째 color은 매개변수이다. 
           6 $(‘body’).css(‘color’, color);
           7 $(‘body’).css(‘backgroundColor’, color);
        5) javascript는 오늘날 가장 빠르게 성장하는 컴퓨터 언어로, 라이브러리가 기하급수적으로 생성되고 있다. 
        6) 따라서, 어떤 라이브러리가 있고 새로 만들어지는지 아는 것이 중요하다. 
   4 framework
        1) 만들고자 하는 것에는 공통적인 부분과 비 공통적인 부분이 있다. 
          그중 공통적인 부분을 프레임워크라는 것이 만들어 놓았기 때문에 사용자는 취향에 맞추어 부분만 수정해주면 된다. 
          (반제품과 같이 사용자가 framework 안에 들어가 쓰는 느낌)
   5 내가 프로그램을 만드는 것뿐만 아니라, 다른 이가 만든 프로그램을 잘 사용하는 것도 중요하다. 

2. UI vs API

   1 UI is short for User Interface
        1) 사용자가 웹페이지 상의 조작장치를 이용하여 웹 애플리케이션을 사용한다. 
        2) 즉, 사용자가 시스템을 조작하기 위해 이용하는 조작장치가 유저 인터페이스이다. 
   2 API is short for Application Programming Interface. 
        1) 프로그래머가 함수(예를 들어 alert)를 이용하여 경고창을 생성한다. 
          이전에 alert라는 기능을 만들어 javascript의 사용 설명서를 통해 약속한 사람들이 있기에, 
          프로그래머는 alert이라는 함수를 호출해 경고창을 띄울 수 있다. 
        2) 즉, 함수 alert는 경고창을 실행하는 조작 장치이다. 
   3 모든 프로그래밍 언어에서, 모든 애플리케이션은 API를 순서대로(=프로그래밍 적으로) 실행하는 것을 통해 만들어진다. 
   4 API와 순서(프로그램)는 순망치한과 같은 존재이다. 
   5 이제 우리는 javascript를 접착체처럼 사용하며 API를 결합 및 응용해서 응용프로그램을 만들 수 있다. 

3. 수업을 마치며

        1) 프로젝트 진행하기
        2) 이젠 공부보다 실습, 실습보다 개인 프로젝트를 시작하는 것이 더 중요한 때이다. 
          프로젝트 시작이 늦어지고 공부를 많이 할수록 머리가 복잡해지기 때문에 자신이 짠 코드를 긍정하기 어렵다. 
        3) 개인 프로젝트를 실행할 때, 필수 불가결한 최소한의 도구만을 사용하며 문제를 해결해보는 것이 좋다. 
          이때, 최소한의 도구란 순서에 따라 실행되어야 하는 명령이 실행되는 것이다. 
        4) 이렇게 프로젝트를 진행하다가 문제 해결이 도저히 가능하지 않은 순간이 온다.
        5) 그때, 반복문, 조건문, 함수, 객체를 신중하게 도입하면서 각각 개념 간의 관계에 익숙해지면, 
          이런 개념을 유창하게 활용할 수 있게 된다.
        6) 유창하게 활용하다가 또 문제 해결이 가능하지 않은 순간이 오면, 그때가 다시 공부를 시작할 때이다. 

[JavaScript 개인 프로젝트 구상]

• 출퇴근 기록용 어플 생성

• 목표 기능

1. 출근 버튼을 클릭하면, 클릭한 순간의 컴퓨터 시간이 자동 입력되고 저장됨.
2. 시간은 별도로 변경할 수 없음.

• 진행 상황

1. 어디서부터 구상하고 시작해야 할지, 감이 잡히지 않는다. 아직 자바스크립트에 대해 아는 부분이 충분하지 않은데, 처음부터 너무 큰 목표를 세운 것 같다.
2. 우선 출퇴근 기록용 어플 생성은 천천히 진행하는 것으로 하자.
3. 수업하면서 배운 자바스크립트를 직접 활용해보는 정도로 프로젝트를 진행하자.

- JavaScript 활용 -

1. button 이벤트 키를 이용해, 버튼을 클릭할 때마다 내가 좋아하는 olive 색과 따뜻한 blue 색이 나타나도록 설정했다.
2. 관심 가는 타입을 모두 실행해보았는데, 그중 datetime-local 이란 타입을 실행하니 달력과 시간이 선택될 수 있도록 화면이 나타났다. 특히, “오늘”이란 부분을 클릭하면 클릭한 시간이 자동으로 화면에 입력되었는데, 이 타입을 활용해서 출퇴근 기록용 어플 생성이 가능할 것 같다.
3. html과 css를 배웠을 때는 이 지식을 이용해 내가 뭐든지 만들어낼 수 있을 것만 같았는데, 막상 javascript를 시작하니 나는 모르는 게 너무 많고 사람들이 개발한 것은 엄청 많은 것 같아 더 알아야 뭔가를 할 수 있겠다는 생각이 가득하다.
4. 비록 개인 프로젝트를 지금 진행하지 못한 것은 아쉽지만, node.js 혹은 python 등을 배워서 계속 시도해봐야겠다.
5. 특히 출퇴근 기록용 어플 및 프로그램은 2020년 7월 13일 현재 유료 제공만 확인되고 있다. 그렇기에 내가 만들어 무료로 제공할 경우, 이용을 원하는 프리랜서나 학생들이 꽤 있을 것 같다.