pyeongsaeng_dev

훨씬 보기좋은 ES6 문법 arrow functionconst handleListening = function handleListening(req,res){ console.log(`Listening on: http://localhost:${PORT}`);} const handleHome = function handleHome(req, res){ console.log(req); res.send("Hello from home");} ↓로 바꿀 수 있다. const handleListening = (req, res) => console.log(`Listening on: http://localhost:${PORT}`); const handleHome = (req, res) => { console.log(req)..

바벨이란? 최신의 Javascript코드를 예전의 Javascript코드로 변환해준다. 아래와같이 babel 3가지항목을 인스톨 해주자npm install @babel/corenpm install @babel/nodenpm install @babel/preset-env 설치항목에 대해서 참고할 수 있는 Documents들babel/preset-env 문서stage-0 문서 설치후.babelrc를 만들어준다 .babelrc에는 node.js와 js와 관련된 필요한 것들을 집어넣을예정이고 Babel이 실행되기 전에 이 파일을 찾아보고 설정해둔 preset을 읽고 이해하게된다. 즉 preset에 따라 코드가 변환된다. 마지막으로 이렇게 바꿔주자 기본 node index.js > babel-node index...

Express Server를 다루기위한 기초 이해 request, response 브라우저는 GET method를 실행해 브라우저가 페이지를 읽어온다. 서버가 응답하게 어떤 사람이 URL로 접근(GET)할때 응답하게 하려고한다. 서버가 하는 일은 응답하는것인데 하나는 request object 하나는 response object이다. (나머지 하나는 callback) 위에서 res.send("You are on my profile");코드를 쓰는데. 완전한 웹사이트를 만들기위해서는 sned안의 구문대신 완전한 HTML, CSS파일을 send해줘야 한다. 서버를 생성하고 route를 생성하고 응답하고 express와 node,js로는 단20줄이면 할 수 있다는 매력이 있음을 알아두자.

나만의 서버를 가져보기! Expess Sever expressjs라는 키워드로 홈페이지를 접속이가능하다ExpressJS홈페이지 링크 빨간박스에있는 내용을 복사해서 index,js에 붙여넣자.var 변수를 const(상수=변하지않는수)로 선언해줍니다 require의 의미는 node module 을 어딘가에서 가져오는것이고express라는 이름의 폴더를 내 파일들 속에서 찾을려고한다. 만약 못찾으면 node_modules에서 express 폴더를 찾는다.express안에도 require들이 많이있으며 다음과같이 있다.위와같이 node.js는 모든게 작은 블럭단위로 구성되어있음을 알 수 있다. app.listen(4000); 실행 후 먼가 출력되는것도 없고 아주 중요하게도 멈추는 것도 없다 localhost:..

비주얼스튜디오코드를 사용 했으며콘솔창여는방법은 [CTRL+SHIFT+` ] 입니다 . ExpressJS는 프레임워크이며몇줄의 코드로 서버를 만들 수 있다. 예시Django는 파이선으로 된 프레임워크Rails는 Ruby로 된 프레임워크Laravel은 PHP로 된 프레임워크서버를 개발하는건 대부분의 경우 거의 동일하기 때문이다. 커넥션을 열고커넥션을 listen해주고파일을 처리하고html 을 전송해주고데이터를 저장하고Form에서 데이터 받아오고 NPM = Node Package Manager 많은사용자가 Express를 쓰는걸 아래 사이트에서 볼 수 있다.NPMJS 사이트 가기[링크]NPM은 NodeJS를 깔면 기본적으로 깔려 있다. Package Manager로 NPM을 시작하려면 npm이 정한 방식으로 ..

노드JS설치 사이트다음다음다음windows키-cmd입력 후 엔터명령프롬프트에서 node -v를 해보면 자신의버전을 확인할 수있다.

var fs = require('fs'); //동기와 비동기의 차이 확인 //readFileSync console.log('A'); var result = fs.readFileSync('syntax/sample.txt', 'utf8'); console.log(result); console.log('C'); console.log('A'); //readFile은 sync에 비해 리턴값이 존재하지 않습니다. fs.readFile('syntax/sample.txt', 'utf8', function(err, result){ //err가 있다면 err를 인자로 제공 //2번째 파라미터는 파일의 인자를 쓰기로 약속 console.log(result); }); console.log('C'); nodejs 버전 8.11..

document.querySelector('#night_day').value = 'night' ; ID값이 night_day 의 value값을 night로 변경 *Tip 위 코드에서 더 발전한 코드들 및 설명 === 는 1===1 을했을경우 true 트루 1===2를 했을경우 boolean 블리언 onclick 이벤트태그의 적용범위가 자기자신이므로this를 대신하여 쓸수있다. document.querySelector('body')가 반복적으로 쓰이고 있다. 변수를 이용함으로써 중복을제거해보자

https://caniuse.com/ 들어가서 검색어에 grid를 쳐봅니다

공부하시거나 이태그가 어디까지 적용되는지 알고싶을때는하시면 아래와같이 block lavel element의 (공간을차지하는 태그)를 눈으로 쉽게볼수 있습니다.CSS border의 범위 CSS margin의 범위 CSS padding의 범위