반응형
프론트는 리액트로
백앤드는 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'); });
반응형
'IT > Node.js' 카테고리의 다른 글
[Node.js] __dirname이 뭘까? (0) | 2023.02.14 |
---|---|
[Node.js] express가 뭘까? (0) | 2023.02.10 |
[Node.js] http 모듈은 뭐고, req와 res는 또 뭘까? @@ (0) | 2023.02.09 |
[Node.js] 모듈이 뭘까? - 레고로 설명하는 모듈 개념 (0) | 2023.02.09 |
[Node.js] Node.js가 도대체 뭘까? (0) | 2023.02.08 |