Want more? Check out some real Ionic clones here: th-cam.com/play/PLNFwX8PVq5q5K_ztYB5umsEu9p6SOQQSb.html Make sure to subscribe for more! th-cam.com/users/simongrimmdev_?sub_confirmation=1
Hi Simon , I was doing internship in a product based MNC. And I got tasks related to PWA , Push Notifications, Hybrid App Development etc . One senior suggested that with Ionic Angular these all things I could do . But I never worked with Ionic . Your Ionic videos helped me at each step , whenever I got stuck , you helped me at the very point . AND FINALLY I'VE GOT FULL TIME JOB IN THAT MNC . Can't thank you enough Simon ! Truely grateful to you ❤️. You helped me getting a good career opportunity.
This is one of the best videos I have ever found on Angular and Ionic learning for a beginner in this field! It's best to learn by building apps rather than by trying to only read documentation and not applying it anywhere. Thankyou! Will checkout all your videos!
Thank you Karan! I think the same, seeing something practical in action and following along is a great way to get a feeling for how things work with Ionic - let me know when you encounter problems :)
This video was great. Straight to the point with a real-example. That makes it really easy to understand without the extra fluff that steers us away from the basics
Fantastic video. Sometimes is good to get back to basics so we may fill any knowledge gap, as we sometimes do things without having very clear what we're doing. Nice one, Simon!
A note at 40:42 If you use .push(...spread-array) like the video, you might need to have to manually trigger detectChanges for the component to reload the UI if you are using OnPush strategy (since the .push does not change the instance of the array, which makes Angular consider it as it was not changed).
@@anggifergianp6566 Yes, if the array you are mutating using .push() method (which keeps the array reference after mutating) is inside a component using ChangeDetectionStrategy.OnPush, Angular might not be able to detect it. The way @lastbreath2437 suggested is the correct way in that case. (Or you can manually trigger change detection using ChangeDetectionRef If I remember correctly).
Thanks, really appreciate the time and effort you put into these videos ! They work and make the topic really simple to understand and follow - 100 thumbs up !
@@galaxies_dev will do - I have made a simple application to test the implementation using a custom jwt provider through Laravel 9 (php framework and very popular) and the ionic app - this is the base I will use for all my applications going forward - not sure if you would like me to share this with you at some point - good alternative to use if you don't want to make use of cloud providers like firebase ?
Great Tutorial. Please how to make my ionic apk built with appflow and capacitor able to connect to my deployed api URL ? I'm getting an 0 unknow error issue
I have an issue with my code concerning the event when trying to implement infinite scrolling, it says that the event is of type event and isn't assignable to parameter of type InfiniteScrollCustomEvent
Super good tutorial 👍🏻👍🏻. Idk angular just feels good even at work or for personal projects. Been hopping a lot on react / react-native / native / flutter / etc etc but ionic seems good along with ofc angular.
Yeah feeling the same - it has a learning curve but projects tend to have a decent structure and you easily get into other peoples code as well with Angular!
Thanks for your time and effort. Just strated a proyect its been 5 years since My last one and your series comes really handy. I have a question maybe anyone can help figure out. I need to stream a live vídeo within My app. Tried using stream media wo success, is it worling on iónic 6 capacitor?
Hi Simon...it's very helped to me. But I want to integrate .aar file which is generated using ionic/cordova and integrate with another third-party app. I have tried but getting issues with cordova plugins saying, class not found exception. Would you please suggest the approach ?
Simon, could you do a tutorial with resolutions of build issues and conflicts that ionic 6 is currently having with angular. It's been a headache. Thanks!
Hi Simon I am trying to integrate paid api for voice and video calling in ionic Cordova app but unable to implement it. So will you please guide me for that how can I implement this. Please provide me a solution for that as soon as possible.
Hello @Simon_Grimm, can you please make a video how to connect with thermal printers, (receipt printer) from ionic app, any printers really, using bluetooth or wifi
Could you please upload a Tutorial on configuring Android Studio and how the debugging works, I have been facing so many challenges when I try to load my web app as an app.
how about using a shortcut instead of ur if. i use e for event and i tested it with 3 pages max. not as read-able, as an if, but react devs do this e && (e.target.disabled = data.page === 3);
Hey Simon! Nice tutorial. I know its quite old for you now and hopefully you can answer. I have a problem with the movie types. If I define response as any in service file and movies as an array in page file. I am not able to do the spread operation onto movies because typescript complains "Type 'any[]' is not assignable to type 'never[]'". What could be the problem here?
The foreground service is a native feature of Android. In order to have that feature in your ionic application, you need to use a capacitor plugin or a cordova plugin. Thouse plugins expose to your application the native functionalities of the device like camera, file system, sensors, or, in your case, foreground services. Refer to the explanation of Simon in 55:02 The official documentation suggests this plugin: ionicframework.com/docs/native/foreground-service This is a cordova plugin, but worry not! If your ionic application uses capacitor, well, capacitor is capable of using cordova plugins too! (most of them). If this plugin doesn't fit your requirements, you can always build your custom plugin for capacitor. Simon has also a video about that topic: th-cam.com/video/Nf-mOfmD7X4/w-d-xo.html
same issue, ionic 7 does not include the app.module.ts file i've been trying to find out where to declare the HttpClientModule without creating the app.module file but no luck
I bought your ebook but I have problems running pizzaShop app on my laptop. I need to update npm. I deleted npm but having problems reinstalling it. Can you guide me how to completely uninstall node and npm so then I can install nodeJs fresh. I really enjoy going through the ebook. Thanks for putting out there.
I am not finding my self working with ionic capacitor I tried alot when I try to run the applciation in android simulation I am getting network_refused error while calling the api , While my api is working fine ... It is hard to configuration
@@galaxies_dev getting error 404 page not found when searching for the popular movies, any others know how to fix this issue? My code is identical to Simon's!
When running on android the images are not loading, after debugging it was happening because of CORS error. Any guilde how to deal with CORS in case of android.
You can only fix CORS inside the API or use a proxy, but usually this API has CORS implemented! Maybe you used a wrong URL without SSL and got redirected or something like that?
2 ปีที่แล้ว
I got the same issue. The problem is that API for images is called with http instead of https in the tutorial (images property in the environment.ts file)
It's an introduction to many of the Ionic components and concepts to build an app - but feel free to use any other introductory video from other creators if this was too fast for you!
I got an error with InfiniteScrollCustomEvent ("Argument of type 'Event' is not assignable to parameter of type 'InfiniteScrollCustomEvent'."), so I just changed in the movies.page.html "(ionInfinite)="loadMore($event)" to "(ionInfinite)="loadMore($any($event))" and it worked, saw the answer on stackoverflow...
My app works perfectly on the browser but when I generate the app-debug.apk and install on my android device the request just don't works and not returns the data. Whats is the possible problem?
Want more? Check out some real Ionic clones here: th-cam.com/play/PLNFwX8PVq5q5K_ztYB5umsEu9p6SOQQSb.html
Make sure to subscribe for more! th-cam.com/users/simongrimmdev_?sub_confirmation=1
Hi Simon , I was doing internship in a product based MNC. And I got tasks related to PWA , Push Notifications, Hybrid App Development etc . One senior suggested that with Ionic Angular these all things I could do . But I never worked with Ionic . Your Ionic videos helped me at each step , whenever I got stuck , you helped me at the very point . AND FINALLY I'VE GOT FULL TIME JOB IN THAT MNC .
Can't thank you enough Simon ! Truely grateful to you ❤️.
You helped me getting a good career opportunity.
Wow that is so amazing to hear - congratulations on your job mate!!
I am gonna build a mobile app for my web project by following your video. Let's get started :D
All the best for the project Emre!
Did u finish the app?
This is one of the best videos I have ever found on Angular and Ionic learning for a beginner in this field! It's best to learn by building apps rather than by trying to only read documentation and not applying it anywhere. Thankyou! Will checkout all your videos!
Thank you Karan! I think the same, seeing something practical in action and following along is a great way to get a feeling for how things work with Ionic - let me know when you encounter problems :)
This video was great. Straight to the point with a real-example. That makes it really easy to understand without the extra fluff that steers us away from the basics
Happy to hear - give it a share if you enjoyed it ✌️
Fantastic video. Sometimes is good to get back to basics so we may fill any knowledge gap, as we sometimes do things without having very clear what we're doing. Nice one, Simon!
Very true, and glad you enjoyed it David!
honestly the best soft tutorial ive ever seen. short and straight to the point ! i love it
Thank you Asif 🙌
A note at 40:42
If you use .push(...spread-array) like the video, you might need to have to manually trigger detectChanges for the component to reload the UI if you are using OnPush strategy (since the .push does not change the instance of the array, which makes Angular consider it as it was not changed).
Thanks for pointing it out!
Or we can do this.movies = [...this.movies, ...spread-array] this trigger detectChanges automatically
@@AntonGorbachevDev thanks for this
do you mean changeDetection: ChangeDetectionStrategy.OnPush ?
@@anggifergianp6566 Yes, if the array you are mutating using .push() method (which keeps the array reference after mutating) is inside a component using ChangeDetectionStrategy.OnPush, Angular might not be able to detect it.
The way @lastbreath2437 suggested is the correct way in that case. (Or you can manually trigger change detection using ChangeDetectionRef If I remember correctly).
i cant explain how helpful your videos are !! please make more videos on react & ionic
Thank you! Will do!
Thanks, really appreciate the time and effort you put into these videos ! They work and make the topic really simple to understand and follow - 100 thumbs up !
Thanks a lot CJ - would help me a lot if you could share the tutorial on your preferred SM platform 🙌
@@galaxies_dev will do - I have made a simple application to test the implementation using a custom jwt provider through Laravel 9 (php framework and very popular) and the ionic app - this is the base I will use for all my applications going forward - not sure if you would like me to share this with you at some point - good alternative to use if you don't want to make use of cloud providers like firebase ?
Thank you for such a detailed and well made tutorial. It was a great starting point.
Glad you enjoyed it!
Why Api Not Working if my project CRUD compile to android studio ?
Congrats, Simon. Where is the source code? Please share the git repo with us
Mate, this video is awesome! Thanks a lot for that!
Thank you!
Very good tutorial
Thank you!
great work... this was a great tutorial for me as a beginner
Really amazing. Thanks
Great video, thanks!
You're welcome!
Awesome video Simon, I have learnt a lot. Well done.
Glad it was helpful!
thank you , done successfully ^^ , good job man !
Glad I could help!
very nicely explained with neat and clean code
! Keep Teaching 👍
Thanks, I will 💪🏻
Great video man!
Glad you liked it!
Man, fantastic video, thank you so much! XD
Glad you enjoyed it Caio!
thank u for shareing Ionic video
My pleasure!
Great Tutorial. Please how to make my ionic apk built with appflow and capacitor able to connect to my deployed api URL ? I'm getting an 0 unknow error issue
Thank you for this video. This is helpful. :)
Glad it was helpful!
I built this project and build it on android studio but when I turn on my app on my phone it lost images do you know how to fix it ?
I have the same problem
Muito bom Sir Simon!
I have an issue with my code concerning the event when trying to implement infinite scrolling, it says that the event is of type event and isn't assignable to parameter of type InfiniteScrollCustomEvent
thank you bro thank you
You're welcome!
Super good tutorial 👍🏻👍🏻. Idk angular just feels good even at work or for personal projects. Been hopping a lot on react / react-native / native / flutter / etc etc but ionic seems good along with ofc angular.
Yeah feeling the same - it has a learning curve but projects tend to have a decent structure and you easily get into other peoples code as well with Angular!
Thanks for your time and effort. Just strated a proyect its been 5 years since My last one and your series comes really handy.
I have a question maybe anyone can help figure out. I need to stream a live vídeo within My app. Tried using stream media wo success, is it worling on iónic 6 capacitor?
Hello simon i want to integrate venmo payment in ionic then how to do it please provide some suggestion
Do a video tutorial on background geolocation that get gps data for a x amount of time in ionic
Please simon im having an error and I don't know how to solve it... Cannot find module 'is-docker'...
getting error 404 page not found when searching for the popular movies, any others know how to fix this issue? My code is identical to Simon's!
the same problme here... any solution? @galaxies_dev
Unable to see service page in my project do i need to add it manually or bya some command pls help
Hi Simon...it's very helped to me. But I want to integrate .aar file which is generated using ionic/cordova and integrate with another third-party app. I have tried but getting issues with cordova plugins saying, class not found exception. Would you please suggest the approach ?
Simon, could you do a tutorial with resolutions of build issues and conflicts that ionic 6 is currently having with angular. It's been a headache. Thanks!
What kind of build issues? I haven't experienced any problems with latest Ionic versions!
Hi sir,
Am using rest api in my capacitor app , that's call fine and getting success response from brower , but in device that returns errorcode 0
Thank you So much. Sir can u make a search bar too, I need that to learn this ionic 6
Sure I'll add this to my list!
Hi Simon
I am trying to integrate paid api for voice and video calling in ionic Cordova app but unable to implement it. So will you please guide me for that how can I implement this. Please provide me a solution for that as soon as possible.
Did ionic have same job opportunities compared to native iOS, Android and cross platform flutter, Reactnative which is having more opportunities?
React Native has the most, followed by Flutter. The Ionic market is a lot smaller currently.
Hello @Simon_Grimm, can you please make a video how to connect with thermal printers, (receipt printer) from ionic app, any printers really, using bluetooth or wifi
Yeah good idea, just need such a device first :D
Could you please upload a Tutorial on configuring Android Studio and how the debugging works, I have been facing so many challenges when I try to load my web app as an app.
I've got a guide on debugging here as well: ionicframework.com/blog/debugging-tips-for-your-ionic-app/
Hello Thanks For Your Videos😍 Do you have any Video For PWA In Ionic? In IIS?
Hey yeah you could check this: th-cam.com/video/HQxRGI42VDE/w-d-xo.html
Thank you! Nice video👍
Please could you upload for us the source file to download?
Link is in the description to the written version!
how about using a shortcut instead of ur if. i use e for event and i tested it with 3 pages max. not as read-able, as an if, but react devs do this
e && (e.target.disabled = data.page === 3);
Sir you forgot to tell us why the opened android studio got error when syncing
Hi Sim, when i run * ionic cordova build ios * the terminal returns: Error unknow argument: platform
Maybe because you are using Capacitor in your app?
Why don't you upload code what created in this video
It will be more helpful
Thanks
The tutorial is linked below the video :)
@@galaxies_dev
Thank you for reply
Hey Simon! Nice tutorial.
I know its quite old for you now and hopefully you can answer.
I have a problem with the movie types. If I define response as any in service file and movies as an array in page file. I am not able to do the spread operation onto movies because typescript complains "Type 'any[]' is not assignable to type 'never[]'". What could be the problem here?
You can simply initialise the array as an empty array, that should fix the never warning!
got some problems with infinite scroll,
`Type 'Event' is missing the following properties from type 'InfiniteScrollCustomEvent'`
How i can solve this?
I had the same error and don't know why Simon Grimm didn't encounter the same error.
Easy workaround:
Declares the $event to be of type $any.
Hello, greetings from Colombia. I have a request, is it possible to make a foreground service ionic class
The foreground service is a native feature of Android. In order to have that feature in your ionic application, you need to use a capacitor plugin or a cordova plugin. Thouse plugins expose to your application the native functionalities of the device like camera, file system, sensors, or, in your case, foreground services. Refer to the explanation of Simon in 55:02
The official documentation suggests this plugin: ionicframework.com/docs/native/foreground-service
This is a cordova plugin, but worry not! If your ionic application uses capacitor, well, capacitor is capable of using cordova plugins too! (most of them).
If this plugin doesn't fit your requirements, you can always build your custom plugin for capacitor. Simon has also a video about that topic: th-cam.com/video/Nf-mOfmD7X4/w-d-xo.html
Can we get a live project with Ionic + React?
Sure, working on some React material already!
@@galaxies_dev Thank you so much Simon!!
Ionic - Aye! I'm on, this landmas - Natives.
I am following the tutorial now and i do not have the app.module.ts file, should I create it ??
same issue, ionic 7 does not include the app.module.ts file i've been trying to find out where to declare the HttpClientModule without creating the app.module file but no luck
They updated to Angular standalone components, check out my video about it: th-cam.com/video/Y0vH5Cm3HAk/w-d-xo.html
Awesome 😎 can I upgrade from ionic 5?
Yes you can
@@galaxies_dev ok thanks
I bought your ebook but I have problems running pizzaShop app on my laptop. I need to update npm. I deleted npm but having problems reinstalling it. Can you guide me how to completely uninstall node and npm so then I can install nodeJs fresh. I really enjoy going through the ebook. Thanks for putting out there.
Please send me an email with the exact issues so I can take a look Ted!
@@galaxies_dev
Will do thanks!
Is Ionic free to build apps with and launch?
Yes, 100% open source.
I am not finding my self working with ionic capacitor I tried alot when I try to run the applciation in android simulation I am getting network_refused error while calling the api , While my api is working fine ... It is hard to configuration
Ionic:
Ionic CLI : 6.19.0
Utility:
cordova-res : 0.15.4
native-run : not installed globally
System:
NodeJS : v14.16.0
npm : 6.14.11
OS : Windows 10
i have a problem in the interface of the movieApp. There is nothing in the index page(movie)
anyone can help me ? {{ item.title }} not recognize
{{item.title}}
Did you take a look at the structure of each item? Maybe there is no title or something wrong with your array!
@@galaxies_dev getting error 404 page not found when searching for the popular movies, any others know how to fix this issue? My code is identical to Simon's!
@@akaz261 same problem here,
@@galaxies_dev i have the same problem, my code is like the tutorial, I made ctrl c + v to test, and doesn't works =(
Will this work in Ionic 7? Cause I came across an issue => ( ERROR Error: Uncaught (in promise): NullInjectorError: )
Ionic 7 uses Angular Standalone modules, so you need to import the according packages directly in your component!
When running on android the images are not loading, after debugging it was happening because of CORS error.
Any guilde how to deal with CORS in case of android.
You can only fix CORS inside the API or use a proxy, but usually this API has CORS implemented! Maybe you used a wrong URL without SSL and got redirected or something like that?
I got the same issue. The problem is that API for images is called with http instead of https in the tutorial (images property in the environment.ts file)
thanks i have done ur tutorial but after deploy on android why no image ya
That's hard to say, but you can use remote debugging to check the logs: th-cam.com/video/akh6V6Yw1lw/w-d-xo.html
@@galaxies_dev alright2 ill check it out thanks @Simon Grimm
Did you versionate the code? Can we access that?
Link to the tutorial is below the video in the description!
in minutes 29:28 i'am troble. Why ?
same, did you fix that??
sir ma ya wala kam cap pr kr rha ho lakin nhi ho rha agr koi cap wali app pr koi video ha to send in link for same kam
bhai wo english hy agr kuch bolna hy to english mein bol
Thank you for not leaving out the capacitor haha
No worries!
Spitting hard words 🗿
What is the idea here ?? cover as much topics within least possible time or teach people something solid ? (dislike !)
It's an introduction to many of the Ionic components and concepts to build an app - but feel free to use any other introductory video from other creators if this was too fast for you!
I got an error with InfiniteScrollCustomEvent ("Argument of type 'Event' is not assignable to parameter of type 'InfiniteScrollCustomEvent'."), so I just changed in the movies.page.html "(ionInfinite)="loadMore($event)" to "(ionInfinite)="loadMore($any($event))" and it worked, saw the answer on stackoverflow...
Thanks, I was getting that too with Ionic 7!
My app works perfectly on the browser but when I generate the app-debug.apk and install on my android device the request just don't works and not returns the data. Whats is the possible problem?
Are you using HTTPS? Because Android needs specific settings if you want to make insecure http calls (http)!
@@galaxies_dev I just add a "s" and worked! lol Thank uuuuuu 😘😍🤩
Very good tutorial
Glad you liked it!