2022.12.05

천소진·2022년 12월 5일
0

프로젝트

목록 보기
12/14

작업내용

fullcalendar와 googlecalendar API 연동하기
: fullcalendar 만으로는 한국 날짜에 맞춰 공휴일표시를 할수 없어서 googlecalendarAPI와 연동을 해보기로하자.

1. GoogleCalendar API 새로운 키 할당 받기

https://console.cloud.google.com/apis이 링크로 이동해서 새 프로젝트를 생성.

생성된 프로젝트 선택후 '라이브러리'검색

GoogleCalendar API 선택후 '사용'클릭

사용자 인증정보에서 API키 생성

API키 눌러서 복사 후 코드에 붙여넣기

2. 원하는 캘린더를 공개 설정 하기

https://calendar.google.com/ 에 접속해서 설정클릭

fullcalendar에 연동할 캘린더 선택후 액세스권한 '공개사용설정'클릭

3. FullCalendar + GoogleCalendar 웹페이지에 띄우기

캘린더 통합에서 캘린더 ID 복사 후 코드에 붙여넣기

  • 나는 공휴일 도 달력에 표시하고 싶어서 대한민국 휴일달력도 함께 넣어주었다.
    코드에 넣을 때는 eventSources 속성에 추가해주며 글씨나 배경색 지정도 가능하다.

임의로 이벤트를 몇개 넣어주고 크롬창으로 띄워보기.


Good!!
처음에는 설정이 잘못된건지 여기저기 다찾아보면서 해봐도 잘안됐었는데 결국 구글캘린더 공개 설정부분을 빠트렸었다.
그래도 아래 블로그를 참고하고 드디어 해냈당 🥰감사합니다

참고블로그

0개의 댓글