Team Bug Busters
presentCity Explorer

City Explorer Demo Video

City Explorer Demo Video

Makes organising travelling fun

We wanted to create a mobile and web app that could help a user explore a new city through suggestions of local attractions. The app organises the attractions the user wants to visit into a personal bucket list, and plans the most efficient route between them.

The Team

  • Michael FarahPreview: Michael Farah

    Michael Farah

  • Elizabeth RayPreview: Elizabeth Ray

    Elizabeth Ray

  • Catherine PulmanPreview: Catherine Pulman

    Catherine Pulman

Technologies

React Native, React Native Maps, TypeScript, Google Maps APIs, Node.js, Jest, PostgreSQL, Supabase, ExpoPreview: React Native, React Native Maps, TypeScript, Google Maps APIs, Node.js, Jest, PostgreSQL, Supabase, Expo

We used: React Native, React Native Maps, TypeScript, Google Maps APIs, JavaScript, Node.js, Jest, SuperTest, PostgreSQL, Supabase, Render, Expo

Our app is built using React Native, allowing us to create a seamless experience across both the web and mobile. We utilised TypeScript for Front-End for strong typing to make collaboration easy, and React Native Maps for Map rendering of routes. We used Google Maps API Places, Routes and Photos to get the data about attractions in each city and to calculate our routes. We used JavaScript and PostgreSQL for Back-End to create our API and databases respectively.

Challenges Faced

React Native was new to all of us but since it is similar to React, we managed to get to grips with this framework fairly easily. However, developing an app that worked as both a web and Android app presented challenges in terms of the extra work involved in rendering different components and the styling according to the platform used.

TypeScript was also new to all of us but we wanted to challenge ourselves to take on a new language for the final project, that would also help to minimise type errors later on down the line.

The final hurdle was that we started out as a group of 5 for the planning phase of the project, but were down to just 3 by the time we started on the building phase. This meant we had to take more individual responsibility and prioritise our workload effectively to make sure our app had all the key features we wanted.

Thanks to all of our mentors for the amazing support throughout our project :D

FAQs

  • What features would you like to add?

    • Time-Based Itineraries: Adjust itineraries based on user’s available time, considering travel and visit durations.
    • Augmented Reality: Visualise nearby attractions and provide directions using AR.
    • Login Authentication: Update user logins with Supabase Authentication for increased security.
  • Any unexpected challenges during development?

    • Google Places API: Initial results included non-tourist locations like train stations and supermarkets. Refined API calls were necessary.
    • Accessibility Filtering: Difficult to filter for wheelchair accessibility due to incomplete data. We defined accessible attractions as those with an accessible entrance and accessible toilet.
    • API Limitations: API returns a maximum of 20 results per call, making it hard to generate extensive lists. Filtering for accessibility within these results led to smaller lists.