Fullcalendar API - REACT NPM 다운 및 설정

터미널에서 다음과같이 입력

npm install --save @fullcalendar/react @fullcalendar/daygrid

오류가 날 경우 force옵션을 부여하여 아래와 같이 강제로 설치

npm install --force@fullcalendar/react @fullcalendar/daygrid

 

import FullCalendar from '@fullcalendar/react' // must go before plugins
import dayGridPlugin from '@fullcalendar/daygrid' // a plugin!

 

위 두 코드를 import해 줘야지 사용이 가능하다.

 

 

Example Component

import FullCalendar from '@fullcalendar/react' // must go before plugins
import dayGridPlugin from '@fullcalendar/daygrid' // a plugin!

export default function DietMenu () {
	return (
    	<FullCalendar
        plugins={[ dayGridPlugin ]}
        initialView="dayGridMonth"
      />
    )
}

위 에제코드를 보면 FullCalendar 컴포넌트의 Props에는 캘린더를 랜더링 할때 부여할 수 있는 옵션을 부여할 수 있다.