리액트 노드로 axios post 하여 데이터베이스 insert

안녕하세요·2023년 11월 14일

react x node 

목록 보기
5/18
post-thumbnail
  const [form, setForm] = useState({ "image": "1", "name": "2", "price": "3", "info": "4" });


  const handleSubmit = (e) => {
    axios.post('http://127.0.0.1:8000/products/new',form)
  }

버튼을 누르면 axios post 되도록 작성

import express from 'express';

const router = express.Router();

router.post('/products/new',(req,res)=>{
  console.log(req.body);
});



export default router

node.js 서버로 post 받아 콘솔

  const handleSubmit = (e) => {
    // axios.post('http://127.0.0.1:8000/products/new',form)
    axios({
      method: 'post',
      url: 'http://127.0.0.1:8000/products/new',
      data: form
    })
      .then(result => console.log('요청성공'))
      .catch(err => console.log('에러==>' + err))
  }

이런식으로도 작성 가능

import * as productsRepository from '../repository/productsRepository.js'


export async function insertProduct(req, res) {
  const { name, image, price, info } = req.body;
  console.log(name, image, price, info);
  const result = await productsRepository.insertProduct( image, name, price, info );
  res.json(result)
};

mvc 패턴 컨트롤러

import {db} from '../db/database.js'

export async function insertProduct(name, image, price, info) {
  const sql = `insert into shoppy_products(name, image, price, info,pdate) values(?,?,?,?,curdate());`
  return db
    .execute(sql,[image, name, price, info])
    .then((result)=> 'success')
    

}

sql 구문으로 데이터베이스 테이블에 insert

0개의 댓글