ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • mysql - 글 등록하기
    JavaScript/Node.js 2018. 11. 28. 16:41

    mysql - 글 등록하기

    이번에는 웹 애플리케이션에서 글을 작성하고 데이터 베이스에 추가하는 방법을 알아보자.


    /topic 페이지에 접속하면 글을 등록하는 add버튼을 표현한다.

    add버튼을 클릭하면 글을 등록할 수 있는 폼이 나타나고 글을 작성하면 작성한 글로 이동시켜주는 기능을 만들어보자.




     라우트 작성하기

    글을 등록할 폼을 보여주기 위해 새로운 페이지를 작성할 것이다.

    페이지의 형식은 view.pug페이지를 기반으로 글 목록을 보여주고 아래에 작성 태그들을 보여줄 것이다.

    글 목록을 보여주기 위해 topic테이블을 조회한다.

    테이블 조회가 정상적으로 이루어지면 add페이지를 렌더링한다.




     HTML 템플릿 작성

    views_mysql 하위에 add.pug 파일을 생성한다.

    해당 페이지를 글 등록 페이지로 사용할 것이다.

    글 목록을 보여주는 코드는 view.pug 페이지의 코드와 동일하다.

    이후 form태그를 생성하고 글을 등록할 수 있는 태그들을 작성한다.




     글 등록 프로세스 작성

    글 데이터들을 데이터베이스로 처리하는 로직을 만들어보자.

    add.pug에서 form태그에 데이터들을 묶어 POST 메소드로 전달한다.

    따라서 post()라우트로 작성한다.

    폼 데이터로 전달된 데이터들을 각각의 변수에 담고 INSERT쿼리문을 작성하여 변수에 담은 데이터들을 치환자로 대입한다.

    쿼리가 정상적으로 처리되었을 경우 등록한 글의 상세보기 페이지로 리다이렉션 보낸다.


    insert쿼리를 수행하면 OkPacket이 rows(코드 상에선 result)에 담겨 리턴되는데 해당 객체 안에는 insertId라는 값이 존재한다.

    이 값은 실제 테이블의 id와 매칭되는 값이므로 이를 활용해서 리다이렉트 보낼 주소에 파라미터로 추가해준다.




     실행

    서버를 실행하고 /topic URL로 접속한다음 add버튼을 클릭해 새로운 글 내용을 작성하고 등록해보자.

    글을 작성하면 해당 글이 등록되며 글의 상세보기 페이지로 이동되는 것을 알 수 있다.

    'JavaScript > Node.js' 카테고리의 다른 글

    mysql - 글 삭제하기  (0) 2018.11.30
    mysql - 글 수정하기  (0) 2018.11.29
    mysql - 글 상세내용 출력하기  (0) 2018.11.28
    mysql - 글 목록 출력하기  (0) 2018.11.27
    mysql - mysql 사용하기  (0) 2018.11.27
Designed by Tistory.