Code with Technyks
Code with Technyks
  • 5
  • 5 800
Complete Ionic Course in Hindi (2024) | Build iOS & Android Apps with Ionic Angular
Complete Ionic Course in Hindi (2024) - Build iOS & Android Apps
In this 6-hour tutorial, you'll learn everything about Ionic Framework, including creating iOS and Android apps using Angular. We cover both ngModule and Standalone approaches, with real-world projects to guide you.
----------------------------------------------------------------------------------------------------------------------------------------------------
Add-on videos you can watch:
► Angular complete course in HIndi - ua-cam.com/video/_PQ7NSppj3Q/v-deo.htmlsi=T1s1hfsZH7wcfdlh
English videos:
► Ionic UI series (Android & iOS): bit.ly/Ionic-ui-series
► Finance App Series: bit.ly/finance-app-ui-series
► Ionic Capacitor Generate APK & Run in Android & iOS: ua-cam.com/video/krTN38Z-Ux4/v-deo.html
----------------------------------------------------------------------------------------------------------------------------------------------------
►🔥 All Courses Now Only ₹499/$13.99! Limited Time Offer! Hurry Up and Grab Your Spot! 📚🚀 | Link to the discounted courses : codewithtechnyks.com
1. Ionic 8+ & NodeJS: Beginner to Pro-Build Food Delivery App: bit.ly/ionic-nodejs
2. Ionic 8+ From Beginner to Advanced - Build Food Delivery App : bit.ly/ionic-firebase-full-course
3. NodeJS: Beginner to Pro - APIs for Food Delivery & Ecommerce: bit.ly/nodejs-backend-course
4. Ionic 8+ Chat App using Firebase:
bit.ly/ionic-chat-app-course
----------------------------------------------------------------------------------------------------------------------------------------------------
► Check out our Templates & Code scripts
1. Ionic 8+ Food Delivery Customer App template (ngModules & standalone): bit.ly/Food-delivery-customer-app-template
2. Ionic 8+ Food Delivery Complete Platform (including Customer, Restaurant, Rider Apps & Angular Admin panel):
bit.ly/Food-delivery-app-platform
----------------------------------------------------------------------------------------------------------------------------------------------------
► Social Media
Facebook: CodingTechnyks
Github: github.com/Nykz
Instagram: codingtechnyks
Twitter: codingtechnyks
Timestamps:
00:00 - Intro
01:15 - What is Ionic?
02:44 - Understanding Ionic Ecosystem & Working
08:14 - Capacitor vs Cordova
10:25 - Understand use of NodeJS
12:26 - Installing NodeJS and npm & Ionic Cli
18:41 - How to install Angular Cli
20:28 - Create First Ionic Project (ngModule) & Running in browser (Windows)
33:54 - Setup VS Code Editor
37:00 - Understanding File Structure & running app in different port
48:41 - Setup in MacOS - Create Ionic (Standalone & NgModule) Project & Setup VS Code Editor
55:04 - Standalone vs NgModule & Understanding difference in file structure
01:05:24 - Running both projects
01:09:22 - Understanding Ionic Components (tags) using Ionic framework docs in ngModule project
01:31:32 - Theming in Ionic Apps
01:38:22 - Sync code with Ionic standalone project
01:41:28 - How files linked with each other in Ionic App?
01:44:36 - Designing Ionic App (Home Screen - Grocery List App)
01:57:07 - Understand Routing & Navigation in Ionic Angular (NgModule & Standalone) Apps with Lifecycle hooks
02:23:28 - Design Item Detail Screen
02:32:54 - Use of Services
02:42:22 - Preparing Grocery List App with Capacitor Native plugins (Camera plugin)
03:17:18 - Preferences plugin
03:19:52 - Converting into a To-do List App
03:22:58 - Forms in Ionic (Add items in To-do List App)
03:34:39 - Add Ionicons in Standalone App & change app theme - Forms
03:56:05 - Submit form, save in Preferences, manage state with BehaviorSubject, and perform CRUD in Ionic.
04:08:30 - Redesign Home Screen & perform CRUD
05:02:36 - Sync code in NgModule project
05:09:01 - Setup Android Studio for Android App & run app in Emulator
05:37:25 - Setup Xcode for iOS App in MacOS
05:43:52 - App platforms & Build App for Web, Android & iOS
05:46:43 - Passing Permissions & Syncing project
05:57:30 - Running in Android Emulator & iOS Simulator
06:07:58 - Outro
📌 Key Highlights:
Understand the Ionic Ecosystem, differences between Capacitor and Cordova
Learn how to use Ionic with Angular to create mobile apps
Real-world project: Build a Grocery List/To-do List App
Integrate Capacitor Native Plugins (Camera, Preferences)
Manage app state with BehaviorSubject and perform CRUD operations
Perfect for both beginners and advanced learners who want to master Ionic development. By the end of this course, you will be able to build stunning cross-platform mobile apps for iOS and Android.
#ionicframework #ioniccourse #mobileappdevelopment #webdevelopment #angular #frontenddeveloper #frontenddevelopment #capacitor #cordova #ionicangular #ionictutorial #learnionic #hybridapps #techtutorials #appdevelopment #ionicnative #ioniccomponents #ionic
#ionicangular #course #ioniccourse #ionicangularcourse
Переглядів: 390

Відео

Complete Angular Course in Hindi (2024)
Переглядів 4,6 тис.День тому
Welcome to the Complete Angular Course in Hindi (2024)! This 7 hour tutorial takes you from beginner to advanced, covering everything you need to know about Angular and also make a working website on the go. Learn about components, services, routing, RxJS, Signals and more, all in Hindi! Whether you're a newbie or looking to sharpen your skills, this comprehensive course is perfect for you. Add...

КОМЕНТАРІ

  • @gamerz7307
    @gamerz7307 15 годин тому

    Please upload a video on Typescript

  • @Ankitkumar-db3ld
    @Ankitkumar-db3ld 15 годин тому

    Is this job ready tutorial please reply

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 11 годин тому

      It will help you to learn angular… to get jobs in angular framework you need to create bigger projects than this, show it in your portfolio This course will help you to adapt to the core with latest features which is hard to find altogether… Will bring part 2 on route guards which is very important…after learning that only thing needed is to execute a big project…which you can work on yourself Also will bring a video on admin portal creation with angular If you do all these then you will be ready for angular jobs

  • @Lugia-vr6zi
    @Lugia-vr6zi День тому

    i m early waiting for typescript course

  • @VarunGodiya
    @VarunGodiya День тому

    brother please bring typescript course including practise problems and also cover advanced typecript topics so that we do not need any other typescript tutorial in furure . please bring it fast because after leaning ts i m goona learn angular

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial День тому

      Yes i will, its in progress...share asap what all extra things you want to see in it...apart from beginner level stuffs....

  • @rcciit9226
    @rcciit9226 День тому

    sir is there any way to get its code also where to get these images, please tell us about images

  • @CodingJagat
    @CodingJagat 2 дні тому

    Ek app Hindi me jaha sara kuchh cover 🤗 duration kitna v ho

  • @CodingJagat
    @CodingJagat 2 дні тому

    It was great bhaiya.. English wala se jada ye interesting aur samjh me aya.. bas a small advice ki app video bana rahe hain to pahle se decide kar lijiye kya kya padhane hai aur kaise kaise honge karke.. like UI kaisa honge.. Kon sa app rahega and kon sa topic.. pahle se preparetion kar le.. taki sort time me rich content delivery aur achha samjha paye aur samajh me ayega 🤗 small request!!

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial День тому

      Noted! Due to addition of some new stuffs I had to change few things that’s why prepared the outline But in case of UI, I wanted to go with a clear mind to make you understand everything But anyways if you guys want me to be prepared beforehand, no problem…will do that

  • @savinaymahajan9735
    @savinaymahajan9735 2 дні тому

    Sir please full stack REACT NATIVE AND also how to upload it to android and ios

  • @neelmanibhardwaj2968
    @neelmanibhardwaj2968 3 дні тому

    sir, ye 1:27:19 pr agar hm ek page poora hi change krna chahte hn bina RELOAD kre, to fir kya karenge, agar sirf ek section change krna chahe wo to samajh gye pr poore document ko kaise change kr skte hn

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 2 дні тому

      If you have to change the entire page then you change in app.component.html or create a component let’s say home Then call the home component in app.component.HTML file directly with no other code in app.component.html file If you do that, then the entire page will change, try it

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 2 дні тому

      If you have more doubts related to it then accumulate them and connect via Instagram

    • @neelmanibhardwaj2968
      @neelmanibhardwaj2968 2 дні тому

      @@CodewithTechnyksofficial yes sir , i have tried it. it worked. Thanks

  • @rcciit9226
    @rcciit9226 3 дні тому

    sir, its amazing after completing your angular video, i will move on to this one

  • @VarunGodiya
    @VarunGodiya 3 дні тому

    Next js course please

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 3 дні тому

      Yes i will but it will take some time as i will try to bring my best content for you all...possibly within this year as many things are lined-up. Will try to work on it asap...till then enjoy this course for app development...thanks for your love and support

  • @thebcageek1
    @thebcageek1 3 дні тому

    TypeScript Course Please 🙏❤

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 3 дні тому

      Coming soon within this month...till then enjoy this course for app development...thanks for the love and support...share it as much as you can

  • @AshwaniKumar-kt6fv
    @AshwaniKumar-kt6fv 4 дні тому

    Sir agli baari next js ki

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 3 дні тому

      Yes i will but it will take some time as i will try to bring my best content for you all...possibly within this year as many things are lined-up. Will try to work on it asap...till then enjoy this course for web development...thanks for your love and support

  • @AshwaniKumar-kt6fv
    @AshwaniKumar-kt6fv 4 дні тому

    Wow sir

  • @diyaagarwal0442
    @diyaagarwal0442 5 днів тому

    Really very helpful sir, good decision to start another channel on Hindi, very comfortable learning in hindi😊

  • @neelmanibhardwaj2968
    @neelmanibhardwaj2968 5 днів тому

    I am at 1:06:00 ,and till here everything is perfect, excited forward

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 5 днів тому

      I am glad to hear that you are liking it...feel free to ask any doubt, i will try to answer asap

  • @Miraj-x2g
    @Miraj-x2g 5 днів тому

    😍 I am gonna edit this comment and I'll provide my review after the whole course ❤

  • @al-baghdadi7914
    @al-baghdadi7914 5 днів тому

    code bhi nhi diya github pe kya iska

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 5 днів тому

      In GitHub you will find code of videos from my English Channel Will share the code soon

  • @al-baghdadi7914
    @al-baghdadi7914 5 днів тому

    as a beginner the start was good , thoda thoda samaz aa raha tha , phir jaise hi 5-6 chize ek sath hone lagi jo pahlele aaiya tha samaz vo bhi nhi ara ab , its not ki the course is bad , you are teaching it in a really good manner , but there are times mujhse aaisa laga ki aap just ki chize work kare project mai is liye kar rahe ho rather than aap padha rahe ho . Dont know how to understand as there are a lot of things going on jo samazna muskil ho gaya hai

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 5 днів тому

      May I know where you are getting stuck or finding it complicated, will explain that parts in another video for beginners with better examples Just let me know the topics from timestamp

    • @al-baghdadi7914
      @al-baghdadi7914 5 днів тому

      @@CodewithTechnyksofficial sir its where when you started file logic , when you started optimising the code to reduce redundancy, after that part its became like a bouncer to understand as without optimization the code flow you told was in the mind and after that it was all gone because the code started fresh

  • @SujalAgarwal-h9g
    @SujalAgarwal-h9g 7 днів тому

    Thats great🎉

  • @_pathak
    @_pathak 7 днів тому

    At the lazy loading part , the understanding level suddenly goes down by 90% . As a beginner , that got too heavy due to lack of explanation

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 7 днів тому

      Sorry to hear that, let me try to explain here again in brief: Lazy loading is a technique that makes your Angular app faster by loading only the parts of the app that the user actually needs at a given moment. For example, if your app has sections like Home, Courses, About, and Admin, without lazy loading, all of these would load as soon as the app starts, even if the user is only viewing Home. This can make your app slower. With lazy loading, you can tell Angular to load the Admin section only when the user clicks on the Admin link. This reduces the initial load time, improves performance, and ensures the app stays lightweight. In traditional Angular projects, lazy loading is usually achieved through routing by using the loadChildren property. For example: { path: 'admin', loadChildren: () => import('./admin/admin.module').then(m => m.AdminModule) } In standalone Angular projects (using Angular 14 and above), lazy loading can be done in a similar way but instead of loading a module, you can load standalone components. For instance, using the loadComponent method in the route: { path: 'admin', loadComponent: () => import('./admin/admin.component').then(c => c.AdminComponent) } This makes lazy loading more flexible, especially for projects that follow the standalone component approach. I hope this clarifies things! Feel free to ask doubts here, for more content check out my English channel - ua-cam.com/users/CodingTechnyks

  • @musicfire3890
    @musicfire3890 8 днів тому

    Hello brother beofre starting this video need info , in this video , apne auth gards or authentication use kiye hai ?

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 7 днів тому

      Hi, authentication is not included…will bring a separate video on that Auth guards will be explained there nicely

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 7 днів тому

      You can check my English Channel Coding Technyks (ua-cam.com/users/CodingTechnyks) to learn about auth guards using ionic angular

    • @abhinavmishra863
      @abhinavmishra863 7 днів тому

      Thanks for your efforts....Lot of love ❤

  • @vikrantrana9368
    @vikrantrana9368 8 днів тому

    will this 7 hours of video give a good start for a beginner? please reply?

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 7 днів тому

      Hi I understand your doubt If you are familiar with html, css, js then go ahead with the course as a beginner otherwise learn it before starting I will also bring videos on html css js complete guide but it will take time as it has to be unique and good quality courses

  • @rcciit9226
    @rcciit9226 8 днів тому

    sir, can you update the timer after add and fetch localstorage

  • @VarunGodiya
    @VarunGodiya 8 днів тому

    Typescript crash course

  • @AhmedKhan-v4j8l
    @AhmedKhan-v4j8l 9 днів тому

    Best course

  • @AwakenBihar
    @AwakenBihar 9 днів тому

    Mast hai

  • @rcciit9226
    @rcciit9226 9 днів тому

    I am starting this project today

  • @iPoojaRajput
    @iPoojaRajput 9 днів тому

    keep doing its very helpful for me i want more video in advance full flash angular

  • @tanmayshengale2095
    @tanmayshengale2095 9 днів тому

    Sir please make a video on angular react

  • @Divdix59
    @Divdix59 10 днів тому

    nice sir ❤️👍

  • @milannakrani6170
    @milannakrani6170 10 днів тому

    Wow wow good

  • @MansiDixit-jv3ln
    @MansiDixit-jv3ln 10 днів тому

    keep uploading sir.

  • @m.r.c.prasad3482
    @m.r.c.prasad3482 10 днів тому

    Hi Nikhil bro, if possible can you upload the same content in English as well. Thank you

    • @CodewithTechnyksofficial
      @CodewithTechnyksofficial 10 днів тому

      It will be difficult I will try to add eng subtitles to it Still will think over it

    • @m.r.c.prasad3482
      @m.r.c.prasad3482 10 днів тому

      @@CodewithTechnyksofficial Yes subtitles would do a lot. Thank you bro

  • @rahulpatwal4752
    @rahulpatwal4752 11 днів тому

    Thanks for the angular code sir ❤