스마트 미러 만들기 프로젝트_#6.캘린더 연동

2020/06/05 - [메이커 이야기/메이커 이야기] - 스마트 미러 만들기 프로젝트_#5.날씨 정보, 기상 예측

 

스마트 미러 만들기 프로젝트_#5.날씨 정보, 기상 예측

 

미러 만들기 지난 번에는 날씨 정보와, 기상정보를 가져오는 걸 했었는데요

오늘은 이제 스마트 미러 내부 작동 기능의 마지막 단계인 구글 캘린더 연동을 해보도록 하겠습니다.

 

3rd Part 모듈을 사용하는 방법들에 대해서는 향후에 한번 다뤄보도록 하고, 오늘은 그냥 간단히 config.js파일만 수정해서 캘린더를 연동 해보도록 하겠습니다.

 

 

우선 Calendar 의 모듈 구조도 앞서 했던 것과 동일 합니다.

다음과 같이 모듈이 구성 되어 있는데요.

header는 캘린더 이름 그리고 url이 연동하고자 하는 파일입니다. 근데 확장자가 .ics파일이네요. 

.ics 확장자는 캘린더 파일 확장자입니다.

이곳에 US-Holidays확장자가 있는 부분만 바꿔주면 됩니다. 저는 제 구글 캘린더를 연동해서 해보도록 하겠습니다.

modules: [
	{
		module: "calendar",
	        header : "US Holidays",
		position: "top_left",	// This can be any of the regions. Best results in left or right regions.
		config: {
			url: 'http://www.calendarlabs.com/templates/ical/US-Holidays.ics',
			symbol: 'calendar',
		}
	}
]

 

참고로, 그냥 우리나라 공휴일이나 다른 캘린더를 사용하고 싶으시다면 아래 몇가지 샘플을 활용하시면 좋을 것 같습니다.

 

---

Evilone's 음력 달력

- 1일, 15일 표기 -> 1일, 5일, 10일, 15일, 20일, 25일 표기로 변경

- 음력 x월 x일 표기 -> (음)x/x 표기로 변경

- 24절기의 경우 '24절기' 표기

- 세시의 경우 '세시' 표기

- 명절의 경우 '명절' 표기 

http://www.google.com/calendar/ical/khi0jajc5vot0u18umds83qf80%40group.calendar.google.com/public/basic.ics
출저: Evilone's Blog

음력달력 (old)
- 1일, 15일 표기
http://www.google.com/calendar/ical/i0q6etp3unuq4anaodvruqrufk%40group.calendar.google.com/public/basic.ics

대한민국 공휴일
- 공휴일만 표시
http://www.google.com/calendar/ical/46hp89gvrbnnh1gpadt0a4hdr4%40group.calendar.google.com/public/basic.ics

대한민국 기념일
- 공휴일 아닌 날도 표시
 http://www.google.com/calendar/ical/ko.south_korea%23holiday%40group.v.calendar.google.com/public/basic.ics

출처: https://www.myhyun.com/5850 [myhyun.com - 마이현닷컴]

 

---

 

 

구글 캘린더의 경우 아래와 같은 방식으로 url이 나타나구요. {},{}로 하게 되면, 두가지 달력이 모두 나열되는 구조입니다.

    config: {
        calendars: [
            {
                url: 'webcal://www.calendarlabs.com/templates/ical/US-Holidays.ics'
            },
            {
                url: 'https://calendar.google.com/calendar/ical/FILL_IN_YOUR_INFO'
            },
        ],
    }

 

나의 Google calendar에서 ics url만 가져오면 될것 같습니다.

 

구글 캘린더 우측 상단에 

 

설정 >> 내 캘린더 설정 >> 아래 스크롤 내려보시면 >> 아래와 같이 나타나 있습니다. 

 

 

이를 복사하셔서 위의 config.js 파일에 url을 넣으시면

 

일정이 잘 연동 되는 걸 확인 할 수 있습니다.

 

 

---

 

2020/06/05 - [메이커 이야기/메이커 이야기] - 스마트 미러 만들기 프로젝트_#3.라즈베리파이_셋팅

스마트 미러 만들기 프로젝트_#3.라즈베리파이_셋팅

2020/06/05 - [메이커 이야기/메이커 이야기] - 스마트 미러 만들기 프로젝트_#4.뉴스 정보 업데이트

스마트 미러 만들기 프로젝트_#4.뉴스 정보 업데이트

2020/06/05 - [메이커 이야기/메이커 이야기] - 스마트 미러 만들기 프로젝트_#5.날씨 정보, 기상 예측

스마트 미러 만들기 프로젝트_#5.날씨 정보, 기상 예측

 

 

그럼 이제 외형을 만들러 가봐야겠습니다.