2024년 공간정보 활용을 위한 Node.js 웹서버 프로그래밍 (1)

- ex01_01.js

console.log(`안녕하세요!`);

// 변수 
var name1 = '홍길동1'; // 예전에 사용하던 변수 선언
let name2 = '홍길동2'; // 변수 선언
const name3 = '홍길동3'; //상수(변경되지 않는 값)

name2 = '홍길동4' // 변수 상자의 값 변경
console.log(`name2 변수 상자의 값 : ${name2}`);

// 객체(변수 상자를 모아놓은 것)
let person1 = {
    name: '홍길동5',
    age: 21,
}
console.log(`person1 객체의 이름: ${person1.name}`) // 객체 안의 변수를 접근할 때는 . 연산자를 사용한다.
console.log(`person1 객체의 이름: ${person1['name']}`) // 위와 동일한 코드, . 연산자 외에 대괄호와 그 안에 변수의 이름(문자열)으로 접근할 수도 있다.

let varName = 'age';
let personName = person1[varName];
console.log(`사람 이름: ${personName}`);

// 함수 정의
function run() {
    console.log('달려갑니다.');
}
run(); // 함수 실행

// 함수 상자의 모양 변경 -> 화살표 함수
// 함수 상자를 변수 상자에 할당 : 함수를 일급 객체로 다룬다.
let run2 = () => {
    console.log('달려갑니다.');
}
run2();

// 객체 안에 변수 상자를 모아놓는데, 변수 상자에 함수상자를 할당할 수 있다.
// 객체 안에 변수상자, 함수상자가 들어갈 수 있는데, 변수상자와 함수 상자가 구분되지 않는다. -> 속성(attribute, property)
let person2 = {
    name: '홍길동6',
    run: function () { // 익명 함수
        console.log(`${this.name}이 달려갑니다.`);
    },
    walk: () => { // 화살표 함수는 this를 자기 자신으로 이해하지 못한다.
        // console.log(`${this.name}이 걸어갑니다.`);
        console.log(`${person2.name}이 걸어갑니다.`);
    } 
}

person2.run();
person2.walk();
console.log(`${person2.run}`)

// undefined : 자료형(type, 타입)이 결정되지 않았습니다.
// 자료형(type)은 변수상자에 처음으로 값이 할당될 때 결정된다.
let name4; // 선언만 했을 때
let name5 = '홍길동4'
console.log(`name4 변수상자의 값 : ${name5}, ${typeof(name5)}`);

 

- ex01_02.js

// 클래스(붕어빵 틀), 붕어빵 : 객체(변수, 함수를 모아둔 것, 속성을 모아둔 것)
// 클래스 정의하기 
class Person {

    // 생성자 함수
    constructor(name, age) {
        this.name = name; // name 변수 상자가 자동 생성, 파라미터로 넘어온 name값을 할당
        this.age = age; 
    }

    // class 안에서는 function 생략
    walk() {
        console.log(`사람 ${this.name}이 걸어갑니다`);
    }
}

// 클래스에서 객체 만들기(붕어빵 틀에서 붕어빵 찍어내기)
let person1 = new Person('홍길동6', 26);
console.log(`person1의 이름: ${person1.name}`);

person1.walk();
person1['walk']();

let person2 = new Person('홍길동7', 27);
let personInfo2 = JSON.stringify(person2);
console.log(`person2: ${JSON.stringify(personInfo2)}`); // 객체를 JSON 문자열로 만들어주기
console.dir(person2); // 객체 정보를 그대로 출력

let person3 = JSON.parse(personInfo2);
console.log(`person3의 이름: ${person3.name}`);

// 상속
class Student extends Person {

}

let student1 = new Student('학생1', 21); // 생성자 함수 상속
console.log(`student1의 이름 : ${student1.name}`);

let student2 = new Student('학생2', 22);

Student.prototype.mobile = '010-2000-2000'; //Student 클래스에 공통 속성 추가

student1.mobile = '010-1000-1000'; // 이미 만들어진 객체라도 속성 추가 가능 
console.log(`student1의 전화 번호: ${student1.mobile}`); 
console.log(`student2의 전화 번호: ${student2.mobile}`); // mobile이라는 속성에 대한 값이 없다.

 

- ex01_03.js

// 콜백 함수(Callback function)
// 함수를 변수에 할당할 수 있다. -> 함수의 파라미터로 함수를 전달할 수 있다.
// 함수의 위쪽, 아래쪽으로 값이 전달될 수 있는데 -> 이 값이 함수일 수 있다.

// 더하기 함수
function calc(a, b) {
    return a + b;
}

let result1 = calc(1, 3);
console.log(`더하기 1: ${result1}`);

function calc2(obj) {
    let result1 = obj(10, 10);
    console.log(`calc2 함수 안에서 더하기 결과 : ${result1}`);
}

let add = (a, b) => {
    return a + b;
}

let subtract = (a, b) => {
    return a - b;
}

calc2(add);

function calc3(obj, a, b) {
    return obj(a, b);
}

let result2 = calc3(subtract, 20, 10);
console.log(`calc3의 결과: ${result2}`);

function add2(a, b) {
    return a + b;
}

// 콜백함수
function add3(a, b, callback) {
    let result = a + b;
    callback(result);
}

add3(10, 10, (result) => {
    console.log(`더하기 결과 : ${result}`);
})

 

- ex01_04.js

// 비동기 (Async)

// 1. 더하기 함수에 대한 콜백 함수
function add1(a, b) {
    return a + b;
}

let result1 = add1(10, 10);
console.log(`더하기 결과 1 : ${result1}`)

let add2 = (a, b, callback) => {
    callback(a + b);
}

add2(10, 10, (result) => {
    console.log(`더하기 결과 2 : ${result}`);
})

// 시간차를 두고 실행해보기
setTimeout(() => {
    let result1 = add1(10, 10);
    console.log(`더하기 결과 1 : ${result1}`);
}, 1000);

let add3 = (a, b, callback) => {
    setTimeout(() => {
        callback(null, a + b);
    }, 500);
}

let divide3 = (a, b, callback) => {
    setTimeout(() => {
        if (b == 0) {
            console.error(`더하기 함수의 분모가 0입니다.`);
            callback(new Error());
        }
        callback(a / b);
    }, 1000);
}

// 나누기 실행 -> 더하기 실행 : 결과는 더하기 먼저 나오고 나누기가 출력됨
// 코드 실행 순서와 결과 실행 순서가 달라졌다.
let doCalc1 = () => {
    divide3(200, 10, (result) => {
        console.log(`doCalc1 함수 안에서 나누기 결과 : ${result}`);
    });

    add3(200, 100, (result) => {
        console.log(`doCalc1 함수 안에서 더하기 결과 : ${result}`);
    })
}
doCalc1();

// 나누기 코드 실행 후 더하기 코드를 실행 : 결과 (전제: add3, divide3 내가 고칠 수 없음)
let doCalc2 = () => {
    divide3(200, 10, (err, result) => {
        if (err) {
            console.log(`doCalc2 함수 안에서 나누기 에러: ${err}`)
            return;
        }
        console.log(`doCalc1 함수 안에서 나누기 결과 : ${result}`)

        add3(200, 100, (err, result2) => {
            if (err) {
                console.log(`doCalc2 함수 안에서 더하기 에러: ${err}`)
                return;
            }
            console.log(`doCalc1 함수 안에서 더하기 결과 : ${result2}`)
        });
    })
}
doCalc2();

// 프로미스(Promise)를 이용해서 함수를 감싸기
let addFunc = (a, b) => {
    return new Promise((resolve, reject) => {
        add3(a, b, (err, result) => {
            if (err) {
                reject(err);
                return;
            }
            resolve(result);
        })
    })
}

let divideFunc = (a, b) => {
    return new Promise((resolve, reject) => {
        divide3(a, b, (err, result) => {

            if (err) {
                reject(err);
                return;
            }
            resolve(err, result);
        })
    })
}

// async ~ await 역할: 언제 결과값이 넘어오는지 모를 때 순서대로 오게 해줌 
// async ~ await을 사용하면 promise가 반환되는 것이 아니라 promise의 결과값을 반환
let doCalc3 = async () => {
    try {
        let output1 = await divideFunc(200, 0);
        console.log(`doCalc3의 나누기 결과: ${output1}`);
    
        let output2 = await addFunc(output1, 100);
        console.log(`doCalc3의 더하기 결과: ${output2}`);    
    } catch(err) {
        console.log(`doCalc3 실행 시 에러: ${err}`)
    }
}
doCalc3();

 

- 실습

// 콜백 함수
let add = (a, b, callback) => {
    setTimeout(() => {
        callback(a + b);
    }, 300);
}

let subtract = (a, b, callback) => {
    setTimeout(() => {
        callback(a - b);
    }, 200);
}

let multiply = (a, b, callback) => {
    setTimeout(() => {
        callback(a * b);
    }, 400);
}

let divide = (a, b, callback) => {
    setTimeout(() => {
        callback(a / b);
    }, 100)
}

// Promise를 이용해서 함수 감싸기
let addFunc = (a, b) => {
    return new Promise((resolve, reject) => {
        add(a, b, (result) => {
            resolve(result);
        })
    })
}

let subtractFunc = (a, b) => {
    return new Promise((resolve, reject) => {
        subtract(a, b, (result) => {
            resolve(result);
        })
    })
}

let multiplyFunc = (a, b) => {
    return new Promise((resolve, reject) => {
        multiply(a, b, (result) => {
            resolve(result);
        })
    })
}

let divideFunc = (a, b) => {
    return new Promise((resolve, reject) => {
        divide(a, b, (result) => {
            resolve(result);
        })
    })
}

let doCalc1 = async () => {
    let result = 
    await divideFunc(
        await multiplyFunc(
            await subtractFunc(
                await addFunc(100, 200),
                20),
            3),
        5);
    console.log(`doCalc1의 결과: ${result}`);
}

doCalc1();

 

- server01_01.js

// 웹서버 만들기

const http = require('http');
const express = require('express');

const app = express();

// 미들웨어 추가
app.use((req, res, next) => {
    console.log(`첫번째 미들웨어 호출됨`);

    req.user = 'john';
    next();
})

app.use((req, res, next) => {
    console.log(`두번째 미들웨어 호출됨 : ${req.user}`);

    res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
    //res.end(`<p>웹서버로부터의 응답</p>`);

    res.end(`<!DOCTYPE html>
     <html>
       <head>
       </head>
       <body>
         <p>웹서버로부터의 응답</p>
       </body>
     </html>`);

})


http.createServer(app).listen(7001, () => {
    console.log(`웹서버 실행됨.`);
})

console.log(`웹서버 실행 요청됨.`);

 

- server01_02.js

// 라우터

const http = require('http');
const express = require('express');

const app = express();
 

const router = express.Router();
app.use('/', router);

router.route('/list').get((req, res) => {
    console.log(`/list 요청 경로로 요청됨`);

    const person1 = {
        name: '홍길동1',
        age: 21
    }

    res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
    res.end(JSON.stringify(person1));

})

router.route('/add').get((req, res) => {
    console.log(`/add 요청 경로로 요청됨`);

    res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
    res.end('OK');
})


http.createServer(app).listen(7001, () => {
    console.log(`웹서버 실행됨.`);
})

console.log(`웹서버 실행 요청됨.`);

 

- server01_03.js

// DB 연결하기

const http = require('http');
const express = require('express');
const mariadb = require('mariadb');
const bodyParser = require('body-parser');

const pool = mariadb.createPool({
    host: '127.0.0.1',
    port: 3306,
    user: 'root',
    password: 'admin',
    database: 'test',
    connectionLimit: 10,
    debug: false
});

const app = express();
 
app.use(bodyParser.urlencoded({extended: false}));
app.use(bodyParser.json());

const router = express.Router();
app.use('/', router);

router.route('/list').get(async (req, res) => {
    console.log(`/list 요청 경로로 요청됨`);

    let conn;
    try {
        conn = await pool.getConnection();
        const rows = await conn.query(`select id, name, age, mobile from test.person`);
 
        res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
        res.end(JSON.stringify(rows));
    } catch(err) {
        res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
        res.end(`웹서버에서 DB처리 시 에러 : ${err}`);
    } finally {
        if (conn) conn.release();
    }

    /*
    let conn = await pool.getConnection();
    const rows = await conn.query(`select id, name, age, mobile from test.person`);

    if (conn) {
        conn.release();
    }

    res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
    res.end(JSON.stringify(rows));
    */
})

router.route('/list').post(async (req, res) => {
    console.log(`/list 요청 경로로 요청됨`);

    let conn;
    try {
        conn = await pool.getConnection();
        const rows = await conn.query(`select id, name, age, mobile from test.person`);
 
        res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
        res.end(JSON.stringify(rows));
    } catch(err) {
        res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
        res.end(`웹서버에서 DB처리 시 에러 : ${err}`);
    } finally {
        if (conn) conn.release();
    }
 
})

router.route('/add').get(async (req, res) => {
    console.log(`/add 요청 경로로 요청됨`);

    const params = req.query;

    let conn;
    try {
        conn = await pool.getConnection();
        //const output = await conn.query(`insert into test.person(name, age, mobile) values ('${params.name}', ${params.age}, '${params.mobile}')`);
        const output = await conn.query(`insert into test.person(name, age, mobile) values (?, ?, ?)`, [`'${params.name}'`, `${params.age}`, `'${params.mobile}'`]);
        console.log(`DB 응답 : ${output.affectedRows}`);

        res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
        res.end(`추가 결과 : ${output.affectedRows}`);
    } catch(err) {
        res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
        res.end(`웹서버에서 DB처리 시 에러 : ${err}`);
    } finally {
        if (conn) conn.release();
    }

})

router.route('/add').post(async (req, res) => {
    console.log(`/add 요청 경로로 요청됨`);

    const params = req.body;

    let conn;
    try {
        conn = await pool.getConnection();
        //const output = await conn.query(`insert into test.person(name, age, mobile) values ('${params.name}', ${params.age}, '${params.mobile}')`);
        const output = await conn.query(`insert into test.person(name, age, mobile) values (?, ?, ?)`, [`'${params.name}'`, `${params.age}`, `'${params.mobile}'`]);
        console.log(`DB 응답 : ${output.affectedRows}`);

        res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
        res.end(`추가 결과 : ${output.affectedRows}`);
    } catch(err) {
        res.writeHead(200, {'Content-Type':'text/html;charset=utf8'});
        res.end(`웹서버에서 DB처리 시 에러 : ${err}`);
    } finally {
        if (conn) conn.release();
    }

})


http.createServer(app).listen(7001, () => {
    console.log(`웹서버 실행됨.`);
})

console.log(`웹서버 실행 요청됨.`);