인프런 커뮤니티 질문&답변

형욱박님의 프로필 이미지
형욱박

작성한 질문수

따라하며 배우는 도커와 CI환경 [2023.11 업데이트]

React JS 구성하기

react.js 실행시 에러가 납니다.

작성

·

1.7K

0

import React, {useState, useEffect} from 'react';
import logo from './logo.svg';
import './App.css';
import axios from 'axios';

function App() {

useEffect(() => {
//여기서 데이터베이스에 있는 값을 가져온다.App
axios.get('/api/values')
.then(response => {
console.log('response', response)
setLists(response.data)
})
}, [])
const [lists, setLists] = useState([])
const [value, setValue] = useState("")

const changeHandler = (event) => {
setValue(event.currentTarget.value)
}

const submitHandler = (event) => {
event.preventDefault();
axios.post('/api/value', {value: value})
.then(response => {
if(response.data.success){
console.log('respone', response)
setLists([...lists, response.data])
setValue("");
}else{
alert('값을 DB에 넣는데 실패했습니다.')
}
})
}

return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<div className="container">
{lists && lists.map((list,index)=> (
<li key={index}>{list.value} </li>
))}
<br />

<form className="example" onSubmit={submitHandler}>
<input
type="text"
placeholder="입력해주세요..."
onChange={changeHandler}
value={value}
/>
<button type="submit">확인</button>
</form>
</div>
</header>
</div>
);
}

export default App;
Failed to compile. ./src/App.js Module not found: Can't resolve 'axios' in '/Users/joseph/Desktop/docker-fullstack-app/frontend/src' 이렇게 에러가 납니다. 이유가 뭘까요??ㅜㅜ

답변 2

1

형욱박님의 프로필 이미지
형욱박
질문자

package.json에 넣었으나 안되었고 구글에 이슈 검색하니 npm 명령어로 axios 설치 후 해결하였습니다. 

0

John Ahn님의 프로필 이미지
John Ahn
지식공유자

안녕하세요 형욱박님 package.json에서 axios를 넣어주셨나요 ~ ? 

형욱박님의 프로필 이미지
형욱박

작성한 질문수

질문하기