IT/Node.js

[Node.js] CRUD 만들어 보기

Buang 2023. 2. 14. 22:59
반응형

 

프론트는 리액트로

백앤드는 Node.js로 해서 

사용자가 입력한 두 개의 값을 출력하는 CURD 시스템

 

포트는 총 3000과 3001 2개를 사용했다.

 

// import React, { useState, useEffect } from 'react';
import React from "react";
import './App.css';
// import Axios from 'axios'
// 백앤드에 있는 걸 호출하기 위해
// movieName: movieName 작성
function App() {
// const [movieName, setMovieName] = useState('');
// const [review, setReview] = useState('');
// const submitReview = () =>{
// Axios.post("http://localhost:3001/api/insert")
// };
return (
<div className="App">
<h1>CRUD APPLICATION</h1>
<div className="form">
<label>Movie Name: </label>
<input
type="text"
name="movieName"
// onChange={(e)=>{
// setMovieName(e.tartger.value);
// }}
/>
<label>Review: </label>
<input
type="text"
name="review"
// onChange={(e)=>{
// setReview(e.target.value);
// }}
/>
</div>
<button>Submit</button>
</div>
);
}
export default App;

 

 

const express = require('express');
const bodyParser = require('body-parser');
const app = express();
const mysql = require('mysql');
const db = mysql.createPool({
host: 'localhost',
user: 'root',
password: '123',
database: 'CRUDDataBase',
});
app.get("/", (req, res) => {
res.send("heelo world");
});
// app.use(bodyParser.urlencoded({extended: true}));
// app.post("/api/insert", (req, res) =>{
// const sqlInsert = "INSERT INTO movie_reviews (movieName, movieReview) VALUES (?,?)"
// db.query(sqlInsert, [movieName, movieReview], (err, result)=>{
// })
// db.query()
// });
app.listen(3001, () => {
console.log('running on port 3001');
});
반응형