이 보일러플레이트를 사용하면
react, tailwindcss의 npm 환경설정 없이
브라우저에서 바로 코드를 테스트 할 수 있다!
<!DOCTYPE html>
<html class="w-full h-full">
<head>
<meta charset="UTF-8" />
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<title>React</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
</head>
<body class="w-full h-full">
<div id="root" class="w-full h-full"></div>
<script type="text/babel">
const MyApp = () => {
return <>
Hello World
</>;
}
ReactDOM
.createRoot(document.querySelector('#root'))
.render(<MyApp />);
</script>
</body>
</html>728x90
'프런트엔드 > 코드 스니펫' 카테고리의 다른 글
| 자바스크립트 자료구조 - LinkedList (0) | 2023.07.11 |
|---|---|
| 자바스크립트 자료구조 - Queue (0) | 2023.07.11 |
| 자바스크립트 자료구조 - Stack (0) | 2023.07.11 |
| 자바스크립트 자료구조 - Set (0) | 2023.07.09 |