육현진 / DBproject

Go to a project
Toggle navigation Toggle navigation pinning
육현진
284c5fd2 1 parent 36b0af93

studentsadd module & list refresh module

Expand all
Inline Side-by-side
Showing 9 changed files with 318 additions and 5 deletions
......@@ -3,6 +3,9 @@
#database
/database.json
#upload
/upload
# dependencies
/node_modules
/.pnp
......
This diff is collapsed. Click to expand it.
......@@ -3118,6 +3118,14 @@
"resolved": "https://registry.npmjs.org/axe-core/-/axe-core-4.1.1.tgz",
"integrity": "sha512-5Kgy8Cz6LPC9DJcNb3yjAXTu3XihQgEdnIg50c//zOC/MyLP0Clg+Y8Sh9ZjjnvBrDZU4DgXS9C3T9r4/scGZQ=="
},
"axios": {
"version": "0.21.0",
"resolved": "https://registry.npmjs.org/axios/-/axios-0.21.0.tgz",
"integrity": "sha512-fmkJBknJKoZwem3/IKSSLpkdNXZeBu5Q7GA/aRsr2btgrptmSCxi2oFjZHqGdK9DoTil9PIHlPIZw2EcRJXRvw==",
"requires": {
"follow-redirects": "^1.10.0"
}
},
"axobject-query": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz",
......
......@@ -7,6 +7,7 @@
"@testing-library/jest-dom": "^5.11.6",
"@testing-library/react": "^11.2.2",
"@testing-library/user-event": "^12.5.0",
"axios": "^0.21.0",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-scripts": "4.0.1",
......
import React, {Component, components} from 'react';
import Student from './components/Student';
import StudentAdd from './components/StudentAdd';
import './App.css';
import Paper from '@material-ui/core/Paper'
import Table from '@material-ui/core/Table'
......@@ -51,11 +52,25 @@ const students = [
class App extends Component{
state = {
students: "",
completed: 0
constructor(props){
super(props);
this.state = {
students: '',
completed: 0
}
}
stateRefresh = () => {
this.setState({
students: '',
completed: 0
});
this.callApi()
.then(res => this.setState({students: res}))
.catch(err => console.log(err));
}
componentDidMount() {
this.timer= setInterval(this.progress,20);
this.callApi()
......@@ -79,7 +94,8 @@ class App extends Component{
const {classes}= this.props;
return (
<Paper className={classes.root}>
<div>
<Paper className={classes.root}>
<Table className={classes.table}>
<TableHead>
......@@ -125,7 +141,11 @@ class App extends Component{
</Table>
</Paper>
</Paper>
<StudentAdd stateRefresh={this.stateRefresh}/>
</div>
);
}
......
import React from 'react';
import {post} from 'axios';
class StudentAdd extends React.Component{
constructor(props){
super(props);
this.state={
st_Code:'',
st_Name:'',
st_Id:'',
st_Major:'',
st_Midscore:'',
st_Finalscore:'',
st_Assignscore:'',
st_Attendscore:'',
st_Score:''
}
}
handleFormSubmit = (e) => {
e.preventDefault()
this.addStudent()
.then((response) => {
console.log(response.data);
this.props.stateRefresh();
})
this.setState({
st_Code:'',
st_Name:'',
st_Id:'',
st_Major:'',
st_Midscore:'',
st_Finalscore:'',
st_Assignscore:'',
st_Attendscore:'',
st_Score:''
})
}
handleValueChange = (e) => {
let nextState = {};
nextState[e.target.name]=e.target.value;
this.setState(nextState);
}
addStudent = () =>{
const url ='/api/students';
const formData=new FormData();
formData.append('st_Code',this.state.st_Code);
formData.append('st_Name',this.state.st_Name);
formData.append('st_Id',this.state.st_Id);
formData.append('st_Major',this.state.st_Major);
formData.append('st_Midscore',this.state.st_Midscore);
formData.append('st_Finalscore',this.state.st_Finalscore);
formData.append('st_Assignscore',this.state.st_Assignscore);
formData.append('st_Attendscore',this.state.st_Attendscore);
formData.append('st_Score',this.state.st_Score);
const config = {
headers: {
'content-tupe': 'multipart/form-data'
}
}
return post(url, formData, config);
}
render(){
return(
<form onSubmit={this.handleFormSubmit}>
<h1>학생 추가</h1>
코드 번호 : <input type="text" name="st_Code" value={this.state.st_Code} onChange={this.handleValueChange}/><br/>
이름 : <input type="text" name="st_Name" value={this.state.st_Name} onChange={this.handleValueChange}/><br/>
학번 : <input type="text" name="st_Id" value={this.state.st_Id} onChange={this.handleValueChange}/><br/>
전공 : <input type="text" name="st_Major" value={this.state.st_Major} onChange={this.handleValueChange}/><br/>
중간 점수 : <input type="text" name="st_Midscore" value={this.state.st_Midscore} onChange={this.handleValueChange}/><br/>
기말 점수 : <input type="text" name="st_Finalscore" value={this.state.st_Finalscore} onChange={this.handleValueChange}/><br/>
과제 점수 : <input type="text" name="st_Assignscore" value={this.state.st_Assignscore} onChange={this.handleValueChange}/><br/>
출석 점수 : <input type="text" name="st_Attendscore" value={this.state.st_Attendscore} onChange={this.handleValueChange}/><br/>
학점 : <input type="text" name="st_Score" value={this.state.st_Score} onChange={this.handleValueChange}/><br/>
<button type="submit">추가하기</button>
</form>
)
}
}
export default StudentAdd;
\ No newline at end of file
......@@ -41,6 +41,11 @@
"color-convert": "^1.9.0"
}
},
"append-field": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/append-field/-/append-field-1.0.0.tgz",
"integrity": "sha1-HjRA6RXwsSA9I3SOeO3XubW0PlY="
},
"array-flatten": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/array-flatten/-/array-flatten-1.1.1.tgz",
......@@ -76,6 +81,43 @@
"fill-range": "^7.0.1"
}
},
"buffer-from": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.1.tgz",
"integrity": "sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A=="
},
"busboy": {
"version": "0.2.14",
"resolved": "https://registry.npmjs.org/busboy/-/busboy-0.2.14.tgz",
"integrity": "sha1-bCpiLvz0fFe7vh4qnDetNseSVFM=",
"requires": {
"dicer": "0.2.5",
"readable-stream": "1.1.x"
},
"dependencies": {
"isarray": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
"integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
},
"readable-stream": {
"version": "1.1.14",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
"integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
"requires": {
"core-util-is": "~1.0.0",
"inherits": "~2.0.1",
"isarray": "0.0.1",
"string_decoder": "~0.10.x"
}
},
"string_decoder": {
"version": "0.10.31",
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
"integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
}
}
},
"bytes": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.0.tgz",
......@@ -135,6 +177,17 @@
"integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=",
"dev": true
},
"concat-stream": {
"version": "1.6.2",
"resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz",
"integrity": "sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==",
"requires": {
"buffer-from": "^1.0.0",
"inherits": "^2.0.3",
"readable-stream": "^2.2.2",
"typedarray": "^0.0.6"
}
},
"concurrently": {
"version": "5.3.0",
"resolved": "https://registry.npmjs.org/concurrently/-/concurrently-5.3.0.tgz",
......@@ -152,6 +205,14 @@
"yargs": "^13.3.0"
}
},
"config": {
"version": "3.3.3",
"resolved": "https://registry.npmjs.org/config/-/config-3.3.3.tgz",
"integrity": "sha512-T3RmZQEAji5KYqUQpziWtyGJFli6Khz7h0rpxDwYNjSkr5ynyTWwO7WpfjHzTXclNCDfSWQRcwMb+NwxJesCKw==",
"requires": {
"json5": "^2.1.1"
}
},
"content-disposition": {
"version": "0.5.3",
"resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-0.5.3.tgz",
......@@ -210,6 +271,38 @@
"resolved": "https://registry.npmjs.org/destroy/-/destroy-1.0.4.tgz",
"integrity": "sha1-l4hXRCxEdJ5CBmE+N5RiBYJqvYA="
},
"dicer": {
"version": "0.2.5",
"resolved": "https://registry.npmjs.org/dicer/-/dicer-0.2.5.tgz",
"integrity": "sha1-WZbAhrszIYyBLAkL3cCc0S+stw8=",
"requires": {
"readable-stream": "1.1.x",
"streamsearch": "0.1.2"
},
"dependencies": {
"isarray": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/isarray/-/isarray-0.0.1.tgz",
"integrity": "sha1-ihis/Kmo9Bd+Cav8YDiTmwXR7t8="
},
"readable-stream": {
"version": "1.1.14",
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
"integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
"requires": {
"core-util-is": "~1.0.0",
"inherits": "~2.0.1",
"isarray": "0.0.1",
"string_decoder": "~0.10.x"
}
},
"string_decoder": {
"version": "0.10.31",
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-0.10.31.tgz",
"integrity": "sha1-YuIDvEF2bGwoyfyEMB2rHFMQ+pQ="
}
}
},
"ee-first": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
......@@ -474,6 +567,14 @@
"integrity": "sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw==",
"dev": true
},
"json5": {
"version": "2.1.3",
"resolved": "https://registry.npmjs.org/json5/-/json5-2.1.3.tgz",
"integrity": "sha512-KXPvOm8K9IJKFM0bmdn8QXh7udDh1g/giieX0NLCaMnb4hEiVFqnop2ImTXCc5e0/oHz3LTqmHGtExn5hfMkOA==",
"requires": {
"minimist": "^1.2.5"
}
},
"locate-path": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
......@@ -531,11 +632,39 @@
"mime-db": "1.44.0"
}
},
"minimist": {
"version": "1.2.5",
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
"integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw=="
},
"mkdirp": {
"version": "0.5.5",
"resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.5.tgz",
"integrity": "sha512-NKmAlESf6jMGym1++R0Ra7wvhV+wFW63FaSOFPwRahvea0gMUcGUhVeAg/0BC0wiv9ih5NYPB1Wn1UEI1/L+xQ==",
"requires": {
"minimist": "^1.2.5"
}
},
"ms": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
},
"multer": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/multer/-/multer-1.4.2.tgz",
"integrity": "sha512-xY8pX7V+ybyUpbYMxtjM9KAiD9ixtg5/JkeKUTD6xilfDv0vzzOFcCp4Ljb1UU3tSOM3VTZtKo63OmzOrGi3Cg==",
"requires": {
"append-field": "^1.0.0",
"busboy": "^0.2.11",
"concat-stream": "^1.5.2",
"mkdirp": "^0.5.1",
"object-assign": "^4.1.1",
"on-finished": "^2.3.0",
"type-is": "^1.6.4",
"xtend": "^4.0.0"
}
},
"mysql": {
"version": "2.18.1",
"resolved": "https://registry.npmjs.org/mysql/-/mysql-2.18.1.tgz",
......@@ -564,6 +693,11 @@
"validate-npm-package-license": "^3.0.1"
}
},
"object-assign": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
"integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
},
"on-finished": {
"version": "2.3.0",
"resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.3.0.tgz",
......@@ -848,6 +982,11 @@
"resolved": "https://registry.npmjs.org/statuses/-/statuses-1.5.0.tgz",
"integrity": "sha1-Fhx9rBd2Wf2YEfQ3cfqZOBR4Yow="
},
"streamsearch": {
"version": "0.1.2",
"resolved": "https://registry.npmjs.org/streamsearch/-/streamsearch-0.1.2.tgz",
"integrity": "sha1-gIudDlb8Jz2Am6VzOOkpkZoanxo="
},
"string-width": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
......@@ -919,6 +1058,11 @@
"mime-types": "~2.1.24"
}
},
"typedarray": {
"version": "0.0.6",
"resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
},
"unpipe": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
......@@ -966,6 +1110,11 @@
"strip-ansi": "^5.0.0"
}
},
"xtend": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
"integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ=="
},
"y18n": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.1.tgz",
......
......@@ -8,8 +8,10 @@
},
"dependencies": {
"body-parser": "^1.19.0",
"config": "^3.3.3",
"express": "4.17.1",
"http-proxy-middleware": "^1.0.6",
"multer": "^1.4.2",
"mysql": "^2.18.1"
},
"devDependencies": {
......
......@@ -21,6 +21,9 @@ const connection = mysql.createConnection({
connection.connect();
const multer=require('multer');
const upload = multer({dest:'./upload'})
app.get('/api/students', (req, res)=>{
connection.query(
"SELECT * FROM dbproject.Students",
......@@ -30,4 +33,43 @@ app.get('/api/students', (req, res)=>{
);
});
app.use('/image', express.static('./upload'));
app.post('/api/students',upload.single('image'), (req, res) =>{
let sql = 'INSERT INTO dbproject.Students VALUES (?,?,?,?,?,?,?,?,?)';
let st_Code= req.body.st_Code;
let st_Name = req.body.st_Name;
let st_Id = req.body.st_Id;
let st_Major = req.body.st_Major;
let st_Midscore = req.body.st_Midscore;
let st_Finalscore = req.body.st_Finalscore;
let st_Assignscore = req.body.st_Assignscore;
let st_Attendscore = req.body.st_Attendscore;
let st_Score = req.body.st_Score;
console.log(st_Code);
console.log(st_Name);
console.log(st_Id);
console.log(st_Major);
console.log(st_Midscore);
console.log(st_Finalscore);
console.log(st_Assignscore);
console.log(st_Attendscore);
console.log(st_Score);
let params=[st_Code, st_Name,
st_Id,
st_Major,
st_Midscore,
st_Finalscore,
st_Assignscore,
st_Attendscore,
st_Score];
connection.query(sql, params,
(err,rows,fields)=>{
res.send(rows);
console.log(err);
}
);
});
app.listen(port, () => console.log(`Listening on port ${port}`));
\ No newline at end of file
......