💙 들어가며 프론트엔드에서 MVC를 지원하는 프레임워크인 뷰에 대해서 알아보자! ✏️ 학습내용 정리 #뷰(Vue)란? 프론트엔드에서 MVC를 지원하는 프레임워크 중 하나이다. (MVC로 개발할 것이 아니면 뷰는 필요하지 않다.) 백엔드에서 스프링MVC와 같은 것 프론트에서 MVC를 사용하면 데이터를 바인딩할 때 DOM을 쓸 필요가 없다. 모델을 바인딩하는 방법으로 DOM을 대신할 수 있다. 어찌보면 Angular JS의 모방품이다. #SPA(Single Page Application) Ajax를 이용하기 시작하면서 웹은 점점 페이지를 새로 불러오지 않고 하나의 페이지로 처리하는 Single Page Application화 되기 시작했다. 그러다보니 하나의 페이지 안에서 사용자 입/출력과 관련하여 갱신하는..
💙 들어가며 자바스크립트의 탈 브라우저가 가능하게 한 NodeJS NodeJS에 대해서 알아보자. 💡 학습내용 정리 #자바스크립트 실행 환경 자바스크립트는 브라우저가 플랫폼이다. 브라우저를 켜지 않으면 실행할 수 없다. 다른 언어들처럼 자바스크립트도 실행환경이 있다면 로컬 시스템을 위한 프로그램을 만들 수 있었을테지만 실행환경이 브라우저였기 때문에 그런 것이 불가능했다. 💡 자바스크립트의 실행기는 브라우저! 다른 언어들은 실행기와 언어가 처음부터 같이 만들어지는데 자바스크립트는 실행기(브라우저)가 먼저 만들어지고 언어가 그 이후에 실행기에 맞춰 만들어져서 브라우저를 켜지 않으면 실행할 수 있는 방법이 없었다. 그런데 구글 크롬에서 V8이라는 새로운 자바스크립트 엔진을 발표했고, 엔진이 브라우저와의 결합력..
💙 들어가며 클릭하면 좋아요에 관련된 정보가 insert, delete되는 기능을 CSR로 구현해보자! ✏️ 학습내용 정리 #RESTful의 뜻 이해하기 REST는 자원관리를 위해 사용했던 표현식이다. RESTful이란 REST는 아니고 REST스럽게 쓴다는 말이다. REST는 거시적 단위에서 미시적 단위로 상태를 표시하는데 그 단위를 표시하는 구분자가 '/'이다. 지금까지는 url이 리소스 문서의 파일경로 위치를 찾는 것이었는데 이제는 리소스를 마구잡이로 찾는 것이 아니라 그 api를 REST형태의 모양을 갖춘 요청으로 바꾸려는 것이다. 과거에는 CRUD의 형태가 URL에 붙었었는데 REST에서는 이 행위(CRUD)에 대한 것은 HTTP 메소드(POST/GET/PUT*PATCH/DELETE)로 해결하고..
💙 들어가며 Ajax를 지원하는 또 다른 방식 프라미스에 대해서 배워보자! ✏️ 학습내용 정리 #동기와 비동기 코드는 쭈욱 일렬로 나열되어 있다. 그러나 어떤 코드는 처리시간이 오래 걸리고, 어떤 코드는 바로 처리될 수도 있다. 모든 코드를 다 순차적으로 실행하려다보면 특정 부분에서 걸려서 응답이 늦어지는 문제가 생기게 된다. 그래서 동기(순차적)으로 처리되는 것과 비동기적(비순차적)으로 처리되는 것이 필요하다. 비동기적(비순차적)으로 처리된다고 하면 흐름이 2가지가 된다는 뜻이다. 내 눈앞에 보이는 코드 중에 일부가 다른 흐름에 들어가있다고 한다면 끝나는 시점을 어떻게 알 수 있을까? (비동기 작업이 끝났다는 것은 어떻게 알 수 있을까?) 우리는 이전에 콜백함수를 사용하여 비동기 작업이 끝났는지 확인하..
💙 들어가며 프라미스에 대해서 배우고 콜백지옥에서 벗어나보자! ✏️ 학습내용 정리 #동기 코드처리 HTML파일과 js파일을 하나 준비하고 div태그에 img태그를 추가해보자. img 태그의 너비를 100으로 줄이는 코드도 추가했다. HTML에서 정상적으로 img 너비가 100으로 출력된다. 하지만 이것은 당연한 것이 아니다. 동기적으로 처리되었기 때문에 이미지의 너비를 조정할 수 있었던 것이다. 이미지는 원격(서버)에 있는 거고 문서에 올리고 있는 상황인데, 원래는 문서가 읽히는 속도가 이미지가 업로드 되는 속도보다 빠르다. 즉, 지금 문서는 동기적으로 실행이 되고 있다. 이미지를 텍스트로 넣었고, 이미지가 객체화 되기까지의 시간을 기다려주었다. 그래서 width를 조정할 수 있었던 것이다. window..
