[React] Full calendar 기본 세팅

프론트엔드/React

[React] Full calendar 기본 세팅

an_apricot__ 2022. 2. 19. 22:02

React Component - Docs | FullCalendar

FullCalendar seamlessly integrates with the React JavaScript framework. It provides a component that exactly matches the functionality of FullCalendar’s standard API. This is more than a mere “connector”. It tells the core FullCalendar package to beg

fullcalendar.io

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

app.js

import './App.css';
import FullCalendar from '@fullcalendar/react';
import dayGridPlugin from '@fullcalendar/daygrid';

function App() {
  return (
    <div className="App">
      <FullCalendar 
        defaultView="dayGridMonth"
        plugins={[ dayGridPlugin ]}
        events={[
          { title: 'event 1', date: '2022-02-01' },
          { title: 'event 2', date: '2022-02-02' }
        ]}
      />
    </div>
  );
}

export default App;