Angular 4 Tutorial - GPS Activity Mapping App

Published: 14 June 2017
on channel: Wes Doyle
54,190
789

In this video, I build a simple GPS route mapping application using Angular 4. We'll use the Angular CLI to scaffold the project and then create custom Components and Services to build an application with a list of runs with calculated totals, and a detail view with a customized map containing a route loaded from GPX data .

Link to code on GitHub: https://github.com/wesdoyle/ng-run-jo...

Check out my premium Angular + .NET Core Web API Premium Course at ProductiveDev:

https://productivedev.com/product/ng-...

Get 15% off a Pro Membership subscription by using promo code 'DEV2017' at checkout.

We'll use GPX File Format to plot routes - an XML schema for GPS data. If you need sample GPX data, you can find some here: http://www.wandermap.net/en/

Note that I'm using bash commands on the command line - for this, you'll need a terminal emulator like Bash on Ubuntu on Windows, Git for Windows, or Cmder.

Post a link to your code if you make improvements - I may mention your repository in a future video!

Some ideas for improvement:

Store and retrieve data from a back-end database service
Create functions to parse GPX data to calculate distance, elevation gain, etc.

Dependencies:
Typescript - https://typescriptlang.org
Node.js - https://nodejs.org/en/

Third Party Libraries:
Leaflet - http://leafletjs.com/
Mapbox - https://www.mapbox.com/api-documentat...
Bootstrap 3 - http://getbootstrap.com/


On this page of the site you can watch the video online Angular 4 Tutorial - GPS Activity Mapping App with a duration of hours minute second in good quality, which was uploaded by the user Wes Doyle 14 June 2017, share the link with friends and acquaintances, this video has already been watched 54,190 times on youtube and it was liked by 789 viewers. Enjoy your viewing!