Sweet But Psycho

✔ Nodejs Node.js는 싱글스레드로 이루어져 있다. 그 스레드는 이벤트 루프라는 것을 실행하는 메인스레드이다. 이때, 이벤트 루프는 개발자가 생성한 자바스크립트 코드(콜백 함수)를 제어하는 곳이다. *이벤트 루프가 코드를 실행한다고 생각하면 X, 코드를 실행하는 곳은 자바스크립트 엔진인 V8이다. ✔ Libuv Node.js는 이벤트 루프를 작동시킬 때, libuv라는 비동기식 라이브러리를 사용한다. node.js는 싱글 스레드이지만 비동기 메소드를 수행하기 위해 libuv에서 4개의 스레드 풀을 만들고 이를 백그라운드에서 동시에 처리한다. 이로 인해 싱글스레드이지만 작업 처리는 멀티 스레드로 할 수 있는 것이다. 그리고 nodejs가 싱글 스레드 논블로킹 I/O 방식으로 처리할 수 있는 이유는..

프로토콜의 종류가 많은데 이것들의 관계가 제대로 이해가지 않아서 어떤 것이 어떤 프로토콜인지 헷갈렸다. ISO에서 컴퓨터 네트워크 프로토콜 디자인과 통신을 7개의 계층으로 이루어져 있는 OSI 모형으로 정의하였다. 그 중 7계층에 해당하는 응용 계층(Application Layer)에 해당하는 통신 프로토콜 중 http에 대해서 알아볼 것이다. 프로토콜이란? 일반적으로 공통적으로 데이터를 교환하는 방법이나 순서에 대해서 정의한 의사소통 약속, 규칙 체계를 말한다. OSI 계층에 대한 프로토콜들로 많은 종류가 있다. 내가 헷갈리는 프로토콜은 통신 프로토콜과 네트워크 프로토콜이었는데 위의 OSI 모형에 따르면 전혀 다른 개념이었다. HTTP는 7계층 응용 계층에 대한 통신 프로토콜에 포함되고 네트워크 프로토..

어제 스쳐지난 것들이 오늘 수업 내용이 될 줄이야... 덕분에 스레드 개념과 운영체제 작업 처리 방식에 대해서 깊이 탐구할 수 있었다. Synchronous, Asynchronous -동기 처리 방식 : 작업을 순차적으로 처리하는 것 -비동기 처리 방식 : 순차적 X ✔ 여기서 생각해봐야 할 것은 융통성 있어 보이는 비동기 처리가 항상 좋은 것인가이다. 비동기적 처리에 있어서 가장 주의해야 할 점은 각 작업 단계의 순서를 보장할 수 없다는 것이다. 만약 1단계의 데이터가 2단계에서 사용된다면 1단계의 작업이 완료되기 전까지 2단계 작업이 호출되더라도 작업을 제대로 수행할 수 없다. ✔ 비동기적 처리의 문제점을 약간 해결? 콜백 함수를 중첩시켜서 비동기적 함수 구조를 하나로 묶을 수 있고 각 작업들을 순서..

Node.js는 php, jsp, asp.net과 같이 자바스크립트 엔진을 서버로 사용할 수 있도록 하는 플랫폼이다. 단일 스레드 non-blocking I/O로 빠른 성능을 낼 수 있는 것이 특징! 여기서 스레드는 프로세스 안에서 프로그램 명령을 수행하는 CPU 이용 기본 단위인데 같은 프로세스 내에서는 다른 스레드, 파일 등 프로세스 자원을 공유한다. 단일 스레드는 하나의 프로세스 안에 하나의 제어 모델인 스레드가 있는 것이다. 하나가 아닌 여러 개의 스레드가 있으면 멀티 스레드이다. 단일 스레드와 멀티 스레드는 각자 장단점을 가지고 있고 요청에 대한 빠른 반응이 필요한 네트워크 서버 프로그램일 경우 단일 스레드가 적합하다. non-blocking은 blocking 과 비교되는데 하나의 작업을 실행하..

자바스크립트를 왜 배우는지 다시 생각해보자 내가 듣는 교육과정에 프론트엔드, 백엔드 과정이 둘 다 포함되어있다. 이것을 아울러 풀스택이라고 하는 것 같은데 자바스크립트는 프론트엔드 개발 언어에 적합하다. ✔ 현업에서는 프로젝트 개발 순서가 1. 개발 의뢰 by 클라이언트 2. 기획안 작성 (클라이언트의 요구에 맞게) 3. UI 시안 (기획안을 토대로 디자이너가 UI 디자인) 4. 프론트엔드 (HTML, JavaScript, JQuery) //사용자의 눈에 보이는 부분까지 개발 5. 백엔드 (ASP, PHP, JSP) //보통 사용자의 눈에 보이지 않는 부분 개발 회원가입이 대표적 ✔ 자바스크립트의 표준화 ECMA 262 1버전인 ES1부터 기능이 추가되어 ES6까지 생겼다. 보편적인 것은 ES5이고 ES..

한달이라는 시간이 지났지만 이제서야 정리를 하다니... 공부하는 이유를 돌이켜보고 의지를 다지자. ✔ 블록체인에 대해 알게 된 계기 코로나가 난리이기 전 도서관에서 무슨 책을 읽을까 돌아보던 중에 '블록체인 트렌드 2020'라는 이름의 책을 지나치게 되었는데 오호 블록체인이 뭐지 궁금해서 읽게 되었다. 블록체인이 비트코인의 원리라는 것을 알게 되었고 단순히 비트코인을 떠나 전반적인 산업에서 이것이 중요하다는 것을 알게 되었다. 신한은행에서는 골드바 보증서를 블록체인으로 배포, 관리하고 (그것도 2016년인가에) 남부발전에서도 발전소 데이터를 블록체인에 구축하여 리스크를 관리한다. 정부에서도 농축산물 유통 관리를 블록체인 시스템으로 구축하는 사업이 한창 진행되고 있다. 지금 생각이 이것밖에 안나는데 그 외..

21.01.18 오류 해결 스크롤 down했을 때 요소들이 fade up 되는 애니메이션을 추가하고 난 뒤 비즈니스 탭의 text 애니메이션이 제대로 실행되지 않는 문제가 있었다. ✔ 원인은 바로 .load 함수를 쓰지 않은 것이었다. 나는 다음 코드를 추가했는데 오류 없이 잘 실행되었다. ✔ $(요소 선택).load(function(){this.width;}) $(window).load()와 $(document).ready() 의 차이점 .ready() 함수로 문제를 해결하려고 했지만 실패했었다. 그 이유는 아래와 같다. $(document).ready()는 이미지, 외부 리소스와는 상관 없이 브라우저가 DOM을 모두 생성한 직후 실행된다. $(window).load()는 웹페이지의 이미지 랜더링이 모..

애니메이션을 나타내기 위해서는 여러가지 선택지가 있다. css transition, animation keyframes, js 등으로 할 수 있는데 그 중에서 가장 자연스러우면서 부드러운 애니메이션을 구현하는 것은 keyframes이다. 인 것 같다. 예를 들어 슬라이더를 구현할 때 똑같이 opacity 값을 바꿔가면서 fade-in, fade-out 효과를 준다고 하면 js는 딱 있다가 없다 느낌이고 transition은 느낌이라도 살린 느낌이라면 keyframes는 부드럽게 샤랄라한 느낌이다. 결론 : jquery로 keyframes를 제어하는 것이 가장 유용하고 필요한 기술인 것 같다. keyframes의 value 값까지 js에서 속성 추가하고 제어할 수 있으면 참 좋겠지만 퍼센트 케이스만 제어할..

상현님이 올려주신 개구리 게임의 연장선으로 머장님이 또 올려주신 그리드 연습 게임을 했다. 원래 div-position,%로 짤 때 올려주신 걸 보고도 나중에 해봐야쥥~!!하고 넘겼는데 그리드 레이아웃을 짜기로 결정하고 어쩔 수 없이 게임을 켰다... 개구리보다 살짝 어려웠다. 내가 이해한 부분은 grid-column 과 grid-row 를 1/3로 설정하면 각각 1행부터 3행, 1열부터 3열까지가 되는 것! grid-column과 grid-row를 grid-area로 동시에 제어할 수 있다는 것! 1fr 3fr 일 때 첫번째 셀은 1/(1+3)의 크기이고 두번째 셀이 3/(1+3) 의 크기가 된다는 것! 이다. 하지만 내가 아직 완벽히 이해하지 못한 부분은 grid-template-columns (혹은..

반응형 레이아웃을 짜다가 어제(14일) 하루를 날리고 깨달은 것이 하나 있다. 급하다고 야매로 하다가는 언젠가는 무너질 때가 있고 이것이 일회용이 될 수 밖에 없다는 것이다. div 지옥에서 기준이 없는 %와 position 과의 싸움 끝에 그냥 내려놓고 레이아웃 짜는 법부터 익혔다. 레이아웃은 가변 그리드로 설정했다. 구성을 훨씬 깔끔하게 짤 수 있고 컨텐츠를 하나 넣을 때마다 달라지는 현상이 적어 유지 보수 차원에서 아주 좋은 선택이었다! 그리고 background-color가 영역을 한눈에 보기에 굉장히 유용한 녀석인 것을 깨달았다. 아래는 header와 main menu, welcome words, link tab으로 구성한 초안이다. 지금은 여기서 발전하여 스크롤을 많이 내릴 수 있게 되었다. ..