In this Ionic Angular tutorial for beginners, we will learn Javascript mobile app development. This is an Angular mobile app example where we go through how to build a weather app with Javascript & Ionic 6.

DOWNLOAD PROJECT CODE https://bit.ly/34Vlp8T'>https://bit.ly/34Vlp8T

We will go over the following:

How to build the UI using HTML and style it using CSS
How to fetch data for our Javascript weather app from the openweathermap API using Angular Services
How to transform data using Angular Pipes
How to implement pull to refresh using the ionrefresher component

This is a stepbystep tutorial with detailed explanations along the way. Let's learn Ionic 6 by building an ionic 6 weather app!

Get the extended tutorial where we add more features to this weather app https://bit.ly/3gKGvJO'>https://bit.ly/3gKGvJO

TIMESTAMPS
00:00 Ionic Angular Weather App overview
00:36 Create a new ionic project
02:40 Toggle device frame view
03:48 Building the weather app UI
05:26 UI code explanation
09:28 Styling the UI
10:55 UI styles explanation
15:56 How to add Google Fonts to Ionic Angular App
20:30 Fetching data from OpenweatherMap API using Angular Services
23:05 Weather Service code explanation
27:26 Using the weather service in home.page.ts
28:07 home.page.ts code explanation
30:55 Populating our UI with dynamic weather data from the API
31:40 code explanation
37:01 Creating a custom Angular Pipe
53:34 Implementing pulltorefresh using ionrefresher

Get the extended tutorial where we add more features to this weather app https://bit.ly/3gKGvJO'>https://bit.ly/3gKGvJO

DOWNLOAD PROJECT CODE https://bit.ly/34Vlp8T'>https://bit.ly/34Vlp8T

Support codeswag on Patreon   / codeswag  

Social Media Links


Facebook   / codeswag.net  
Twitter   / codeswagyoutube  
Instagram   / codeswag.co.uk  

Support codeswag on Patreon   / codeswag  

Please support this channel by buying some awesome tech gadgets for yourself or a loved one from our online store at www.codeswag.net/shop

DOWNLOAD PROJECT CODE https://www.buymeacoffee.com/codeswag...