정규식
인풋에 영어와 숫자만 입력되게 하기
A-Za-z : 영어 입력되게
0-9 : 숫자 입력되게
-> 타겟의 value를 replace로 정규식의 조건에 맞춰서 치환해버림
const handleUserIdChange = (e) => {
e.target.value = e.target.value.replace(/[^A-Za-z0-9]/ig, '');
setUserId(e.target.value);
}
미들웨어
3초 후 에 디스패치해줘 -> 3초 기다리는 걸 미들웨어 없이는 구현하지 못함
이걸 할 수 있게 해주는게 미들웨어
Redux Thunk
= dispatch에 객체가 아닌 함수를 dispatch할 수 있게 해준다.
중간에 우리가 하고자 하는 작업을 함수에 넣고그것이 중간에 실행 되는 것
액션이 리듀서로 전달되기 전에 중간에 원하는 작업을 더 할 수 있다.
서버 통신 함수는 무조건 async 처리
Custom Hooks
- 중복되는 코드를 줄이기 위함
const useInput = () => {
//state
const [value, setValue] = useState(' ')
//handler
const handler = (e) => {
setValue(e.target.value}
return [value, handler];
}
//사용방법
import useInput ..
const [name, handleNameChange] = useInput();
const [password, handlePasswordChange] = useInput();
const response = await api.get('/posts');
const api = axios.create({
baseURL: 'http://localhost:4000',
timeout: 3000,
});
VSCode Prettier 적용 안될 때
%APPDATA%\Code\User\settings.json
파일 탐색기 경로에 위 주소 붙여넣고 setting.json 파일 삭제 후
format on save, default formatter 다시 설정
주의) 기타 다른 설정도 다 날라가니 기억해두기
힘들다.......................
'Today I Learned' 카테고리의 다른 글
파일 탐색기 버튼 input type='file' 커스텀하여 사용하기 (0) | 2024.02.21 |
---|---|
로그인 상태에 따라 페이지 접근 제한 구현하기 (0) | 2024.02.20 |
2024.02.16 TIL (0) | 2024.02.16 |
2024.02.15 TIL (1) | 2024.02.16 |
2024.02.14 TIL (0) | 2024.02.14 |