728x90 개발34 [javascript] 비동기란? 자바스크립트에서 사용되는 콜백함수, Promise, async & await 개념을 알기 위해서는 먼저 비동기 개념을 알아야 한다. 그럼 비동기가 무엇인지 살펴보자. 비동기 처리란? 자바스크립트에서 비동기 처리란 특정 코드가 끝날때 까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 것을 의미한다. 비동기 처리를 예로 Ajax, setTimeout 등이 있다. 자바스크립트는 single thread(싱글 스레드)이기 때문에 작업을 하나씩만 수행할 수 있다. 그럼 어떻게 비동기 처리를 할 수 있는가? 바로 이벤트 루프때문에 가능하다. setTimeout은 브라우저의 다른 비동기 함수들(addEventListener, XMLHttpRequest)이나 node.js들 모든 비동기 방식의 api들처럼 이.. 2021. 7. 8. WebSocket (웹소켓이란?) # 웹소켓이란? # javascript 웹소켓 개념 시작하는 말 글쓴이가 웹소켓을 처음 접하게 된 계기는 회사의 클라우드의 서버에서 단말과 연동하기 위해 사용되었기 때문이었다. 어떻게 서로 데이터를 주고받을 수 있는지 궁금했던 경험을 바탕으로 이번 포스팅에서는 양방향 통신을 지원하는 웹소켓에 대해 적어보려 한다. 웹 소켓(Web socket)이란? Stateful protocol - HTML5 순수 웹 환경에서 연결 지향 양방향 통신을 지원하는 것이다. ( 참고로 AJax, Comet은 모두 Polling 방식이라 한다 Stateless protocol ) 웹 소켓은 웹 서버와 웹 브라우저가 지속적으로 연결된 TCP라인을 통해 실시간으로 데이터를 주고 받을 수 있도록 하는 HTML5의 새로운 사양이다. .. 2021. 7. 7. Vue.js란? Vue.js란? 웹 페이지 화면을 개발하기 위한 프레임워크로 React와 Angular의 장점을 가져 성능이 우수하고 가볍습니다. Vue.js와 다른 프레임워크 비교표 Vue.js React Angular Virtual DOM O O X 장점 쉬움, React와 Angular의 장점 적용 이벤트 핸들링 용이, 다양한 플랫폼 개발 가능, 페이스북 지원 잘 된 구조화, 구글지원 단점 래퍼런스가 적음 필수 라이브러리 많음, JSX에서 로직구현 높은 러닝커브(많은 학습시간) 환경 빠른 개발 요구 시 많은 이벤트 필요시 엔터프라이즈 언어 ES6 JSX TypeScript Vue.js 특징 MVVM 패턴 Virtual DOM 가벼움 Template과 Component MVVM 패턴 MVVM(Mode - View -.. 2021. 7. 6. vue.$NextTick이란? vm.$nextTick 해당 메서드는 다음 렌더링 사이클 이후 실행될 콜백 함수를 등록할 수 있는 기능을 제공하는 메서드이다. 이 말은 즉, $nextTick의 콜백 함수 안에서 DOM을 조작하면, 데이터를 가지고 화면을 그리기 전에 DOM이 먼저 생성되며 원하는 트리(태그)를 찾지 못하는 오류를 막을 수 있다. created : function() { this.$nextTick(function(){ var item = document.getElementById('textBox'); item.style.backgroundColor = 'green'; }); } $nextTick은 await/async와도 함께 사용 가능하다고 한다. methods : { async doSomething(){ await t.. 2021. 7. 4. Javascript Object태그란? 시작하기 전에 회사에서 라이브 커머스를 담당하게 되었는데 object 태그의 type을 video/mpeg를 써 data를 보내 구현하였다. 이때 처음 object를 접하게 되었는데 접하지 못한 개발자들을 위해 간단히 object에 대해 알아보자. object 태그란? object 태그는 HTML안에 멀티미디어 객체, 다른 HTML문서나 pdf, 플러그인을 넣을 수 있는 태그이다. 그러나 object는 iframe을 사용할 수 없을 상황에 쓰이는 퇴화 태그로 간주된다. object태그는 설정을 업데이트 해도 반영되지 않는다. vs iframe iframe도 마찬가지로 HTML 내에 다른 HTML 또는 플래쉬 플레이어를 넣어 재생 시킬 수 있는 태그이다. iframe은 HTML 4.01부터 모든 브라우저에.. 2021. 7. 3. JVM(Java Virtual Machine) 이란? 본 포스팅은 학습 목적에 있습니다. 시작하는 말 JVM이라는 말을 접한 적이 있는가? JAVA를 처음 배울때 컴퓨터가 어떻게 이 언어를 알아듣고 구현한 코드가 실행되는지 궁금한 적이 있다. 그것은 바로 JVM이 해주는 것이었다! 그럼 JVM이 무엇인지 알아보자. JVM이란? JVM은 자바를 실행하기 위한 가상 컴퓨터라고 생각하면 된다(실제 컴퓨터보다는 소프트웨어로 구현한 것) JVM은 JAVA와 OS 사이의 중개자 역할로 OS에 독립적이고 재사용이 가능하다.(즉, JAVA 응용 프로그램은 JVM과 통신하고 통신하며 받은 명령을 OS가 이해할 수 있도록 변환 후 전달) JVM은 메모리 관리 및 가비지 컬렉션(Garbage Collection) 수행 JVM 구조 Class Loader 자바 컴파일러를 사용해.. 2021. 6. 24. jsp 페이지 로딩 순서 시작하기 전에(필자의 여담) 랜더링 순서? 랜더링 순서란 페이지를 로딩하며 코드가 실행되는 순서를 말한다. 그럼 이게 왜 중요할까? 회사에 입사해서 분명 코드에는 존재하는데 참조하지 못하는 경우를 경험한 적이 있다. 처음엔 내 코드가 잘못 된 줄 알았다. 아, 잘못 된 건 맞다. 하지만 코드를 작성한 위치가 잘못 되었었다... HTML 랜더링 순서 HTML, jsp 모두 인터프리터 언어이다. 따라서 위에서 아래대로 실행된다. Import 의 onload window.onload (스크립트는 각 상위태그 순서에 따라) 랜더링 순서를 이해하기 위한 DOM 포스팅과 그 밖의 Vue 포스팅은 다음을 참고하자.(게시글 추가 예정) 랜더링 관련하여 Vue.js 프레임워크를 사용할 당시 vue.$nextTick을 사.. 2021. 6. 23. 이전 1 2 3 4 다음 728x90
