YoungDogg

백엔드를 MVC 패턴으로 만들었다. M : Model V : Views C : Controllers Views Views는 프론트에 보내지는 곳이다. axios로 프론트와 통신을 하지만, 프론트단에 직접 보내고 있다. 따라서 비워뒀다. Models 디비로 어떤 형태로 저장하는지 지정한다. 예시) starbucks.model.js import mongoose from "mongoose"; const starbucksSchema = new mongoose.Schema({ name: String, img: String, }); // Token라는 컬렉션을 만든다. export const Starbucks = mongoose.model("Starbucks", starbucksSchema); 몽구스를 썼다. 스키..

화면에 이미지와 이름을 가져왔다. 독커가 아닌 따로 서버를 열어서 실행시켰다. // 프론트엔드, menu.js 메뉴데이터 얻어서 카드 만든다 const getCoffee = async () => { axios.get("http://localhost:3000/starbucks").then((req) => { const data = req.data; // 배열 for(let i = 0; i < data.length; i++){ createMenuCard(data[i]); // 카드 만드는 함수 } }); } req.data를 얻어서 카드에 인자로 넣어준다. 백엔드 index.js import express from "express"; import swaggerUi from "swagger-ui-express..

인증번호가 확인된다면 나머지를 입력하고 회원가입버튼을 누른다. 프론트 signup.js // 회원 가입 API 요청 const submitSignup = async () => { let personalInfo = { name: String(document.getElementById(`SignupName`).value), personal: "", phone: "", favoriteSite: String(document.getElementById(`SignupPrefer`).value), email: String(document.getElementById(`SignupEmail`).value), password: String(document.getElementById(`SignupPwd`).value), }..

휴대폰에 온 인증번호를 입력 후 인증 완료 버튼을 누르면 실행되게 한다. signup.js // 핸드폰 인증 완료 API 요청 const submitToken = async () => { console.log("핸드폰 인증 API"); let phone = ""; for (let i = 1; i

인증 번호 전송 버튼은 아래 코드를 실행한다. 함수는 휴대폰 번호를 전송한다. // 휴대폰 인증 토큰 전송하기 const getValidationNumber = async () => { document.querySelector("#ValidationInputWrapper").style.display = "flex"; console.log("인증 번호 전송"); let phone = ""; for (let i = 1; i { console.log("=====================signup.js=================="); console.log(phone); }); };

휴대폰이 토큰번호완료가 됐다고 가정하고 회원가입버튼을 누르면 입력 데이터가 포스트로 넘어가게 하기 index.html에 회원가입버튼이 있는 signup.js을 추가. axios로 post 할 것이기 때문에 axios또한 추가 // 휴대폰 인증 토큰 전송하기 const getValidationNumber = async () => { document.querySelector("#ValidationInputWrapper").style.display = "flex"; console.log("인증 번호 전송"); let phone = ""; for (let i = 1; i { console.log("=====================signup.js=================="); console.log(..

frontend backend webcrawler 메인창 회원가입 이용자 전체 조회 커피 목록 전체 조회 백엔드 + 몽고디비 독커 컴포즈로 감싸기 백엔드 API : 이용자 (get, post) 토큰 (get, post, patch) 커피 ( get) 커피 목록 크롤링 몽고디비에 독커 안쓰고 저장 미리 된 것 프론트 html, 및 프론트 js파일 함수 선언 및 구현 할 것 프론트 안에서 axios로 통신하는 부분 및 휴대폰 인증전송버튼, 토큰 인증완료버튼, 회원가입버튼 구현 백엔드 + 몽고디비 독커로 감싸기 백엔드API 커피목록 스타벅스에서 10개 크롤링하기 커피목록 몽고디비에 독커없이 저장하기