Distance Matrix Routing App with Tom Tom API

Overview

Distance Matrix Routing App

Have you ever wanted to build a delivery app that will calculate the shortest distance from each drop off spot? Get extra API requests using ANIAKUBOW after(!) signing up, here: https://bit.ly/3uCAkvK

Now, for those of you who have never heard the buzz word Matrix Routing before, it is what we will be using to optimise our multiple deliveries by travel time.

We are going to be using TomTom Map SDK for Web, to show us the best route for us as the delivery driver, to drop off all three deliveries based on time, taking:

  1. The route into account
  2. The traffic on the roads into account.
  3. The traffic incidents on the roads into account

The final route is calculated using the “Routing API” which by default will do a “car”  route. But it can do way more than that. It can calculate the routes for motorcycles, vans, trucks or pedestrians! As you can image, the results will vary. 

Watch the full video here


In most videos I use Tabnine as my A.I autocompletion tool. You can download it for free here: http://bit.ly/tabnine-top-tool

You can get a blockchain domain with my affiliate link here: http://bit.ly/get-a-crypto-domain

If you would like to buy me a coffee, well thank you very much that is mega kind! : https://www.buymeacoffee.com/aniakubow

Sign up for weekly coding tips from my newsletter partnership: https://bit.ly/JS-tips

You can also find me on:


This project was bootstrapped with Create React App.

Available Scripts

To install all the packages:

npm i

In the project directory, you can run:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

You might also like...

The chat app built with microservice architecture, the app using: Lerna, pm2, GraphQL

The chat app built with microservice architecture, the app using: Lerna, pm2, GraphQL

Microservice Chat App A microservice app! Built With Lerna pm2 Graphql Sequelize Socket.io About The Project Here's why: I want learn socket.io and mi

Aug 27, 2022

Recipe providing mobile app, User selects ingredients in pantry and is then provided recipes for those ingredients. App contains a signup/login, meal planner and grocery list pages.

Recipog Student Information Name Connor de Bruyn Username Destiro Assignment SWEN325 A2 Description “Recipog” is a recipe providing app that allows th

Dec 26, 2021

React-app - Building volume rendering web app with VTK.js,react & HTML Using datasets provided in vtk examples (head for surface rendering and chest for ray casting)

SBE306 Assignment 4 (VTK) data : Directory containing Head and Ankle datasets Description A 3D medical viewer built with vtk-js Team Team Name : team-

Jul 19, 2022

Create Sonnat App - Set up a modern web app which is powered by Sonnat.

Create Sonnat App - Set up a modern web app which is powered by Sonnat.

Jan 31, 2022

"BookStore" is a web app for adding books. It is a Single Page App (SPA) that allows users to add and remove a book from the library

BookStore | M3Wx "BookStore" is a web app for adding and removing books from a library storage. It is a Single Page App (SPA) that allows users to add

Apr 11, 2022

Concircle scanner mobile app is application That helps you scan your order and position and to know if there are exact or not. it's cross-platform app.

Concircle scanner mobile app is application That helps you scan your order and position and to know if there are exact or not. it's cross-platform app.

Concircle scanner mobile app ⭐ Star on GitHub — it motivates Me a lot! Concircle scanner mobile app is application That helps you scan your order and

May 7, 2022

Web App to store a list of books (Title and Author) made as a single page app.

Awesome Books This project its an interactive list of books, you can add and remove items to the list. Built With HTML JS Getting Started In this proj

Nov 9, 2022

The JavaScript and API powered WordPress.com

The JavaScript and API powered WordPress.com

Calypso Calypso is the new WordPress.com front-end – a beautiful redesign of the WordPress dashboard using a single-page web application, powered by t

Dec 30, 2022

React friendly API wrapper around MapboxGL JS

react-map-gl | Docs react-map-gl is a suite of React components designed to provide a React API for Mapbox GL JS-compatible libraries. More informatio

Dec 31, 2022
Comments
  • Quick Fix: App not working

    Quick Fix: App not working

    Following the closed Issue, I have noted from the screenshot, that happens if you are not using the Tom Tom API key. And maybe if you've used the API key from the tutorial, it is clear that Ania said it will be deactivated. That is the quick view that I have found.

    Because I cannot reply to the closed issue

    opened by hesbon-osoro 0
  • App is not working

    App is not working

    hi @kubowania Love your videos btw

    Just wanted to say that app is not working after cloning the repo and adding my own API key after running npm run start command

    This is my output

    image

    As you can see there is no map visible

    opened by SiddheshKukade 0
  • Made changes widht property of app component

    Made changes widht property of app component

    @kubowania Mam after starting the application I was experiencing an error with the alignment of the main app component

    Found the bug and corrected it

    Have made the changes , please review and merge

    opened by Jassi10000 0
Owner
Ania Kubow
I make #JavaScriptGames for fun!
Ania Kubow
Declarative routing for React

React Router Declarative routing for React Docs View the docs here Migrating from 2.x/3.x? 3.x docs 2.x docs Packages This repository is a monorepo th

React Training 49.3k Jan 9, 2023
Read Blog. This is also a practical project. Working with APIs more and Routing and many new things.

React blog This is a React blog that created with a custom API. We serve the API in our system and run blog with it. Goals of this project In this pro

AmirHossein Mohammadi 7 Jul 25, 2022
Single Page Application built using React, Context API and OMDb API.

Movie Search App This project is a React application with functions to search for movies and add movies to favorites using OMDb API. Home Page Favorit

Efecan Pınar 24 Sep 6, 2022
A simple Weather app Using NOdeJs and API'S

weather-app A simple Weather app Using NodeJs and API'S It uses GeoCode API to find Latitude and Longitude and passes it to the WeatherStack API to fe

Parva Shah 5 Oct 5, 2022
IngredientRecipeFinder - Web app built with react using Edamam API to find any recipe for an ingredient search with nutrition filters (high protein, low carb,etc)

Ingredient Recipe Finder Web app This web app built with the use of Edamam API allows you to find any type of recipe for a specific ingredient you are

null 1 Jan 4, 2022
Fetching data from REST COUNTRIES API, this app (mobile version for now) gives information like area, population, capital, and borders for 195 countries from seven continents.

Space Travellers' Hub World Countries App works with an API which returns informations about 195 countries. Fetching data from REST COUNTRIES API, thi

Nicolae Pop 7 Aug 8, 2022
Web application that consumes an API to provide an complete experience of an recipes app

Project: Recipes App Project developed studying in Trybe. Technologies and tools used React React Hooks Context API SCRUM / Kanban Project objective T

Ádran Farias Carnavale 0 Jun 14, 2022
Edvora App is a web application based on an external API, showing data about different types of products and the user can filter these data by choosing a specific state, city or product name. Build with React.js

Edvora App is a web application based on an external API, showing data about different types of products and the user can filter these data by choosing a specific state, city or product name. Build with React.js

Kyrillos Hany 5 Mar 11, 2022
A web-app built with next.js that can automatically install mods into a new Minecraft or MultiMC Launcher Profile using the File System Access API

Mod Installer This is a Next.js App which automatically installs fabric mods on your PC and creates a Minecraft Launcher Profile for you. Idea & Inspi

Emma Böcker 18 Nov 27, 2022
A web app built with Covid-19-API that displays Covid 19 cases, deaths and recovery per country in the entire World

Covid19 Tracker A web app built with Covid-19-API that displays Covid 19 cases, deaths and recovery per country in the entire World Built With HTML, C

Promise Okechukwu 4 Nov 1, 2022