오늘의 TIL
1. 게시글 수정 화면 진입 시 내용 추가
- 진입 시 input box에 내용 보여주기
- 일부 값만 수정하기
- html의 defaultValue 활용하기
수정화면에 들어갔을 때 input box에 기존의 값을 미리 넣어놓고 보여줄 수 있도록 defaultValue 속성에 값을 넣어뒀다. 그리고 UPDATE를 실행할 때 변경된 값만 전송할 수 있도록, 값이 변경되면 (onChange) 변경된 값만 variables에 넣어서 전송하도록 구현하는 방법을 배웠다.
2. 이걸 쓰면 더 안전하다고? >> typescript
- 타입스크립트를 쓰는 이유
자바스크립트는 타입이 없기 때문에 나중에 타입으로 인한 오류가 발생할 수 있다. 예를 들면 숫자만 들어가야 하는데 문자가 들어가서 연산을 했을 때 문자로 바뀌어 버리는 그런 문제,,? 그래서 타입스트립트를 사용한다.
타입스크립트는 변수, 함수의 타입을 지정해줘서 타입에 맞는 값만 입력할 수 있게 해준다.
3. 기존의 JavaScript에 typescript를 추가하자!
- yarn add typescript
- 기존 파일에 typescript 타입 지정 추가
typescript를 설치하고 파일의 확장자를 jsx가 들어있는 파일은 tsx로, 없는 파일은 ts로 변경했다. 확장자를 변경하면 타입 지정이 필요한 부분에 빨간 줄로 오류 표시가 된다. 그 부분에 대한 타입을 interface를 사용해서 타입을 지정해줄 수 있다. 타입을 지정하지 않아도 묵시적으로 변환되는 것도 있다!
타입을 지정한 부분은 따로 파일을 만들어서 그곳에 작성하고(BoardWrite.types.js), 필요한 부분에 import 받아서 사용했다.
typescript를 설치하고 tsconfig.json 파일을 만들었는데, 그 파일에서는 라이브러리 타입도 체크할 것인지(skipLibCheck) 엄격하게 관리할 것인지(strict) 등을 설정할 수 있다. strict는 디폴트가 false로 되어있고, 이 부분을 true로 변경해서 실습했다.
알고리즘 수업
- 숫자 배열로 변경
숫자.toString().split("") - 새 배열 만들기
new Array(n).fill('*') - reduce, map 활용
number로 주어진 값으로 배열을 활용하기 위해서 문자열로 먼저 변환하고, 각 자리수를 배열에 담아줄 수 있도록 공백을 split해서 각 자릿수로 이루어진 배열을 얻을 수 있다.
값은 없지만 배열을 만들 때는, 원하는 길이만큼 빈 배열을 먼저 만들고 fill을 사용해서 채워주면 된다.
이전 수업에도 계속 사용해온 reduce와 map은 여기저기 다양하게 활용이 가능한 것 같다.
map은 쓸만 한데 reduce는 아직 어렵당..ㅋㅎㅋㅎ 문제를 풀면서 변형해보는 연습도 해봐야겠다!!!!!
Self Study
- 수정 페이지에 기존 입력값 보여주기
- 수정하지 않은 값은 update하지 않도록 입력값 변경하기
- 포트폴리오를 typescript로 변환하기
포트폴리오 파일에 typescript를 추가했다. BOARD_UPDATE의 입력값 중에 updateBoardInput 객체가 있고 그 안에 또 boardAddress가 있어서 이걸 대체 어떻게 보내야 하나,, 이런 저런 시도를 해보느라 시간이 좀 걸렸다. 결론은 그냥 객체의 생긴 모양 그대로 객체 안의 객체를 객체 안의 요소로 써주니까 작동이 잘 됐다...^^
처음에는 useForm을 사용한 파일에서 하다가 자꾸 오류가 나서 다른 방법을 찾았던 것인데, useState를 써서 새로 만들어서 하니까 똑같은 방법으로 했는데 update가 잘 됐다. useForm은 지금 에러메세지 생기고 없어지고 하는 부분에서 귀여운 에러들이 좀 생겨서.. 아직 해결하지 못했다 ㅎㅎㅎ
곧 수업 때 useForm을 배운다고 해서 그때 배우면서 같이 적용해보면 될 것 같다!
useState로 다시 폴더를 만들면 오래 걸릴까봐 걱정을 좀 했는데 write container/presenter 제외하고는 거의 유사해서 금방 새로 만들 수 있었다. 다른 사람들 에러를 하도 많이 봐서 그런지 금방 만들 수 있었다 ㅋㅋㅋ 처음에는 정말 낯설고 이걸 착착착 할 수 있을까 좀 걱정이 됐는데 반복만큼 좋은 건 없는 것 같다 정말... 오늘 하루도 굿!
