전체 글85 mongoose-express 데이터 삭제하기 기본적인 데이터 처리작업인 CRUD 중에서 이번에는 Delete(삭제) 기능을 구현해보겠습니다. 상세페이지에 삭제 버튼 만들기 데이터 삭제 처리 및 삭제 후 초기화면으로 이동(redirect) 하기 1. 상세페이지 화면인 show.ejs 에 삭제 기능 구현 DELETE버튼을 추가하고 method중 delete를 처리하기 위해 method-override 를 이용해서 쿼리스트링으로 POST method를 DELETE로 변경하여 사용해보겠습니다. (...) Price $ Category All Products Edit Product Delete (...) 삭제기능버튼 선택시 delete method로 보내는데 라우트 설정이 되어 있지않아 오류납니다. 2. index.js에서 delete method 처리하기.. 2023. 8. 22. mongoose-express 카테고리 선택자 자동 셋팅 이전 블로그에서 저장된 데이터를 불러와서 보여줄 때 select tag 특성상 저장된 데이터에 맞는 카테고리가 표출되지 않습니다. 즉, 카테고리가 정상적으로 보이지 않는데 이를 수정하기 위해 다음과 같이 저장된 카테고리와 일치된 카테고리가 선택되어 지도록 다음과 같이 개선해봅니다. [참고] 이전 블로그 2023.08.19 - [데이터베이스] - mongoose-express 데이터 업데이트 하기 mongoose-express 데이터 업데이트 하기 mongoose 데이터베이스에 입력한 데이터를 조회하여 업데이트하는 방법에 대해 알아봅니다. 조회할 데이터에 해당하는 id 를 URL에서 받아와서 데이터베이스에서 해당 id를 조회하여 기존에 신규 peter-codinglife.tistory.com 1. sele.. 2023. 8. 21. mongoose-express 데이터 업데이트 하기 mongoose 데이터베이스에 입력한 데이터를 조회하여 업데이트하는 방법에 대해 알아봅니다. 조회할 데이터에 해당하는 id 를 URL에서 받아와서 데이터베이스에서 해당 id를 조회하여 기존에 신규 데이터 입력하기 위해 만든 폼에 데이터를 보여주고 수정하여 저장하도록 합니다. 1. index.js 데이터 수정 경로 추가 하기 데이터 조회하는 app.get("/products/:id") 을 복사하여 다음과 같이 수정합니다. const express = require("express"); const app = express(); const path = require("path"); const Product = require("./models/product"); const mongoose = require("m.. 2023. 8. 19. [React] gh-pages 배포시 주의사항 및 오류 해결 이전의 gh-pages 로 정적 홈페이지 배포방법에 대해 설명하였고, 2023.08.15 - [리액트(React)] - 웹사이트 Build 및 깃허브(Github) Pages로 배포하기 추가로 깃허브(Github)의 무료 호스팅인 page 로 create-react-app 으로 만든 리액트 프로젝트을 배포하는데 몇가지 주의사항이 있어서 별도로 설명하고자 합니다.. 기본적으로 gh-pages의 경우 리액트와 같은 SPA(Single Page Application)를 지원하지 않습니다. 따라서 다양한 페이지로 접근시 404 에러(페이지를 찾을 수 없음)가 나타납니다. 이에 따라 단순하게 페이지 하나만 보여주는 것은 별 문제가 되지 않으나 기본적으로 gh-pages 에서는 https://[사용자명].githu.. 2023. 8. 15. 웹사이트 Build 및 깃허브(Github) Pages로 배포하기 리랙트 프로젝트로 만든 사이트를 깃허브에서 제공하는 무료로 HTML 파일을 호스팅 해주는 사이트인 Pages로 실제 배포해 보고자 합니다. 물론 무료인 만큼 제약사항으로 Static HTML, CSS, Javascript 정도 지원이 되니 적용 가능한지 사전에 인지가 필요합니다. 실제 만들어진 프로젝트 파일을 그대로 Github에 복사해서 올린다고 동작하지 않습니다. 배포하기 위한 작업 단계에 대해 설명드리고자 합니다. 1. 사전작업 지금까지 코딩한 파일은 localhost:3000 을 통해서 동작확인을 합니다. 실행시 warning message 정도는 배포시 문제되지 않습니다. github.com 에 신규 계정 가입을 하고 프로젝트명에 해당하는 repository를 만듭니다. 참고로 계정이름과 rep.. 2023. 8. 15. mongoose-express 신규데이터 입력폼 만들기 이전 블로그에서 데이터베이스에 저장된 데이터에 대한 상세 화면을 만들어 보았습니다. 2023.08.12 - [데이터베이스] - mongoose-express 상세페이지 만들기 이제 신규 product를 입력하고 데이터베이스에 저장하는 기능을 만들어 보겠습니다. 우선 입력 폼과 그 폼을 제출할 두 개의 라우트가 필요합니다. 기존 index.js 에서 신규 상품을 입력하는 라우트로 app.get 으로 products/new 를 추가하고, 입력한 폼을 제출하기 위한 라우트로 app.post 로 products 에 신규 상품을 추가합니다. (...) app.get("/products", async (req, res) => { const products = await Product.find({}); res.ren.. 2023. 8. 12. 이전 1 ··· 5 6 7 8 9 10 11 ··· 15 다음 반응형
