로그인 관련한 기본적 코드
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script crossorigin src="https://unpkg.com/react@17/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
function App(){
let [userid,setUserid] = React.useState('')
let [userpw,setUserpw] = React.useState('')
let [isLogin,setIsLogin] = React.useState(false)
const handleChangeUserid = (e) => {setUserid(e.target.value)}
const handleChangeUserpw = e => setUserpw(e.target.value)
const handleSubmit = e =>{
e.preventDefault()
if(userid === 'admin' && userpw ==='admin'){
setIsLogin(true)
}else{
setIsLogin(false)
}
setUserid('admin')
setUserpw('admin')
}
return(
<>
<form onSubmit = {handleSubmit}>
<input type="text" name="userid" onChange={handleChangeUserid} value={userid}/>
<input type="text" name="userpw" onChange={handleChangeUserpw} value={userpw}/>
<button type="submit">로그인</button>
</form>
{isLogin?'로그인이 되었습니다.':''}
</>
)
}
ReactDOM.render(
<App/>,
document.querySelector('#root')
)
</script>
</body>
</html>
안녕하세요