로그인을 하면 uid를 리덕스 스토어에 저장을 하고, 해당 유저의 급여내역을 보여주는데, 리덕스에 저장되어있던 uid로 조회를 한다. 그리고 유저는 ex) 12월의 급여내역을 보면서 해당 월의 정정신청을 할 수 있는데, 정정신청 내용을 파이어베이스로 보내야하고, 정정 신청 내역에서 요청한 내역들을 불러와서 조회할 수 있어야한다. loginAuthSlice const initialState: LoginState = { uid: null, isLogined: false,};const loginAuthSlice = createSlice({ name: "loginAuth", initialState, reducers: { setUid: (state, action: PayloadAction) => { sta..
왜 그동안 한번도 만들어보지 않았던거지?? 생각해보면..mui 가 있기때문에 만들생각안하고 가져다 쓰기만 했다. 이번 기회에 이왕이면 커스텀으로 만들어보자.>!!! 동작예상: 사용자가 셀렉트 박스를 클릭하면 옵션이 드롭다운 형식으로 나타나고옵션을 클릭하면 선택된 값이 업데이트되고 드롭다운이 닫힌다.React 컴포넌트 설계 상태(State): 어떤 데이터가 동적으로 변경되는가?isOpen: 드롭다운 열림/닫힘 상태.selectedValue: 현재 선택된 값.Props: 외부에서 전달되는 데이터는 무엇인가?label, options, placeholder, value, onChange 등.상태 관리isOpen:사용자가 셀렉트 박스를 클릭하면 열림(true) 또는 닫힘(false) 상태로 변경.useStat..
일반적으로 react는 부모 컴포넌트가 렌더링되면 자식 컴포넌트가 렌더링되는 tree 구조를 가지고 있다.하지만 때때로 이런 tree구조가 불편함을 가져다주기도 해서, 이럴 때 부모-자식 관계를 유지하지만 독립적인 위치에서 렌더링을 하면 훨씬 편리한 경우가 있다. 대표적인 예로 modal은 부모 컴포넌트의 스타일링 속성에 제약을 받아 z-index 등으로 번거로운 후처리를 해줘야한다.이러한 상황에서 portal을 통해 독립적인 구조와 부모-자식 관계를 동시에 유지할 수 있다면, z-index 등 부모 컴포넌트의 제약에서 벗어날 수 있다. 1. portal로 modal 구현하기2. dim영역 클릭시 모달 닫기3, 브라우저 뒤로가기 방지-> 이벤트 처리 1. portal로 modal 구현하기 Porta..
프론트엔드 부트캠프로 패스트캠퍼스의 " 김민태의 데브캠프" 수강중 입니다ㅏ ! 김민태의 데브캠프, 프론트엔드 부트캠프 수강하고있습니다.!프론트엔드 부트캠프가 엄청 많아졌는데 그중 패스트캠퍼스를 하게 된 가장 큰 이유는 김민태 강사님과 커리큘럼입니다! 김민태 강사님은 프론트엔드 부트캠프 듣기전에도 개인적으로 강의를 구매하여 듣고싶었었고, 여러 커리큘럼을 비교했을때도 가장 인상적이였습니다. 실시간 강의는 김민태 강사님께서 매주 약 3~4일 2시간을 꽉 채워서 강의를 해주십니다!무엇보다 강사님께서 정말 이해가 쉽게 설명해주셔서 듣다보면 시간이 금방 갑니다..! 그리고 실시간강의에서 놓친 부분이나 이해가 안되는 부분들은패스트캠퍼스 매니저님이 바로 정리본도 올려주시기때문에 복습하기에도 정말 좋습니다 ..
