+ 버튼 클릭 시 모달창 생성 1. useState 생성 const [isOpenModal, setOpenModal] = useState(false); useState를 사용해 초기값을 false로 설정 2. + 버튼 클릭 시 함수 호출 + 버튼 클릭 시 onClick함수를 통해 handleMakeFolder 함수를 호출 3. handleMakeFolder 함수 const handleMakeFolder = () => { setOpenModal(true); }; 모달창을 보여주기 위해 setOpenModal을 통해 isOpenModal을 true로 설정 4. cloeModal 함수 const closeModal = () => { setOpenModal(false); }; 모달창을 닫는 함수 추가 5번의 M..
Redux란 ? 자바스크립트 상태관리 라이브러리이다. Redux 사용하기 전에 알아야 할 세가지 1. store - 스토어라는 공간이 따로 있어서 스토어 안에서 필요한 상태를 담는다. - 상태 정보가 필요할 때 스토어에 접근한다. 2. action - 스토어에 운반할 데이터를 의미 - 자바스크립트 객체 형식으로 되어있다. 3. reducer - action -> store 가 아닌 action -> reducer로 전달한다. - reducer가 action을 보고 store의 상태를 업데이트하는 것이다. - action을 reducer로 전달하기 위해 dispatch() 메소드를 사용해야한다. 위 개념을 바탕으로 내가 짠 코드 homeslice.tsx import { createSlice } from '..
FullCalendar 이벤트 및 일정을 표시하고 관리하는 라이브러리 FullCalendar를 사용하면 월별, 주별, 일별로 일정을 시각적으로 표현 가능 필요 기능들과 관련 문서들이 친절하게 잘 나와있어서 한 번쯤 사용해도 좋을 것 같다..!! 정말 편해,, 캘린더 뷰 사용법 1. ref={this.calendarRef} 캘린더에 일정을 추가하기 위해 사용한 코드다. 그냥 간단하게 events={일정} 넣어도 된다. 이게 더 쉬울지도ㅎㅎ const Events = [{ title: '전과신청', start: '2024-01-15',end:'2024-01-19', color:'#b1aee5'}]; 위와 같은 형식으로 일정을 넣을 수 있고, background-color도 추가 가능하다 2. plugins=..
