댓글 검색 목록

[Nodejs] JavaScript에 대한 나의 이해를 근본적으로 형성 한 18 개의 필수 비디오

페이지 정보

작성자 운영자 작성일 20-07-10 14:35 조회 737 댓글 0

자바 스크립트를 배우는 것은 거칠고 열렬한 여정입니다. 4 년 전에 언어를 처음 공부했을 때,이 여행이 얼마나 오래 걸렸는지 알지 못했을 것입니다. 필자는 처음 몇 줄의 겸손한 자바 스크립트가 결국 웹 개발의 세계로 들어가는 중요한 발판이 될 것으로 기대하지 않았다.


나는 이 여행을 저 앞에 걸어온 개척자들에게 현재의 지식의 대부분을 빚지고 있습니다. 그들의 아이디어와 혁신은 내가 거인의 어깨 위에 서서 건설 할 수 있는 길을 열어주었습니다.


몇 주 전에 저는 효과적인 학습의 수단으로 지식의 격차를 인정하고 받아들이는 것을 옹호하는 "건축 적 어리석음"에 대한 호기심을 가지고 알 수 없는 것에 직면 한 것에 대해 썼습니다. JavaScript와 일반적인 웹 개발에 대해 배울 점이 많기 때문에 이 기사에서 알 수 있듯이 언어에 익숙하지 않은 사람들이 알 수 없는 내용을 어떻게 위협하는지 상상할 수 없습니다.


아래는 JavaScript에 대한 나의 이해를 근본적으로 형성 한 18 개의 비디오 및 컨퍼런스 토크 목록입니다. 이 훌륭한 개인들이 지식을 자유롭게 사용하고 모든 사람이 이용할 수 있게 하지 않으면, 나는 현재 JavaScript 여행을 하고 있는 곳이 아닙니다.


이 비디오 각각에 대해, 내가 처음 볼 때 더 큰 그림을 함께 만드는 데 도움이 되는 "유레카 순간"이 있었습니다. 추가 조사가 필요했지만 그 시점부터 모든 것이 "클릭"되기 시작했습니다. 말하자면 퍼즐에 빠진 조각이었습니다.


이 "필수 비디오"목록을 통해 개척자들이 나에게 한 것처럼 JavaScript 개발자들을 올바른 방향으로 밀어 내고자 합니다.


참고 : 아래의 모든 비디오가 초보자를 위한 것은 아닙니다. 이 목록은 언어 기능, Node.js, 런타임 내부 (예 : 이벤트 루프), 성능, 최적화, 보안 및 일부 ES6 기능과 같은 JavaScript 에코 시스템의 여러 측면을 다룹니다.


어쨌든 이벤트 루프는 무엇입니까? [필립 로버츠] 


전설적인 이벤트 루프를 탐색하지 않고서는 "필수 JavaScript 비디오"목록을 완성 할 수 없습니다. 이 유명한 대화에서 필립 로버츠는 이벤트 루프인 토끼 구멍에 뛰어 들기 위해 필요한 기본 토대를 설정합니다.


이벤트 루프의 추가 모험 [Erin Zimmer] 


기본 직관을 갖추었으므로 Erin Zimmer의 강연은 접근 가능한 내러티브를 놓치지 않고 이벤트 루프의 기술적 세부 사항에 대해 자세히 설명합니다. Zimmer는 뛰어난 시각화를 통해 각 이벤트 루프 반복 동안 기본 중간 단계를 설명합니다.


루프에서 [Jake Archibald] 



이 대화에서 Jake Archibald는 이벤트 루프 시각화의 중심으로 "루프"의 문자 개념을 만듭니다. 브라우저에서 UI jank를 제거하기 위해 렌더링 루프, globalThis.setInterval 타이머 및 window.requestAnimationFrame 후크의 수수께끼를 풀었습니다.


Node.js 이벤트 루프에 대해 알아야 할 모든 것 [Bert Belder] 



이벤트 루프의 본질에 대한 모든 혼란으로 인해 Bert Belder는 정확하지 않은 다이어그램과 시각화에서 발생하는 불행한 공통적 인 오해를 반박했습니다.


Node.js 이벤트 루프 : 단일 스레드가 아님 [Bryan Hughes] 


"단일 스레드"라는 용어는 JavaScript에 대해 이야기 할 때 우연히 발생하는 경우가 많습니다. 이 대화에서 Bryan Hughes는 언어 자체가 어떻게 단일 스레드가 될 수 있는지 보여 주지만, 그럼에도 불구하고 전반적인 런타임은 확실하지 않습니다. 관련 메모에서 그는 성능 관점에서 Node.js의 유한 스레드 풀의 의미에 대해 설명합니다.


기억 : 쓰레기 꺼내는 것을 잊지 마세요 [Katie Fenn] 


"메모리는 유한 한 자원입니다. 우리는 고객의 컴퓨터에 더 많은 메모리를 추가 할 수 없습니다. 우리는 메모리를 사용하고 버리고 재사용 할 수 있습니다. 더 이상 얻을. " 


JavaScript 엔진의 내부 가비지 수집기는 메모리 관리를 사소한 주제로 만들었지 만 Katie Fenn은 메모리 사용에 대한 태만은 응용 프로그램 성능 및 사용자 경험과 관련하여 치명적인 결과를 초래한다는 점을 상기 시킵니다. 대화 중 다양한 예를 통해 사용되지 않은 변수, 느린 이벤트 리스너 및 로그 타이머를 추적하는 것이 얼마나 쉬운 지 보여줍니다.


Broken Promises [James Snell] 

"약속 체인에서, 동기 코드를 가져야 하는 유일한 곳은 최종 Promise # then 핸들러입니다." 


ES6 약속의 도입은 JavaScript에서 비동기 프로그래밍의 의미를 혁명적으로 변화 시켰습니다. 그러나 전력이 클수록 오용이 커집니다. 이 연설에서 제임스 스넬은 약속이 오용하고 잘못 사용했을 수 있는 다양한 방법을 안내합니다. 혼합 된 콜백에서 중복 래퍼에 이르기까지 이것은 마스터 링 약속에 대한 매우 중요한 프레젠테이션입니다.


You Don't Know Node [Samer Buna] 


"노드에 대한 대부분의 교육 내용은 노드 패키지를 가르치지 만 ... 이러한 노드 패키지는 실제로 노드 런타임을 래핑합니다. 문제가 발생하면 [노드 런타임] 스택 자체에서 문제가 발생할 가능성이 높습니다. "노드 런타임을 모른다면 문제가 생겼습니다." 


Samer Buna는 Node.js의 핵심을 추상화 하는 수많은 NPM 패키지를 사용하여 Node 기본에 대한 친숙함에 대해 더 신중하게 생각하도록 초대합니다. 그의 Q & A 스타일 대화에서 Buna는 Node.js의 내부에 대한 약간의 지식과 상식을 공유합니다.


Quokka.js를 사용하는 JavaScript의 반복자 [Mattias Petter Johansson] 



이 비디오에서 Mattias Petter Johansson (또는 Fun Fun Function의 "MPJ")은 for ... of 루프가 기본적으로 Iterator Design Pattern의 기본 JavaScript 구현 인 후드에서 작동하는 방식을 설명합니다.


Generators in JavaScript [Mattias Petter Johansson] 



MPJ는 반복자에 대한 이전 비디오의 코드 예제를 리팩터링하여 ES6 생성기가 반복자에 대한 "구문 설탕"인 방법을 보여줍니다.


Stream into the Future [Matteo Collina] 


스트림은 Node.js의 핵심 라이브러리 (파일 시스템 상호 작용, 데이터 압축 및 네트워킹)의 기초를 형성합니다. 이러한 모든 스트림은 하나 또는 여러 방식으로 스트림을 사용합니다. 스트림 기본 사항에 대한 간단한 충돌 과정을 마친 Matteo Collina는 Node.js에 대한 최신 업적을 소개합니다. 비동기 반복자를 사용하는 스트림 추상화입니다. for await ... of 루프를 사용하면 Collina가 대화에서 제시하는 불쾌한 메모리 누수와 함정에 대해 걱정할 필요 없이 스트림과 상호 작용할 수 있습니다.


Learning Functional Programming with JavaScript [Anjana Vakil] 



용어와 개념에 대해 밝고 영리한 유추를 사용하여 Anjana Vakil은 JavaScript와 관련된 모든 강력한 수학 용어가 없는 JavaScript의 기능적 프로그래밍에 대한 접근 가능한 소개를 제공합니다.


javaScript call apply and bind [techsith] 



JavaScript에서 "일류 시민"이라는 기능에 대한 아이디어는 종종 많은 초보자들에게 영향을 미칩니다. this 키워드의 뉘앙스와 혼합되면 이 모든 것이 JavaScript 전문 용어의 모호한 혼란이 됩니다. 이 비디오에서 "techsith"는 Function # call, Function # apply 및 Function # bind 메소드를 구분합니다. 그렇게 하면서 그는 이것을 완전히 이해하는 데 중요한 통찰력을 제공합니다.


Prototypes in JavaScript [Mattias Petter Johansson] 


Java 및 C ++와 같은 많은 전통적인 객체 지향 언어와 달리 JavaScript는 클래스가 부모로부터 속성과 메서드를 직접 상속하는 클래식 상속 모델을 구현하지 않습니다. 대신 JavaScript는 "prototypal inheritance"를 사용하는데, 여기서 JavaScript "classes"의 객체 인스턴스는 "prototype"객체에 대한 참조를 공유하고 보유합니다.


이것은 파악하기가 까다로운 개념입니다. 모든 것이 "클릭"되기까지는 오랜 시간이 걸렸지 만, 마침내 그렇게 되었을 때, 나는 객체 생성에 관한 MPJ의 일련의 비디오에 대해 많은 이해를 하였습니다. 위의 비디오는 프로토 타입 상속의 큰 그림을 더욱 공고히 하는 보충 자료로 사용되었습니다.


JavaScript Event Capture, Propagation and Bubbling [Wes Bos] 


이벤트 디스패치 및 처리 메커니즘은 HTML DOM의 필수 기능입니다. 이 비디오에서 Wes Bos는 "캡처 단계"및 "버블 단계"중에 이벤트가 "전파"되는 것이 무엇을 의미하는지 설명합니다. 각 단계를 활용할 시기를 알면 "이벤트 위임"및 기본 동작 취소와 같은 보다 강력한 이벤트 처리 기술이 가능합니다.


Fizz buzzkill - Answering tricky JS interview questions [Russell Anderson] 


노드 기본에 대한 Samer Buna의 Q & A 스타일 대화와 유사하게 Russell Anderson은 JavaScript 언어의 일부 기본 개념, 기술 및 숙어에 대한 일반적인 지식을 테스트합니다. 초보자에게 친숙하게 JavaScript 인터뷰 중에 필연적으로 발생할 수 있는 질문에 대한 답변을 제시합니다.


보안 노드 코드 작성 : 가장 일반적인 Node.js 보안 실수 이해 및 방지 [Guy Podjarny] 


JavaScript 에코 시스템은 공유 코드와 깊게 중첩 된 종속성에 크게 의존한다는 점을 감안할 때 우리는 배포하는 코드의 압도적 인 부분이 타사에서 나온다는 사실에 직면하고 있습니다. 이로 인해 생산성이 향상되고 개발 시간이 단축 될 수 있지만 응용 프로그램을 더 큰 공격 영역에 노출 시키는 것은 불행한 결과입니다. 이 강연에서 Guy Podjarny는 외부 코드와 관련하여 경계의 중요성과 주의에 대해 설명합니다.


JavaScript 메타 프로그래밍-ES6 프록시 사용 및 남용 [Eirik Vullum] 


ES6 프록시를 사용하면 언어의 다양한 측면을 가로 채어 연결할 수 있습니다. JavaScript의 새로운 메타 프로그래밍 시대는 더욱 강력한 폴리 필, 언어 확장 및 사용자 지정 동작의 문을 엽니다.


그러나 언어의 의미에 대한 광범위한 범위를 감안할 때 Eirik Vullum은 책임감 있게 프록시를 사용하도록 상기 시킵니다. 그의 연설은 프록시의 놀라운 가능성과 잠재적 남용에 대한 그와 같은 놀라운 벡터를 대조합니다.


귀하의 편의를 위해 이 동영상을 비공개 YouTube 재생 목록으로 편집했습니다. JavaScript에 대한 이해에 기여한 모든 비디오를 나열 할 수는 없지만 겸손한 비디오 목록에서 여전히 큰 가치를 찾을 수 있기를 바랍니다.



댓글목록 0

등록된 댓글이 없습니다.

웹학교 로고

온라인 코딩학교

코리아뉴스 2001 - , All right reserved.