fix bug(webpack-dev-server)

react_webgame/main/WordRelay.jsx

@@ -43,7 +43,7 @@ class WordRelay extends Component {
                 <div>{this.state.word}</div>
                 <form onSubmit={this.onSubmitForm}>
                     <input ref={this.onRefInput} value={this.state.value} onChange={this.onChangeInput} />
-                    <button>입력!</button>
+                    <button>입력!!!</button>
                 </form>
                 <div>{this.state.result}</div>
                 <div>{this.state.words}</div>

react_webgame/main/WordRelayHooks.jsx

@@ -2,7 +2,7 @@ const React = require('react');
 const { useState, useRef } = React;
 
 const WordRelayHooks = () => {
-    const [word, setword] = useState('리액트!!');
+    const [word, setword] = useState('리액트');
     const [value, setvalue] = useState('');
     const [result, setresult] = useState('');
     const [words, setwords] = useState('리액트');
@@ -25,7 +25,7 @@ const WordRelayHooks = () => {
     }
 
     const onChangeInput = (e) => {
-        this.setState({ value: e.target.value })
+        setvalue(e.currentTarget.value);
     }
 
     return (
@@ -41,4 +41,4 @@ const WordRelayHooks = () => {
     )
 }
 
-module.exports = WordRelay;
+module.exports = WordRelayHooks;

react_webgame/main/client.jsx

@@ -1,6 +1,6 @@
 const React = require('react');
 const ReactDom = require('react-dom');
 
-const WordRelay = require('./WordRelayHooks');
+const WordRelayHooks = require('./WordRelayHooks');
 
-ReactDom.render(<WordRelay />, document.querySelector('#root'));
+ReactDom.render(<WordRelayHooks />, document.querySelector('#root'));

react_webgame/main/webpack.config.js

@@ -16,7 +16,7 @@ module.exports = {
 
 	module: {
 		rules: [{
-			test: /\.jsx?/, // js, jsx 파일에 babel-loader적용
+			test: /\.jsx?$/, // js, jsx 파일에 babel-loader적용
 			loader: 'babel-loader',
 			options: {
 				presets: [
@@ -43,11 +43,11 @@ module.exports = {
 	output: {
 		path: path.join(__dirname, 'dist'),
 		filename: 'app.js',
-		publicPath: './dist/',
+		publicPath: '/dist/',
 	}, // 출력
 
 	devServer: {
-		publicPath: './dist/',
+		publicPath: '/dist/',
 		hot: true,
 	},
 };