분류 전체보기
-
react 1Javascript/React.js 2020. 1. 7. 10:32
npx create-react-app [project name] 단 한 줄의 명령어로 react web app을 설정할 수 있다. yarn node.js의 npm과 동일하다. yarn 대신 npm을 써도 무관하다. code [project folder] visual studio code를 실행할 수 있다. 출처 https://academy.nomadcoders.co Academy 우버 백엔드 + 프런트엔드 + 배포 [고급]Typescript, NodeJS, GraphQL, React, Apollo % Complete academy.nomadcoders.co
-
Single ThreadJavascript/Node.js 2020. 1. 6. 17:43
node.js node.js는 일반적으로 single thread 구조라고 알고있다. Event loop를 통해 하나의 thread만 받아서 실행하기 때문이다. 그러나, 해시 연산과 같은 CPU intensive한 작업들은 별도의 thread에서 처리한다. 설명 pdkdf2()라는 암호화 함수를 사용할 경우, 대략 1초가 소요된다. 이 작업을 2번 하게 될 경우에 2초가 소요되야 하지만, 똑같이 1초가 걸렸다. 이것은 별도의 thread에서 동시에 처리함을 의미한다. 출처 https://medium.com/@rpf5573/nodejs-nodejs는-single-thread가-아니다-f02b0278c390 [NodeJS] nodejs는 single-thread가 아니다 결론 medium.com
-
비동기Javascript/Node.js 2020. 1. 6. 17:36
비동기 특정 코드의 연산이 끝날 때까지 코드의 실행을 멈추지 않고 다음 코드를 먼저 실행하는 처리방식이다. 이런 방식으로 구동할 경우, idle time이 사라져 컴퓨터 자원을 최대한 사용할 수 있어 효율적이다. 그러나, 프로그래머가 원하는 순서대로 실행되지 않는 문제점이 발생한다. 콜백함수 코드가 순서대로 실행되지 않는 문제를 해소하기 위해 콜백함수가 탄생했다. 식당을 예약하듯이 우선 A(자리에 착석)라는 작업이 끝나야 B(음식 주문)를 실행할 수 있도록 한다. 마치 함수 안의 인자 안에 함수를 심은 모양새이다. Callback hell 위와 같은 형태를 callback hell이라고 부른다. 가독성이 떨어지고 로직을 변경하기 어렵다. 이를 해결하기 위한 두 가지 문법이 존재한다. promise pro..
-
RoutingJavascript/Node.js 2020. 1. 6. 17:25
라우팅 라우팅은 URI 및 특정한 HTTP 요청 메소드인 특정 엔드포인트에 대한 클라이언트 요청에 애플리케이션이 응답하는 방법을 결정하는 것을 말한다. 각 라우트는 하나 이상의 핸들러 함수를 가질 수 있으며, 이러한 함수는 라우트가 일치할 때 실행됩니다. 라우트 예시 package.json npm start를 실행하면, node ./bin/www가 실행 되는 것을 알 수 있다. www app 변수를 이용해 app.js를 가져오고, port를 지정하고 server를 구동하는 코드가 있다. app.js app.js에서 주목해야 할 곳은 app.use이다. index.js 파일은 '/'에 연결되고, users.js는 '/users'에 연결된다. index.js request를 받아서 method에 따라서 re..
-
Client-side Javascript 1Javascript 2020. 1. 3. 16:46
웹 브라우저 환경 - Window 객체 : 클라이언트 측 자바스크립트 코드를 위한 전역 객체와 전역 실행 컨텍스트 - DOM(Document Object Model) : 클라이언트 측 객체 계층 구조와 이 계층 구조의 일부를 이루는 문서 객체 모델 - 이벤트 구동 프로그래밍 모델 Window 객체 웹 브라우저의 주요 작업은 HTML 문서를 창에 출력하는 것이다. 클라이언트 측 자바스크립트는 Document 객체가 HTML 문서를 나타내며 Window 객체는 브라우저 창을 나타낸다. Document, Window 둘다 중요하지만 Window 객체가 클라이언트 측 프로그래밍에서 전역 객체 역할을 한다. 모든 전역 변수는 Window 객체의 프로퍼티로 정의된다. DOM Window 객체의 framse[] 배열..
-
모듈과 네임스페이스카테고리 없음 2020. 1. 3. 15:23
네임스페이스 만약 아무 스크립트에서나 사용될 수 있고 어떤 모듈과도 함께 사용될 수 있는 자바스크립트 모듈을 작성하고 싶다면, 여러분이 따라야할 가장 중요한 규칙은 바로 전역 변수를 정의하지 않는 것이다. 이를 위해 모듈에서 사용할 모든 메서드와 프로퍼티에 네임스페이스를 정의하는 것이다. 자바스크립트는 언어적으로 네임스페이스를 지원하지 않지만, 객체를 이용할 수 있다. 1 2 3 4 5 6 // 네엄스페이스로서 빈 객체를 생성한다. // 이 단일 전역 심벌은 다른 심벌들을 가지고 있게 된다. var Class {}; // 네임스페이스 안에서 합수를 정의한다. Class.define = function(data) { /* 코드는 여기에 */ } Class.provides = function(o , c) {..
-
클래스Javascript 2020. 1. 3. 14:37
모조 클래스 자바스크립트에서는 다른 언어와는 달리 실제 클래스를 지원하지 않는다. 대신 모조 클래스(pseudo class)를 정의할 수 있다. 모조 클래스는 프로토타입 객체나 생성자 함수를 사용해 구현할 수 있다. 지금부터는 클래스라는 단어를 그대로 사용하겠다. 생성자 new 연산자를 이용해 아무 프로퍼티도 없는 새 객체를 하나 생성하고 new 연산자 뒤에 있는 함수를 호출한다. 그리고 this 키워드가 새로 생성된 객체를 가리키게 한다. 생성자는 새로운 객체를 초기화하고, 객체에 있는 프로퍼티들에게 초기값을 할당한다. 1 2 3 4 5 6 7 8 9 10 11 // 생성지를 정의한다. // ’this'와 연관되어 있는 객체를 초기화하는 방법을 주의해서 보라. function Rectangle(w, h..
-
AWS region에 따른 속도 차이Today I Learned 2020. 1. 3. 10:47
문제 REST API 서버 구현을 완료하고 postman을 통해 request 한 결과, 2초 정도 소요되는 문제가 발생했다. DB 역정규화를 거쳐 JOIN과 Query의 개수를 최소화 해보았지만 효과는 미미했다. 해결 AWS EC2, RDS의 region이 오하이오 주에 있다는 것을 파악하고, 서울 지역으로 바꿀 경우 속도가 빨라질 것인가에 대한 조사를 시작했다. http://awsspeedtest.xvf.dk AWS Speed Test awsspeedtest.xvf.dk 위 웹 사이트에서 현재 PC에서 latency가 가장 적은 region를 확인할 수 있었다. 또한, EC2와 S3의 region이 다를 경우에 속도가 느려질 수 있다는 article을 읽었다. https://blog.overops.c..