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>
실행하면 아래와 같은 형태로 실행된다.


댓글 없음:

댓글 쓰기

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

안드레이 카파시의 바이브 코딩 - 소프트웨어 3.0의 시대 영상입니다.

요즘 바이브 코딩이라는 단어가 유행입니다. 아래의 영상에서 공개되었군요. ㅎㅎ  최근에 가장 핫한 언어는 영어입니다. ㅎㅎ 사람의 말을 알아 듣는 LLM은 일종의 OS로 볼 수 있습니다.    https://www.youtube.com/watch?v=...