Back-End (116) 썸네일형 리스트형 Node.js.31.App 제작-글생성 UI 만들기 리스트 아래에 글쓰기 버튼을 만들어보자. create 버튼을 누르면 localhost:3000/create 페이지로 이동한다. 이제 createServer내에서 pathname이 필요하다. 확인하기 위해 pathname을 콘솔로 찍어보자. pm2 log 를 입력하여 콘솔이 찍힌 것을 본다. 리로드하면 다음과 같이 홈과 HTML, CSS, JavaScript를 눌렀을 때에는 pathname으로 /가 콘솔되고, create버튼을눌렀을 때에는 pathname으로 /create가 콘솔되는 것을 확인할 수 있다. 이제 if(pathname === '/') 블럭 아래에 else if(pathname === '/create') 블럭을 생성하여 작성한다. 눌렀을 때 body부분에서 h1과 리스트는 동일하게 띄우지만, .. Node.js.30.HTML-form 현재까지는 data 폴더에 파일을 생성하면 파일을 감지하여 목록을 만들어주고, 또 우리 대신 HTML 코드를 생성해주는 웹 애플리케이션을 만들었다. 하지만 data 폴더에 접근할 수 있는 것은 자기 자신 뿐이므로, 컨텐츠 생성하는 것은 사이트 소유자만 할 수 있다는 한계가 있다. 우리는 누구나 모두 웹에 접속하여 데이터를 전송하고, 전송한 데이터를 data 디렉토리 안에 생성하고 싶다. 앞으로 사용자가 컨텐츠를 웹을 통해 생성, 수정, 삭제하는 방법을 알아보자. HTML-form 사용자가 서버로 데이터를 전송하는 방식 한 줄 입력하기 여러 줄 입력하기 전송버튼 데이터를 전송하기 위해서는, 정보를 어디로 보낼 것인지 주소가 필요하다. 또한 입력한 각 값들에 이름이 있어야만 서버에서 받았을 때 의미가 있다... Node.js.29.Node.js의 패키지 매니저와 PM2 Package Manager Package: =소프트웨어. 소프트웨어들을 생성, 설치, 업데이트, 관리, 삭제해주는 프로그램 운영체제마다 중요한 역할을 함 NPM Nodejs에서 가장 광범위하게 사용하는 PM 파일(코드)이 수정될 때마다 자동으로 프로그램을 껐다켜줌 (이전에는 일일이 귀찮게 껐다켜줬었음) PM2 - Home Advanced process manager for production Node.js applications. Load balancer, logs facility, startup script, micro service management, at a glance. pm2.keymetrics.io Advanced, production process manager for Node.js : .. Node.js.28.3.JavaScript-callback callback Non-Blocking Code. 비동기. 프로그램이 함수가 끝날 때까지 기다리지 않고, 바로 그 아래에 있는 코드들을 실행한다. 그 다음에 함수에 있던 작업이 모두 끝나면 콜백함수를 호출한다. (1) 함수 function a(){ console.log('A'); } a{};//A (2) 익명함수 (anaymnous function) 예제 //익명함수 (함수가 값임) var a = function (){ console.log('A'); } a();//A 익명함수 + callback함수 -1- var a = function (){ console.log('A'); }); } function slowfunc(callback){ //엄청 느리게 동작하는 함수 console.log('1'); ca.. Node.js.28.2.Nodejs에서 동기와 비동기 2 Nodejs 공식 홈페이지에서 fs 모듈에 다음과 같은 함수들이 있다. 하지만 둘러보면 뒤에 Sync가 붙어있는 것과 붙어있지 않은 것이 있다. readFile과 readFileSync을 보면 readFile은 callback이 있지만, readFileSync은 없다. 이를 통해 동기와 비동기의 차이를 알아보자. readFileSync(동기) - 순차적 실행 return값을 준다 //readFile & readFileSync var fs = require('fs'); //readFileSync - syntax바깥에서 명령을 줄 것이기 때문에 syntax/sample.txt로 작성함 console.log('A'); var result = fs.readFileSync('syntax/sample.txt', '.. Node.js.28.1.Nodejs에서 동기와 비동기 1 synchronous(동기) & asynchronous(비동기) 동기: 작업이 끝날 때까지 기다렸다가 다음 일을 하는 것 비동기: 일을 다른이에게 맡겨놓고 끝나기 전까지 다른 일을 처리하는 것 (동시처리) 비동기는 효율적이지만 매우 복잡하다. 따라서 Nodejs를 이용하여 코딩하는 게 초보자에겐 까다로울 수도 있다. Node.js.27.수업의 정상 program programming programmer JavaScript Node.js Web Application 앞으로 복잡하고 어려운 문제를 해결하는 공부를 한다 ! Node.js.26.App 제작-함수를 이용해서 정리 정돈하기 현재 main.js에서 if문과 else문 내에 여러 코드가 겹친다. 이를 함수화하여 코드를 정리하자. var http = require('http'); var url = require('url'); var fs = require('fs'); function templateHTML(title, list, body) { var template = ` WEB ${list} ${body} `; return template; } function templateList(filelist) { var list = ''; var i = 0; while(i < filelist.length) { list = list + `${filelist[i]}`; i++; } list = list + ''; return list; }.. 이전 1 ··· 8 9 10 11 12 13 14 15 다음