Laying the Foundations

Start off the case study by creating a new app and generating a Mapbox token.

Creating a new application

Let’s create a new Ionic project, install the required plugins and libraries, and create the Angular services for the app using the following commands:

ionic start appy-mapper blank --type=angular
cd ./appy-mapper
npx cap init appy-mapper com.saintsatplay.appyMapper
ionic build
npm install @capacitor/ios
npx cap ios
npm install @capacitor/android
npx cap android
npm install --save leaflet @asymmetrik/ngx-leaflet
npm install --save-dev @types/leaflet
npm install --save @ionic/storage
ionic generate service services/distances
ionic generate service services/manager
ionic generate service services/places
ionic generate service services/storage
ionic generate interface interfaces/countries
ionic generate interface interfaces/locations
ionic generate interface interfaces/store

Note: You can try running these commands in the terminal provided below.

Get hands-on with 1200+ tech skills courses.