AimHo

Node란 무엇인가? 서버 Node를 통해 다양한 자바스크립트 애플리케이션을 실행할 수 있지만, Node는 서버 애플리케이션을 실행하는 데 제일 많이 사용됨 서버? 네트워크를 통해 클라이언트에 정보나 서비스를 제공하는 컴퓨터 or 프로그램 클라이언트란 요청을 보내는 주체로, 브라우저 일 수도 있고, 데스크톱 프로그램일 수도 있고, 모바일 앱일 수도 있고, 다른 서버에 요청을 보내는 서버 일 수도 있음 ex) 웹사이트 주소 입력 (요청) ⇒ 브라우저는 그 주소에 해당하는 컴퓨터 위치를 파악하고, 웹사이트 페이지를 받아와서 클라이언트에 띄워줌 (응답) 자바스크립트 런타임 런타임? 위키: 컴퓨터 프로그램이 실행되고 있는 동안의 동작 가상 머신: 자바스크립트를 웹 브라우저 바깥의 환경에서 돌아갈 수 있게 하는 ..

# 상황 1. 수백개의 matrix4x4와 그리고 수백개 * 4의 Vector2 데이터가 glBuffer에 업데이트 되어야함. 2. glMapBuffer와 glBufferSubData 둘 중에서 어느 것이 속도면에서 이득인가? # 선결론 데이터의 개수가 수백, 수천개든 glBufferSubData로 한방에 업데이트하는게 2배 정도 빠름 그러나, 데이터를 한개 씩, offset을 이용하여 glBufferSubData에 넣는것도 그다지 느리지 않았음. glMapBuffer에 비해 1.7배 정도 빠름 차이점이라면, 한방에 업데이트하기 위해선 별도의 cpu 버퍼에 담아두어야 했고, 후자는 별도의 cpu 버퍼가 필요치 않다 정도.. # 그렇다면, 항상 glBufferSubData가 빠른가? buffer의 종류에 ..

리액트 교과서 4장 / React 컴포넌트의 상태 객체 주제 react component의 state 객체에 대한 이해 state 객체를 다루는 법 state객체와 props의 비교 상태를 가진 component와 상태를 가지지 않는 component 서론 앞(1,2,3 장)에서는 속성(props)을 변경하여 뷰(view)를 갱신했음 하지만 속성은 현재 컴포넌트 내부에서는 수정할 수 없음 (속성은 해당 컴포넌트 생성 시에 전달받는 값이기 때문) 그러면 사용자 입력에 따른 뷰의 상태변화는 어떻게 처리해야 할까? React component의 상태(state) 객체를 이용하면 가치있고 상호작용이 뛰어난 애플리케이션을 만들 수 있다. 상태는 React component에 data를 저장하고 data의 변경에 ..

리액트 교과서 1, 2, 3장 / React 살펴보기 서론 React는 효율적인 프론트엔드 개발을 위한 새로운 방법을 제시했다. React는 강력한 UI 라이브러리이며 Facebook, Netflix, Airbnb 같은 유명 기업들도 React를 기반으로 성공을 거두었다. JavaScript로 만든 React 컴포넌트는 웹 사이트 어디서든 UI를 재사용 할 수 있다. 물론 React의 접근법이 완전히 새로운 것은 아니다. 컴포넌트로 UI를 구성하는 방법을 사용한 지는 오래되었지만, React는 최초로 템플릿 없이 순수하게 JavaScript만으로 이것을 가능하게 했다. 그리고 이 방법이 유지보수와 재사용, 확장에 좀 더 용이하다는 사실도 입증했다. React란 무엇인가? React는 UI 컴포넌트 라이브..

인프런 / [무료] 자바스크립트로 알아보는 함수형 프로그래밍 / 섹션1.함수형 프로그래밍 정의, 순수함수함수형 프로그래밍의 정의들 (마이클 포커스 [클로저 프로그래밍의 즐거움])- 함수형 프로그래밍은 어플리케이션, 함수의 구성요소, 더 나아가 언어 자체를 함수처럼 여기도록 만들고, 이러한 함수 개념을 가장 우선순위에 놓는다.- 함수형 사고방식은 문제의 해결 방법을 동사(함수)들로 구성(조합)하는 것 함수형 프로그래밍: 성공적인 프로그래밍을 위해 부수 효과를 미워하고 조합성을 강조하는 프로그래밍 패러다임.- 부수효과 > 순수함수를 만든다.- 조합성을 강조 > 모듈화 수준을 높인다. 순수함수: 값을 다루거나 변형할 때 외부의 값(인자 or 변수 값)들을 변경하지 않으면서 값을 다루는 함수.- ex) func..

Sass란??Sass 공식 문서를 살펴보면 'CSS에 우아함을 더해주는 확장 언어이다.' 라고 스스로를 묘사하고 있습니다. CSS는 배우기에는 매우 간단하지만, 여러 스타일을 지정하다보면 코드가 지저분해지기 쉽습니다. 코드의 양이 많을 수록 더욱 그렇죠하지만, Sass는 최대한 CSS의 기능을 유지하면서 부족한 부분만을 도와줍니다 그래서 Sass는 CSS를 사용하던 사람들이 배우기에 어렵지 않습니다. 그저 몇 가지 기능만 추가해서 사용하면 됩니다. Sass or SCSSSass라고 검색을 하면 보통 SCSS도 같이 검색이 됩니다. 두 가지 모두 같은 기능을 갖고 있습니다. 차이는 그저 미관상의 문제인데, Sass는 스타일을 적용할 때 중괄호, 세미콜론 그리고 들여쓰기에 의존하여 간결하고 짧은 코드를 작성..

MyEtherWallet(마이이더월렛) 생성 방법지갑 생성 방법 MyEtherWallet(https://www.myetherwallet.com)은 코인거래를 직접하거나 ICO투자, 블록체인을 공부하시는 분들은 쉽게 접할 수 있는 사이트인데, 아무래도 해외사이트이다 보니 지갑을 생성하는데 어려움을 겪는 사람들이 많은 것 같아 도움을 주기 위해 포스팅을 한다. (주의: 사이트 주소를 비교해서 맞는지 확인하고 진행할 것 / 피싱사이트 많음) 사이트에 접속하면 이런 화면이 나온다. 해외 사이트라 어렵다고 여기는 분들이 많은데, 이더리움 심볼 옆에 보면 언어를 변경할 수 있는 버튼이 있다. 영어에 거부감을 느끼는 사람들은 한국어로 바꿔서 진행하자. Enter a password 밑의 textarea에 자신이 기억..

SideProject #1 Todo-list앞으로 일주일에 한~두개 씩 큰 작업이든 작은 작업이든 상관 없이 SideProject를 하려고 한다. 공부하면서 그냥 강의들을 따라 하는 것 보단 이렇게 뭔가를 제작하는게 더 도움이 된다는 걸 느껴서... 아무튼 유투브에서 어느 프로그래머의 영상을 보다가 자바스크립트 공부를 마쳤으면 다른 프레임워크들을 사용하기전에 자바스크립트만 이용해서 무언가 만들어보라고 한 말이 생각나서 첫번째 SideProject로 todo-list를 제작해보았다. 디자인은 정말 심플하다. (디자인 감각이 부족해서...)처음에 타이틀로 'Todo-List'라고 되어있고 아래 버튼이 4개 있는데 3개는 필터 역할을 하는 버튼이고 1개는 list를 추가하는 버튼이다. 버튼 밑에는 list와 ..

Bootstrap 소개 장단점 및 설치방법 Bootstrap 이란?"부트스트랩은 반응형이며 모바일 우선인 웹프로젝트 개발을 위한 가장 인기있는 HTML, CSS, JS 프레임워크입니다." 이 내용은 부트스트랩 홈페이지 메인에 나와있는 내용이다. 쉽게 말하자면 미리 정의된 HTML, CSS, JS(javascript)를 모아놓은 것이다. 버튼, 프로그래스바, 캐러셀 등 많은 것들이 미리 정의되어 있기 때문에 부트스트랩 클래스에 대해 빠삭하다면 아래 블로그 정도는 순식간에 제작할 수 있다. [사진을 클릭하시면 사이트로 이동합니다] Bootstrap 장단점위에 언급했지만, 부트스트랩의 가장 큰 장점은 그 내부의 클래스들만 알고 있다면 빠르고 쉽게 여러형태의 웹 페이지를 제작할 수 있다. 그리고 대부분은 각 해..

[비트코인 현상 블록체인 2.0] 2: 비트코인의 시작비트코인 제작자와 비트코인을 수신 받은 첫 번째 사람 이야기2008년 10월 31일 암호학 전문가 및 아마추어 등 관련자 수백 명이 사토시 나카모토(Satoshi Nakamoto)라는 이에게 메일을 한 통 받았다. 그는 "저는 신뢰할 만한 제3자 중개인이 전혀 필요 없는, 완전히 당사자 간 1:1로 운영되는 새로운 전자 통화 시스템(비트코인)을 연구해오고 있습니다."라는 문구와 9페이지짜리 백서(white paper)의 링크를 함께 보냈다. 나카모토의 연구를 검토하기 위해 초대된 연구자 커뮤니티 중에 사이퍼펑크(Cypherpunk) 운동가들도 있었다. 사이퍼펑크는 테크니션 마인드를 가진 활동가들로 구성된 일종의 연합체이다. 사이퍼펑크 사람드에게 익명 ..