web (2) 썸네일형 리스트형 React + FastAPI 개발 환경 구축하기 0. 들어가며 React와 FastAPI는 각각 frontend와 backend에서 사람들이 많이 사용하는 라이브러리다. 이 글은 React frontend와 FastAPI backend를 사용한 web application 개발 환경을 구축하는 방법을 다룬다. 이 글의 방법을 적용하기 위해서는 사전에 node와 docker를 설치해야 한다. 1. 디렉토리 생성 1.1. 메인 디렉토리 생성 mkdir my-web cd my-web 코드를 담을 디렉토리를 생성한 뒤 생성한 디렉토리로 이동합니다. my-web은 이 글에서 사용한 이름이며 변경 가능하다. 1.2. (Optional) Assets 디렉토리 생성 mkdir assets 이미지와 같은 자원을 관리하기 위한 디렉토리를 만든다. 2. Frontend .. React에서 Form 구현하기 0. 들어가며 React에서 Form을 구현하는 방법에 대한 글이다. Form을 구현하는 방법은 event를 사용한 방법과 state를 사용한 방법으로 나뉜다. 1. Event를 사용한 방법 event.taget을 통해 form에 속한 input element의 value들을 가져올 수 있다. function App() { const handleSubmit = (event) => { event.preventDefault(); let name = event.target.name.value; let password = event.target.password.value; alert(`Name: ${name}\nPassword: ${password}`); } return ( Name Password Submit.. 이전 1 다음