Full-Stack Developer Assignment

Welcome to Your Technical Assignment Phase! You've successfully made it past the initial
screening, and now it's time to showcase your technical skills. In this phase, you are
required to complete one of the following tasks:

1. Google Maps API Task: Implement a web application with a map, displaying a route
and real-time progress.
2. Creative Feature Implementation Task: Develop a custom feature using the Google
Maps API that enhances our understanding of transportation data.

Please select the task that best aligns with your strengths. You are encouraged to
implement only one task, but feel free to enhance it with additional features as you see
fit. Expect to spend 4-8 hours on this challenge and submit your best work via a GitHub
link. This practical test is your opportunity to impress us with your problem-solving and
coding abilities as you move closer to becoming a key part of our team.
Task 1: Real-time Ride-Share Tracking
Context:

Imagine you're a driver for a transportation agency in Kigali, ready to embark on your
daily route from Nyabugogo to Kimironko. It's your responsibility to pick up passengers at
five stops along the way. To help you and your passengers stay coordinated, you need a
platform that tells you how far you are from the next stop and how long it will take to get
there.

Objective:

Develop a web page, as illustrated in the screenshot, that utilizes the Google Maps API
to navigate a route. The page should display the estimated time to reach each upcoming
stop.

Route Details:

We’ve provided the geographical coordinates for the starting point, intermediate stops,
and ending point.

 Starting Point: Nyabugogo (-1.939826787816454, 30.0445426438232)

 Intermediate Stops:
 Stop A: (-1.9355377074007851, 30.060163829002217)
 Stop B: (-1.9358808342336546, 30.08024820994666)
 Stop C: (-1.9489196023037583, 30.092607828989397)
 Stop D: (-1.9592132952818164, 30.106684061788073)
 Stop E: (-1.9487480402200394, 30.126596781356923)
 Ending Point: Kimironko (-1.9365670876910166, 30.13020167024439)

Task Details:

 Create an interactive map displaying the entire route with marked stops.
 Implement real-time tracking of the driver's current location.
 Calculate and display the ETA for the next stop, assuming constant average speed.

Recommended Technologies:

 Front-end: React.js
 Google Maps API for mapping and routing functionalities.

Deliverables:

 Submit your code in a GitHub repository with a README.md file explaining your
approach and setup instructions.
 Ensure the application's UI closely matches the provided Figma design screenshot.
 Be prepared to discuss your code, README, and design choices during the interview.
Task 2: Custom Feature Implementation Using Google Maps
API
Objective:

Develop a unique, mobile-first web page that showcases your proficiency with the Google
Maps API. This task allows you to demonstrate creative use of mapping technologies in
a transportation context. Your implementation must clearly utilize the Google Maps API to
be considered for further steps in the selection process.

Examples of Potential Features:

 Commuter feature: A tool that helps commuters locate and time their bus arrivals in
real-time, reducing waiting times.
 Vehicle Locator: An application for finding available cars in the vicinity, displaying
distance and estimated arrival time to the commuter.
 Route Optimizer: A feature that suggests the best routes for commuters based on
current traffic and transit schedules.

Recommended Technologies:

 Frontend: React.js
 APIs: Google Maps API for geolocation and mapping features
 Styling: CSS and potentially frameworks like Bootstrap or Material-UI for responsive
design

Deliverables:

 A fully functional web page optimized for mobile devices.

 The page must interact dynamically with the Google Maps API to incorporate
mapping data and features relevant to transportation.
 Source code must be submitted via a GitHub link, including a README file with
setup instructions and a detailed explanation of the feature implemented.

Evaluation Criteria:

 Creativity and relevance of the feature implemented.

 Effective use of the Google Maps API to enhance user interaction with transportation
data.
 Quality and clarity of code, including the use of React.js components.
 Responsive and user-friendly design, especially for mobile users.

This task is designed to let you flex your development muscles and show how you can
integrate complex APIs into useful, real-world applications. Be mindful to leverage the
Google Maps API extensively; the strength of your skills in this area will be a critical factor
in your evaluation.