TaiwanGo

This site is developed by Next.js and React.js, integrated third-party API from MOTC Transport API.

Description:

On TaiwanGo, users can quickly search for traveling information, like tourist spots, restaurants, and activities in Taiwan.

Demo link:

https://quizzical-allen-890ea7.netlify.app/

Screenshots

Resource

Mockup (original version) - there are some adjustments on the site.
API Swagger

Technologies

Base:
- HTML / CSS / JavaScript
Framework:
- Next.js / React.js

Dependencies

Material-UI
Leaflet
Emotion
axios
jssha
swiper
... ( see package.json for details )

Dev Dependencies

Husky
Prettier
ESlint
commitlint
babel
... ( see package.json for details )

Features

2.0.0 ( 2021.12.12 released )
- integrate leaflet for map features
- implement MapPage
1.0.0 ( 2021.12.05 released )
- implement HomePage / ListPage / DetailsPage
- integrate API for fetching traveling information
- implement SSR in DetailsPage
- implement search / add to favorites / show more items / dropdown select / RWD

Folder structure

    .
    ├── asset                        # media assets, like icons, etc..
    ├── components                   # global components
    │    ├── Card.js
    │    └── ...
    ├── configs                      # Configs setting for some dependencies
    ├── constants                    # Consistent values
    ├── contexts                     # Common context API and context provider
    ├── docs                         # Documentation files
    ├── hooks                        # Utility hooks for encapsulating logic
    ├── modules                      # API calls and business logic
    ├── page                         # Next.js page folder with built-in route support
    │    ├── list
    │    │   ├── activity
    │    │   │   └── [id].page.js    # Details page file
    │    │   ├── components          # Utility components under list page
    │    │   ├── map
    │    │   │   ├── index.page.js   # Map page file
    │    │   │   └── ...
    │    │   ├── ...
    │    │   └── index.page.js       # List page file
    │    ├── index.page.js           # Home page file
    │    ├── index.style.js          # Home page style file
    │    └── ...
    ├── public                       # Static files, like images, etc..
    ├── styles                       # Global styles for material-UI theme
    ├── utils                        # Tools and utilities
    └──  ...

Setup

Download or clone the repository
Install dependencies
```
yarn install
```
Run the development server:
```
yarn dev
```
Open http://localhost:3000 with your browser to see the homePage.

Contributors

Front-end developer: Wei Lin
UX / UI designer: Rey Chang
Source API: Taiwan Public Transport data eXchange

WeiLin18 / TaiwanGo