s e o p p o r t . l o g

Today I Learned

2024.02.19 TIL

Seo Ji Won 2024. 2. 19. 22:11

 

정규식

인풋에 영어와 숫자만 입력되게 하기

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 다시 설정

주의) 기타 다른 설정도 다 날라가니 기억해두기

 

 

힘들다.......................