본문 바로가기

웹개발3

웹개발 - 10 Ajax 사용하여 Modal 띄우기 이거만 하는데 오늘 하루 종일 걸린 것 같다... 벌써 5시다.... 오늘 한거는 Ajax 함수를 사용해서 Json 형식으로 데이터를 요청해 Modal에 정보를 띄우는 것 까지 했다. 이 과정에서 진짜 온갖 오류 다 만나고 별 고생을 했다... 후 그래도 도움은 된 것 같다. 일단 완성된 화면은 이렇다. 모달로 현재 DB에 저장되어 있는 Jam 게시물의 title과 description 필드를 출력했다. 모달을 띄우기 위해서는 모달 UI를 지정하는 ejs 파일과, 모달에 띄울 내용을 비동기로 가져오는 ajax 코드의 js 파일 두개가 필요하다. 먼저 모달 UI를 지정하는 ejs 파일은 이렇게 생겼고, views 폴더 밑에 저장했다. 그리고 이걸 jam 페이지에 띄워야 하니까 jam.ejs에 include.. 2021. 11. 16.

웹개발 - 6 마이페이지, 회원정보 수정 오늘 기능 구현 좀 많이 한듯? 오늘 새롭게 API 나가려다가 그냥 기본적인 기능부터 다 해 놓고 넘어가야할 것 같아서 CRUD 기능부터 다 추가해버렸다. 아직 Delete는 못했고 오늘은 Update기능을 넣었다. 나중에 게시물 쓰고 삭제하고 하는 기능도 다 어차피 회원가입이랑 비슷한 구조로 실행되기 때문에 이걸 완벽하게 해놓고 넘어가려고 한다. 암튼 일단 마이페이지는 이렇게 생겼다. 먼저 userController.js에 show, showMypage 라는 두개의 액션을 추가한다. "/mypage/user._id" URL로 넘어오기 때문에 사용자 ID 파라미터 정보를 URL 파라미터로부터 수집하여 저장하고, DB에서 해당 사용자를 찾는다. 찾은 사용자를 res.locals.user로 지역변수 추가를 .. 2021. 11. 11.

웹개발 - 5 Validator 수정 Validator가 계속 안먹혔는데 역시 버전 문제였다. 책에 나와있는대로 express-validator를 npm으로 설치하고 main.js에 app.use(expressValidator())로 사용을 선언해줬는데 자꾸 expressValidator is not a function이라는 타입 에러가 났다. 근데 알고보니까 버전 업데이트(6.x.x) 된 뒤로 app.use(expressValidator())는 안 써줘도 된다고 하고, 선언해서 사용하는 방식도 좀 달랐다. 여기서 진짜 많이 헤맸다... https://noodler.tistory.com/46 https://velog.io/@khyunjiee/NodeJS-express-validator 여기 두곳을 참고해서 아래와 같이 코딩했다. 일단 mai.. 2021. 11. 11.

이전 1 다음

LIST

티스토리툴바