Express4 [React] + express + mariadb /post insert 하기 inputComp.js 추가할 input 값 App.js 로 넘겨주기 import '../css/InputComp.css'; import { Component } from 'react'; class InputComp extends Component{ constructor(props){ super(props) this.state={ id:'', todo:'' } } addTodoList=()=>{ alert('추가(InputComp)') // const {id} = this.props+1 const {id} = this.props.id+1 // alert('추가할 id ' + this.props+1) alert('추가할 id ' + id) const{todo} = this.state this.props.a.. 2023. 7. 8. [React] + express + mariadb 데이터베이스 화면 띄우기 todo list 원래 App.js 상태값에 데이트베이스 대신 배열로 대신하여 화면에 띄웠었는데 이제 express 와 mariadb 를 연결하여 데이터베이스 내용을 화면에 띄울거다. 먼저 app.js 에 있던 배열을 지워준다. class App extends Component{ constructor(props){ super(props) this.state={ todolist:[] } } 이제 서버와 db 세팅을 해야한다. src 폴더밑에 server폴더를 만들어주고 server.js 파일을 생성해준다. const express = require('express'); const db = require('./config/db'); const bodyParser = require('body-parser') .. 2023. 7. 2. [NodeJS] 익스프레스 req, res 객체 익스프레스의 req, res 객체는 http모듈의 req, res객체를 확장한 것이다. 익스프레스가 많은 속성과 메서드를 추가했지만, 자주 쓰이는 것 위주로만 정리했다. req 객체 req.app : req 객체를 통해 app 객체에 접근할 수 있다. req.app.get('port') 와 같은 식으로 사용한다. req.body : body-parser 미들웨어가 만드는 요청의 본문을 해석한 객체이다. req.cookies : cookie-parser 미들웨어가 만드는 요청의 쿠키를 해석한 객체이다. req.ip : 요청의 ip 주소가 담겨 있다. req.params : 라우트 매개변수에 대한 정보가 담긴 객체이다. req.query : 쿼리스트링에 대한 정보가 담긴 객체이다. req.signedCook.. 2023. 7. 1. [NodeJS] 익스프레스 웹 서버 만들기 익스프레스는 http 모듈의 요청과 응답 객체에 추가 기능들을 부여했다. 더 이상 if문으로 요청 메서드와 주소를 구별하지 않아도 된다. 익스프레스 프로젝트 시작하기 1. 폴더 생성 learn-express * 항상 package.json 을 제일 먼저 생성해야 한다. 콘솔에서 npm init 명령어 호출 package name : (폴더명) [프로젝트 이름 입력] version : (1.1.0) [프로젝트 버전 입력] description : [프로젝트 설명 입력] entry poion : index.js (app.js) 지금 프로젝트에서는 app.js 로 바꿈 test command : [엔터 키 클릭] git respository : [엔터 키 클릭] keywords : [엔터 키 클릭] autho.. 2023. 7. 1. 이전 1 다음 728x90
