- まずnpmとnodeのがインストールされていることを確認する。
npm --version
node -v
- pnpmをインストールする。
npm i -g pnpm
redign-prj
ブランチに移動して以下のコマンドを実行。
pnpm i
開発中に使用するコマンドは主に3つ(run
は省略しても問題ない)
pnpm dev (or pnpm run dev)
pnpm build (or pnpm run build)
pnpm start (or pnpm run start)
pnpm i -D @fullcaendar/react
import Fullcalendar from '@fullcalendar/react'
import dayGridPlugin from '@fullcalendar/daygrid'
...
<Fullcalendar
plugins={[dayGridPlugin]}
initialView="dayGridMonth"
events={eventData}
/>
...
const testEvents = [ // 挿入データ
{title: 'event 1', date: '2024-01-19'},
{title : 'event 2', date: '2024-01-25'}
]
return (
<div className="">
<Calendar eventData={testEvents} />
</div>
)
shadcn/ui公式ページ(https://ui.shadcn.com/docs/components/accordion) > Componentsからボタンなどのフォーマットを逐次インストール、使用できる
Themesなどで統一した色テーマを変更することができる
ex) Buttonをpnpmでインストールして使用する
pnpm dlx shadcn-ui@latest add button