參加 The F2E 的作品,將台灣旅遊資訊網融合自行車旅遊地圖,串接交通部 TDX API,能查詢各地旅遊景點、美食、活動,能看到詳細內容,以及周遭其他的美食與景點。腳踏車地圖使用 Google map 圖資,能查詢各縣市的自行車步道,以及附近的公共自行車站點、站點可租還自行車數量等資訊,還有站點周遭的美食與景點。
使用技術:
React.js 製作 SPA 網站。
react-router-config 統一管理路由。
使用 Tailwind CSS 進行切版。
使用 Google Map 製作自行車地圖。
串接交通部 TDX API 取得各項旅遊資訊。
Swiper.js 輪播。
react-paginate 製作分頁。
網站功能:
列出熱門活動、景點、餐廳。
搜尋活動、景點、餐廳,並顯示詳細內容。
Google 地圖、GPS 定位。
地圖顯示自行車路線。
地圖顯示周遭公共自行車站點、可租還數量。
在這專案,我學會了:
如何使用 React.js。
如何使用 react-router-config 統一管理路由。
如何串接 Google map api。
如何使用套件製作地圖、客製化彈出視窗。
如何使用 Tailwind CSS 切版。
如何使用套件客製化下拉選單、製作分頁。
參加 The F2E 的作品,將台灣旅遊資訊網融合自行車旅遊地圖,串接交通部 TDX API,能查詢各地旅遊景點、美食、活動,能看到詳細內容,以及周遭其他的美食與景點。腳踏車地圖使用 Google map 圖資,能查詢各縣市的自行車步道,以及附近的公共自行車站點、站點可租還自行車數量等資訊,還有站點周遭的美食與景點。