글 수정 수정 기능을 구현해보자. 아직 페이지가 없어 404가 뜰 것이다. 우선 /src/app/update/[id]/page.tsx 파일을 만들어 주고 기본 틀만 제공하자. 그런데 수정이란 크게 2가지의 합성이다. Update = Create + Read 따라서 수정을 진행할 때 읽고 만드는 두 가지가 모두 필요하다. 기본적인 UI는 Create에 있는 page.tsx에서 가져오자. 그런데 Update는 원본이 적혀 있어야 하기 때문에 Read 기능도 필요하다. 그런데 Create는 클라이언트 컴포넌트이고 Read는 서버 컴포넌트로 구현되어 있다. 그래서 이걸 그대로 사용할 수는 없다. useEffect와 fetch를 이용해서 데이터를 가져오는 작업이 필요하다. 그리고 가져온 데이터를 form 안에 넣..

1. TextIput 이벤트 핸들러 및 함수 textInput 에 커서를 두고 클릭을 하고 키보드 입력을 해도 아무런 반응이 없다. 텍스트가 입력이 될 때마다 이벤트를 발생시키는 onChange 라는 텍스트 프로퍼티가 필요하다. 단순히 입력된 값을 업데이트 시키는 함수만이 아니라 이번에는 onChangeText라는 이벤트 핸들러에 화살표 함수를 사용할 것이다. 여기에 value라는 매개변수를 전달해 값을 바로 업데이트시킬 것이다. updateInput 함수에는 2가지 인자를 넣는데 하나는 string, 하나는 value를 넣자. string 값을 써주는 이유는 2가지가 있다. 1. 이메일, 비밀번호 textInput에서 구분하기 위한 인자를 만들기 위해서 2. 업데이트되는 value 값은 state에서 ..

1. 로그인 화면 작성 위한 파일 및 로고 준비 auth 파일 안에 authForm.js, authLogo.js 파일을 만들자. authLogo.js 에서 로고 이미지를 가져와 쓸 건데 로고 이미지를 보관하기 위해 /app 안에 assets 라는 폴더를 만들고 그 안에 imgs라는 폴더를 만들자. 이 안에 다운받은 로고 파일을 넣으면 된다. 변화된 디렉토리 구조 ├─ app │ ├─ assets │ │ └─ imgs │ │ ├─ winthiary_login_logo.png │ │ └─ winthiary_login_logo@2x.png │ ├─ components │ │ ├─ auth │ │ │ ├─ authForm.js │ │ │ ├─ authLogo.js │ │ │ └─ index.js │ │ ├─ d..