2014년 11월 24일 월요일

비주얼스튜디오 2013 웹 익스프레스(Visual Sudio 2013 Web Express)와 node.js을 사용한 개발 #4

비주얼스튜디오 2013 웹 익스프레스(Visual Sudio 2013 Web Express)와 node.js을 사용한 개발 #4
 조회 : 233
나의 폴더 > ASP.NET MVC | 2014-01-21 (Tue) 14:57 http://blog.dreamwiz.com/papasmf1/14019803
RESTful한 웹서비스를 만들어 보도록 한다.
앞에서 설치하고 생성한 mySQL의 Company데이터베이스에 접속해서 products테이블의 리스트를 출력하고
수정과 삭제가 가능하도록 CRUD메서드를 준비한다.

다음과 같은 파일들이 필요한다. 

app.js      edit.html     insert.html  list.html 파일들이 필요하다.


혹시 작업하는 폴더에서 모듈에서 에러가 나면 npm link mysql npm link ejsnpm link express를 실행해 주면 된다.  
(app.js로 저장한다.)
//모듈을 추출한다.
var fs = require('fs');
var ejs = require('ejs');
var http = require('http');
var mysql = require('mysql');
var express = require('express');

//데이터베이스와 연결한다.
var client = mysql.createConnection({
    user: 'root',
    password: '1234',
    database: 'Company'
});;

//서버를 생성한다.
var app = express();
app.use(app.router);

//서버를 실행한다.
http.createServer(app).listen(52273, function () {
    console.log('Server running at http://127.0.0.1:52273');
});

//라우트를 실행한다.
app.get('/', function (request, response) {
    //파일을 읽는다.
    fs.readFile('list.html', 'utf8', function (error, data) {
        //데이터베이스 쿼리를 실행한다.
        client.query('select * from products', function (error, results) {
            //응답한다.
            response.send(ejs.render(data, {
                data: results
            }));
        });
    });
});
app.get('/delete/:id', function (request, response) {
    //데이터베이스 쿼리를 실행한다.
    client.query('delete from products where id=?', [request.param('id')], function () {
        //응답한다.
        response.redirect('/');
    });
});
app.get('/insert', function (request, response) { });
app.post('insert', function (request, response) { });
app.get('/edit/:id', function (request, response) { });
app.post('/edit/:id', function (request, response) { });

(list.html파일로 저장한다.)
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
</head>
<body>
    <h1>List Page</h1>
    <a href="/insert">INSERT DATA</a>
    <hr />
    <table width="100%" border="1">
        <tr>
            <th>DELETE</th>
            <th>EDIT</th>
            <th>id</th>
            <th>name</th>
            <th>model number</th>
            <th>series</th>
        </tr>
        <% data.forEach(function (item, index) { %>
        <tr>
            <td><a href="/delete/<%= item.id%>">DELETE</a></td>
            <td><a href="/edit/<%= item.id%>">EDIT</a></td>
            <td><%= item.id %></td>
            <td><%= item.name %></td>
            <td><%= item.modelnumber %></td>
            <td><%= item.series %></td>
        </tr>
        <% }); %>
    </table>
</body>
</html>
실행하면 아래와 같은 형태로 실행된다.


댓글 없음:

댓글 쓰기

참고: 블로그의 회원만 댓글을 작성할 수 있습니다.

'일론 머스크' '젠슨 황' AI 리더들, 그들의 성공 비결은 바로 이것 - 누가 부자가 되는가 영상입니다. ㅎㅎ

  책을 통해서만 접했던 내용들을 영상으로 보니 더 실감이 납니다. KBS에서 방송된 내용인데 주말에 보시면 좋은 영상입니다. 엔비디아의 주가가 이해가 됩니다. ㅋㅋ 생각보다 미국시장이 강한 것이 AI는 거의 미국과 중국이 주도하는 시장이 되고 있습...