vidigummy KAU/혼자하는 Web 공부(Front)

Node.js 와 TypeScript 그리고 Nest.js 두번째 (1/18 ~ 2/9)

vidi 2021. 2. 9. 19:42

www.a-mean-blog.com/ko/blog/MEAN-Stack/%EA%B0%9C%EB%B0%9C-%ED%99%98%EA%B2%BD-%EA%B5%AC%EC%B6%95/Git-GitHub-%EA%B0%84%EB%8B%A8-%EC%82%AC%EC%9A%A9%EB%B2%95  


 

MEAN Stack/개발 환경 구축: Git, GitHub 간단 사용법 - A MEAN Blog

Git Bash Git 설명에 앞서 git bash 및 간단한 리눅스 명령어를 익혀봅시다. 구글에서 자료를 찾으면 대부분의 터미널 명령어가 Bash 기준으로 나오기 때문에 Windows를 사용하는 분들은 기본프로그램인

www.a-mean-blog.com

이 분의 블로그를 따라갔다. 하지만 mysql이 아닌 mongo를 사용하고 계시기도 하고 짧고 빠르게 넘어가기 위해서 주소록 만들기에서 그쳤으며, 이걸로 대충의 연습은 되었다. 지금은 막 수정하다가 에러가 나 버리는 코드지만 대충은 맞을거다.

프론트는 뭐 대단한게 필요한 것이 아니라서 ejs를 사용했다. 이 정도만 해도 알아볼 수 는 있으니 큰 문제는 없다.

 

1. 초기 설정

 

일단 git bash 의 사용은 필수적이라서...

git bash 를 설치해준다.

https://git-scm.com/

 

Git

 

git-scm.com

로 이동해 준 후 운영체제에 맞는 bit을 설치해 준다.

gabii.tistory.com/entry/Git-Git-Bash-219-%EC%84%A4%EC%B9%98%ED%95%98%EA%B8%B0

 

[Git] Git Bash 2.19 설치하기

이번 포스팅은 Windows에서 Git을 사용하기 위한 Git Bash 2.19 버전을 설치해보겠습니다. 우선 Git Bash 설치파일을 받기 위해 공식 홈페이지인 https://git-scm.com/ 으로 이동해주세요. 우측 하단의 Downlo..

gabii.tistory.com

참고 블로그 

 

설치가 완료된 후 실행해 보면 

이런 화면이 뜰거다. 잘 된거다.

그럼 

$ cd c/
$ mkdir workspace
$ cd worksapce

를 git bash 에서 입력해주고

 

다시 브라우저를 켜서 node.js를 설치해준다.

http://www.nodejs.org

 

web-front-end.tistory.com/3

 

npm 소개와 설치 (About Node Package Manager)

npm(Node Package Manager) ? node.js에서 빠질 수 없는게 npm인데 사실 저 같은경우는 bower 및 grunt를 사용하기 위해 npm을 그러면서 자연스럽게 node.js를 접하게 되었다. node.js가 빠른 발전을 할 수 있었..

web-front-end.tistory.com

참고

 

node.js 설치가 완료되면 git bash에서 npm -v를 쳐보자. node.js와 npm은 같이 설치된다.

잘 되면 잘 된거다.

 

다시 git bash로 돌아가자....

 

git을 당신의 아이디로 사용하기 위해

$ git config --global user.name "사용자이름"
$ git config --global user.email "사용자 이메일"

을 작성해서 당신의 계정과 연동시키고, 깃허브 홈페이지에 들어가 당신의 repositiories를 만들어주도록 하자.

 

그리고 

$ git init
$ git add .
$ git commit -m "메세지"
$ git remote add origin [레포지토리 주소]
$ git push -u origin master

 

을 하여 git과 연동시켜준다. 안 되면 

www.a-mean-blog.com/ko/blog/MEAN-Stack/%EA%B0%9C%EB%B0%9C-%ED%99%98%EA%B2%BD-%EA%B5%AC%EC%B6%95/Git-GitHub-%EA%B0%84%EB%8B%A8-%EC%82%AC%EC%9A%A9%EB%B2%95

 

MEAN Stack/개발 환경 구축: Git, GitHub 간단 사용법 - A MEAN Blog

Git Bash Git 설명에 앞서 git bash 및 간단한 리눅스 명령어를 익혀봅시다. 구글에서 자료를 찾으면 대부분의 터미널 명령어가 Bash 기준으로 나오기 때문에 Windows를 사용하는 분들은 기본프로그램인

www.a-mean-blog.com

여길 확인해보길 바란다. 이거면 됐다.

 

2. Node-mysql 연동

이게 제일 힘들었다.

물론 다른건 거의 안 해도 되는 식이긴 했지만... 뭐 어쨌든...

 

적당한 위치에 당신의 node.js 디렉토리가 있을거다. (workspace)

그럼 거기서

$ npm init --yes
$ npm install express mysql

를 해주고

{
  "name": "contact-book",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "body-parser": "^1.19.0",
    "ejs": "^3.1.5",
    "express": "^4.17.1",
    "method-override": "^3.0.0",
    "mysql": "^2.18.1"
  }
}

 

를 package.json에 넣어준다.

 

그리고 index.js 파일에

var mysql = require('mysql');

var connection = mysql.createConnection({
  host : 'localhost',
  user : 'root',
  password: '< MySQL password >',
  database: 'connect_book'
});

 

이런 식으로 넣고 쓰면 된다! 참 쉽다.

var port = 3000; // 사용할 포트 번호를 port 변수에 넣습니다.

app.listen(port, function(){ // port변수를 이용하여 3000번 포트에 node.js 서버를 연결합니다.
  console.log('server on! http://localhost:'+port); //서버가 실행되면 콘솔창에 표시될 메세지입니다.
});

app.get('/', function(req, res){
  res.redirect('/contacts');
});
// Contacts - Index // 7

app.get('/contacts', function(req, res){
  var sql = 'SELECT DISTINCT name, phone, email FROM book';
  connection.query(sql,function(err,rows,fields) {
    if(err){
      console.log("can't!");
    }else{
        res.render('contacts/index', {rows:rows});
    }
  });
});

app.get('/contacts/:name', function(req, res){
  var name = req.params;
  var sql = "SELECT * FROM book WHERE name = ?";
  var params = [name.name];
  connection.query(sql,params,function(err,rows,fields) {
    if(err){
      console.log("fuck you");
    }else{
        res.render('contacts/show', {rows:rows});
    }
  });
});

app.get('/contacts/:name/edit', function(req, res){
  var name = req.params;
  var sql = "SELECT * FROM book WHERE name = ?";
  var params = [name.name];
  connection.query(sql,params,function(err,rows,fields) {
    if(err){
      console.log("fuck you");
    }else{
        res.render('contacts/edit', {rows:rows});
    }
  });
});

app.put('/constacts/:name', function(req, res){

});


// Contacts - New // 8
app.get('/contacts/new', function(req, res){
  res.render('contacts/new');
});


// Contacts - create // 9
app.post('/contacts', function(req, res){
  var sql = "INSERT INTO book (name, email, phone) VALUES(?, ?, ?)";
  var params = [req.body.name, req.body.email, req.body.phone];
  connection.query(sql, params, function(err, rows, fields){
  	if(err){
  		console.log(err);
  	} else {
  		res.redirect('contacts');
  	}
  });
});

필요한 post, get은 좀 썼는데 put을 못 넣겠다. 화난다.