Taipei Trip is a travel e-commerce website. With more than 300 attractions information, click on the photos of the attractions to view more information, and make reservations and payment.
台北一日遊是一個旅遊電商網站。擁有超過 300 筆的景點資料,點擊景點資照片可以訊查看看更多資訊,並預約行程、付款。
Due to high AWS fees, the website is currently closed 🥲 .
- | - |
---|---|
Account | test@test.com |
Password | 12345678 |
- | - |
---|---|
Card Number | 424242442424242 |
Valid Date | 01 / 23 |
CVV | 123 |
After the weekly development is completed, will sent Pull Request
to the Reviewer, and after obtaining consent, the develop branch will be merged
into the main branch, and the code will be synchronized to the EC2 computer update website.
每週開發完成後,會向 Reviewer 發送 Pull Request,取得同意後將 develop 分支合併到 main 分支,並將程式碼同步到 EC2 的電腦更新網站。
The project adopts a development method that separation of front-end and back-end. Through the RESTful API, different data is obtained from the back-end according to the Request method sent by the front-end.
專案採用前後端分離的開發方式,透過 RESTful API,根據前端發送的 Request 方法,向後端取得不同的資料。
Use Javascript Intersection Observer API
to practice Lazy Loading and Infinite Scroll . By delaying, the required resources are loaded when needed, which reduces the loading burden of the browser and improves the user experience.
使用 Javascript 的 Intersection Observer API
實踐 Lazy Loading 和 Infinite Scroll。透過延遲,在需要時才載入所需資源,降低瀏覽器載入負擔,提升使用者體驗。
Use keywords or regions / topic filters can quickly find the attractions you want.
使用關鍵字、地區或主題標籤搜尋可以快速找到想要的景點。
Click on the pictures of attractions on the homepage to see more information.
點選首頁的景點圖片可以看到更多資訊。
- Slide Show 圖片輪播
- Weather Infomation 一週天氣(中央氣象局
open API
) - Map Information 地圖資訊(JS library
Leaflet
)
Use TapPay
to connect to a third-party cash flow system. After the credit card is successfully authenticated, the user completes the payment.
使用 TapPay
串接第三方金流系統,信用卡認證成功後,使用者完成付款。