본문 바로가기

JavaScript30

Middleware part 1. express 공식 문서 https://expressjs.com/ko/guide/writing-middleware.html Middleware functions are functions that have access to the request object (req), the response object (res), and the next function in the application’s request-response cycle. 미들웨어* 함수는 요청 오브젝트(req), 응답 오브젝트 (res), 그리고 애플리케이션의 요청-응답 주기 중 그 다음의 미들웨어 함수 대한 액세스 권한을 갖는 함수입니다 미들웨어 함수가 적용되는 HTTP 메소드. 미들웨어 함수가 적용되는 경로(라우트). 미들웨어 함수. 미들.. 2020. 2. 20.
Babel 최신 Javascript 코드( ES6 )를 클래식한 Javascript로 변경해주는 Javascript 트렌스 컴파일러 (transpiling) 최신 Javascript를 지원하지 않는 구형 인터넷 익스플로어(IE)에서도 문제없이 작동하도록 하기위해 사용 공식 페이지 https://babeljs.io/ 설치 npm install @babel/core @babel/node 터미널에서 npm을 이용하여 설치. 여기서는 node에서 사용 가능한 babel을 설치 npm install @babel/preset-env babel을 사용하기 위해서는 다양한 플러그인들이 필요하다. 이 플러그인들을 기본적으로 조합해서 묶어놓은 preset들이 있는데 Javascript의 일반적인 환경에서는 env 프리셋을 설치하면 .. 2020. 2. 20.
Express로 서버 만들기 공식페이지 https://expressjs.com/ko/ 기본 설정 const express = require('express'); //express 불러오기 const app = express(); //app 변수를 선언해서 express 실행하기 // respond with "hello world" when a GET request is made to the homepage app.get('/', function(req, res) { res.send('hello world'); }); 기본 라우팅의 예. require함수를 통해 'express' 라는 폴더를 찾는다. 처음에는 기존 파일들 중에서, 못 찾으면 node_modules 안에서. // express/index.js 파일 module.expo.. 2020. 2. 20.
<canvas> height와 width 렌더링 왜곡 문제 요소 는 처음에는 src 및 alt 속성이 없다는 점만 제외하면 요소처럼 보입니다. 실제로 요소에는 'width'와 'height'의 두 속성만 있습니다. 이것들은 모두 선택사항이며 DOM 프로퍼티를 사용하여 설정할 수도 있습니다. width 및 height 속성을 지정하지 않으면 캔버스의 처음 너비는 300 픽셀이고 높이는 150 픽셀입니다. 요소는 CSS에 의해 임의로 크기를 정할 수 있지만 렌더링하는 동안 이미지는 레이아웃 크기에 맞게 크기가 조정됩니다. CSS 크기 지정이 초기 캔버스의 비율을 고려하지 않으면 왜곡되어 나타납니다 . 노트: 만약 렌더링이 왜곡된 것처럼 보이는 경우 CSS를 사용하지 않고 속성에서 'width' 및 'height' 속성을 명시적으로 지정하십시오. MDN canvas .. 2020. 2. 19.