{"id":430,"date":"2024-12-03T17:18:49","date_gmt":"2024-12-03T17:18:49","guid":{"rendered":"https:\/\/nationalinstitute.pk\/?page_id=430"},"modified":"2024-12-12T14:45:04","modified_gmt":"2024-12-12T14:45:04","slug":"flutter","status":"publish","type":"page","link":"https:\/\/nationalinstitute.pk\/?page_id=430","title":{"rendered":"Flutter"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t
\n\t\t\t\t\t
\n\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Flutter course in Mardan <\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Flutter Course Outline Duration time for this course is 1.5-2 months. There will be weekly 2-3 classes (1-1.5 Hour classes each) In each chapter, we will try to create a new application so that everyone can learn from examples and implement them practically. Every week a homework assignment will be assigned to check the progress of the students. This course will cover every topics that is important to master Flutter.\u00a0<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\"\"\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t
\n\t\t\t\t\t
\n\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Introduction To Flutter & Dart<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

\u00a0Dart or Flutter? Where to start<\/span><\/p>

\u25cf Introduction to Flutter<\/span><\/p>

\u25cf Prerequisite of installing Flutter Install Flutter On Window<\/span><\/p>

\u25cf Install Flutter for windows<\/span><\/p>

\u25cf Install Java JDK \u25cf Install android studio<\/span><\/p>

\u25cf Install command line tools with SDKs<\/span><\/p>

\u25cf Install emulator Running app on physical devices<\/span><\/p>

\u25cf Creating our first project<\/span><\/p>

\u25cf Run app on an android physical device and virtual device Flutter Chapter 1<\/span><\/p>

\u25cf Creating our first project<\/span><\/p>

\u25cf Material App, what is material app. Home , Text and centre widget with tree charts explanation<\/span><\/p>

\u25cf What is material design<\/span><\/p>

\u25cf Scaffolding the app, material colours and network image widge<\/span><\/p>

\u25cf Assets image<\/span><\/p>

\u25cf Chaning app icon<\/span><\/p>

\u25cf Summing up what we have learned so far Flutter Chapter 2 Login App UI<\/span><\/p>

\u25cf Stateless widgets<\/span><\/p>

\u25cf Hot reload and hot restart<\/span><\/p>

\u25cf Single children widgets<\/span><\/p>

\u25cf How to use material Icons widget<\/span><\/p>

\u25cf How to use container widget with decorations<\/span><\/p>

\u25cf Wrapping the widget<\/span><\/p>

\u25cf What is layout<\/span><\/p>

\u25cf Multiple Layout children widgets i.e column, row, and stack widgets<\/span><\/p>

\u25cf Adding fonts into project<\/span><\/p>

\u25cf Creating Login UI design<\/span><\/p>

\u25cf TextForm Field widget<\/span><\/p>

\u25cf Creating round button Flutter Chapter 3 Lottery App Building app with states<\/span><\/p>

\u25cf Creating Project<\/span><\/p>

\u25cf Stateless widgets overview<\/span><\/p>

\u25cf Stateful widget<\/span><\/p>

\u25cf Understanding variable, data type and ternary operato<\/span>r<\/span><\/p>

\u25cf Creating UI with stateless widget<\/span><\/p>

\u25cf Difference between stateless and stateful widget<\/span><\/p>

\u25cf Gesture Detector on tap or on pressed function<\/span><\/p>

\u25cf Lottery App functionality implementation<\/span><\/p>

\u25cf Random number<\/span><\/p>

\u25cf Building states<\/span><\/p>

\u25cf Understanding more about stateful widget with more explanation and practice<\/span><\/p>

\u25cf Difference between stateless and stateful widget Flutter Chapter 4 Tops 10 Widgets<\/span><\/p>

\u25cf Top widgets that helps to build any kind of a APP UI<\/span><\/p>

\u25cf Container widget<\/span><\/p>

\u25cf Expanded widget<\/span><\/p>

\u25cf List tile widget<\/span><\/p>

\u25cf Circular Avatar widget<\/span><\/p>

\u25cf Stacks widget<\/span><\/p>

\u25cf List view builder widget<\/span><\/p>

\u25cf Text Form Field widget<\/span><\/p>

\u25cf RichText Widget widget<\/span><\/p>

\u25cf SizedBox \u25cf Divider<\/span><\/p>

\u25cf Padding & Align widgets<\/span><\/p>

\u25cf Image widget Flutter Chapter 5 Building UI and understanding deep concepts and Navigation drawer \u25cf Creating Dart classes<\/span><\/p>

\u25cf App Bar widget<\/span><\/p>

\u25cf Drawer<\/span><\/p>

\u25cf Drawer header<\/span><\/p>

\u25cf Navigation<\/span><\/p>

\u25cf Side Menu\/ Drawer or Navigation drawer<\/span><\/p>

\u25cf Code refactoring<\/span><\/p>

\u25cf Navigation, Routing and navigation or moving between screen<\/span><\/p>

\u25cf Building small navigation drawer app Flutter Chapter 6 Building WhatsApp Ui<\/span><\/p>

\u25cf Understanding Tab Bar widgets<\/span><\/p>

\u25cf How we can create different Tab<\/span><\/p>

\u25cf Understanding models<\/span><\/p>

\u25cf Creating chats UI and parsing data via model<\/span><\/p>

\u25cf Creating status UI and parsing data via model<\/span><\/p>

\u25cf Creating calls UI and parsing data via model<\/span><\/p>

\u25cf Summing up what we have learned Flutter Chapter 7 Understanding pub. dev<\/span><\/p>

\u25cf Understanding the pub.dev<\/span><\/p>

\u25cf Understanding about community<\/span><\/p>

\u25cf Working with some of the packages on pub dev<\/span><\/p>

\u25cf How we can use the pub.dev<\/span><\/p>

\u25cf How Fonts Awesome package helping community<\/span><\/p>

\u25cf Read more package to show more and less text<\/span><\/p>

\u25cf Badges packages to show text on Cart Icon<\/span><\/p>

\u25cf Animated Text Kit package \u25cf Pin Code Filed Package<\/span><\/p>

\u25cf Animated splash screen package<\/span><\/p>

\u25cf Summing up what we have learned Flutter Chapter 8 Building calculator app<\/span><\/p>

\u25cf What is data types, working with strings and substrings<\/span><\/p>

\u25cf If else statement<\/span><\/p>

\u25cf What is component<\/span><\/p>

\u25cf What is constructor<\/span><\/p>

\u25cf Creating component\/ how to create components<\/span><\/p>

\u25cf How to use reusable widget or code refactoring<\/span><\/p>

\u25cf Building calculator app<\/span><\/p>

\u25cf Creating logic for calculator<\/span><\/p>

\u25cf Showing result for calculation<\/span><\/p>

\u25cf Summing up what we have learn Flutter Chapter 9 Shared Preference Multi Role Base App \u2013 Admin\/User<\/span><\/p>

\u25cf Splash Screen and init state function importance<\/span><\/p>

\u25cf Async function<\/span><\/p>

\u25cf Future functions and await keyword role<\/span><\/p>

\u25cf Shared Preference and its importance<\/span><\/p>

\u25cf Shared preference and its usage with example<\/span><\/p>

\u25cf Sign up with role based and storing data in shared preference<\/span><\/p>

\u25cf Login and checking user role<\/span><\/p>

\u25cf Managing user session to check if he is login or not<\/span><\/p>

\u25cf Summing up what we have learned Flutter Chapter 10 Rest API Complete course<\/span><\/p>

\u25cf Introduction to APIS. Understanding of JSON Structure.<\/span><\/p>

\u25cf What is Postman, and how it helps us to understand the JSON Response?<\/span><\/p>

\u25cf What is a model, what are Plugins, and how do different Plugins help us to create models of our API JSON data?<\/span><\/p>

\u25cf How we can parse JSON data via Model.<\/span><\/p>

\u25cf GET APIS What are Get APIS<\/span><\/p>

\u25cf What are different scenarios to handle Get API Integrate.<\/span><\/p>

\u25cf Get APIS with Plugins Model and show data into List<\/span><\/p>

\u25cf Integrate Get APIS with your own Model and show data into List Integrate<\/span><\/p>

\u25cf Get APIS with without Model and show data into List Very Complex JSON practical example<\/span><\/p>

\u25cf POST APIS, What is POST API How do Post APIS work<\/span><\/p>

\u25cf Implement Login & Sign Up with REST API in flutter<\/span><\/p>

\u25cf Upload Single Image onto a server via HTTP Request Example<\/span><\/p>

\u25cf Upload Multiple images to server<\/span><\/p>

\u25cf Upload data in arrays to server<\/span><\/p>

\u25cf What is MVVM, what is the importance of learning MVVM architecture. Covering all the above concepts into a single app that we will create at the end of this course. Flutter Chapter 11 Navigation & Routing<\/span><\/p>

\u25cf In this chapter we will learn the following concepts<\/span><\/p>

\u25cf What is navigation<\/span><\/p>

\u25cf How navigation actually work behind the door<\/span><\/p>

\u25cf How does understanding stacks help you better understand navigation<\/span><\/p>

\u25cf What is the difference between navigation and routing<\/span><\/p>

\u25cf Routing with 1 method<\/span><\/p>

\u25cf Routing with the second method and simplifying the code for better management Flutter Chapter 12 Google Map<\/span><\/p>

\u25cf Out of this course and what you will learn<\/span><\/p>

\u25cf What is the google map, why you to learn google map in mobile application development<\/span><\/p>

\u25cf What google map api console, how we can set up our Flutter project with google map api console.<\/span><\/p>

\u25cf Integrating google map with packages and understanding basic terminologies.<\/span><\/p>

\u25cf How we can set up markers on google Maps<\/span><\/p>

\u25cf How to set custom markers on google maps like careem and uber.<\/span><\/p>

\u25cf How to get the user\u2019s current location and show it on a marker.<\/span><\/p>

\u25cf How to convert latlng to address and vice versa<\/span><\/p>

\u25cf How to customize marker info windows like google map places.<\/span><\/p>

\u25cf How to update camera position when the camera is updating on google Maps.<\/span><\/p>

\u25cf How to update user location when user location is changing.<\/span><\/p>

\u25cf How to implement google Maps search places api.<\/span><\/p>

\u25cf How to show network images or Avatar as markers on google map like Snapchat<\/span><\/p>

\u25cf What is a polygon and how can we add a polygon on google Maps<\/span><\/p>

\u25cf What is a polyline and how we can add a polyline on google map Flutter Chapter 13 Local Storage Creating Shopping cart system<\/span><\/p>

\u25cf Create a Shopping Cart System in Fuand what you will learn in this playlist.<\/span><\/p>

\u25cf What is the local storage system and how does it work on the mobile in FLutter?<\/span><\/p>

\u25cf What is required to set up local storage in Flutter<\/span><\/p>

\u25cf Create a project and a database for storing data.<\/span><\/p>

\u25cf How we insert data into the database and how this actually works.<\/span><\/p>

\u25cf Add product to cart<\/span><\/p>

\u25cf Update cart<\/span><\/p>

\u25cf Delete product from cart<\/span><\/p>

\u25cf Check if the product is already added to cart or not<\/span><\/p>

\u25cf Calculating the total price for the products we have added and updated prices if we update or delete products etc. In the end, I will sum up the whole project, what we have learned, and how we can utilize these concepts to build other similar real-world applications. Flutter Chapter 14 Provider State management<\/span><\/p>

\u25cf Difference between stateful & stateless widgets<\/span><\/p>

\u25cf Why you need to learn state management with example<\/span><\/p>

\u25cf What is a provider, how does a provider work, and why are we learning provider state management. What are change notifier, multi-change notifier, and consumer widget<\/span><\/p>

\u25cf Example one, count and periodic timer example with frozen state and provider?<\/span><\/p>

\u25cf Example two practice apps to understand provider state management a bit more in detail.<\/span><\/p>

\u25cf Example three is to make a simple app where we will list the product in a list and then make them favorites. After that, we will display a list of favorite products that are marked as favorites from the list.<\/span><\/p>

\u25cf Example 4 theme changer app with provider<\/span><\/p>

\u25cf Example 5 Login API with provider \u25cf Example 6 how to use the stateless widget as a stateful widget.<\/span><\/p>

\u25cf Will cover up what we have learned and what we will do after that.<\/span><\/p>

\u25cf Complete the app with a provider using MVVM architecture with the rest APIs. Flutter Chapter 15 Firebase<\/span><\/p>

\u25cf Creating Project<\/span><\/p>

\u25cf Setting up<\/span><\/p>

\u25cf project with firebase for android and ios<\/span><\/p>

\u25cf CRUD operation with Firebase real-time database<\/span><\/p>

\u25cf CRUD operation with Firestore<\/span><\/p>

\u25cf Implementing Auth firebase<\/span><\/p>

\u25cf Creating Blog application<\/span><\/p>

\u25cf Summing up what we have learned End of the course<\/span><\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t

\n\t\t
\n\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t

Ready to Kickstart your Career\n<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Inserted in innovation and design<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t

\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t\t\t\n\t\t\t\t<\/i>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\tJOIN US<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"

Flutter course in Mardan Flutter Course Outline Duration time for this course is 1.5-2 months. There will be weekly 2-3 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-430","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/nationalinstitute.pk\/index.php?rest_route=\/wp\/v2\/pages\/430","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nationalinstitute.pk\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nationalinstitute.pk\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nationalinstitute.pk\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nationalinstitute.pk\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=430"}],"version-history":[{"count":16,"href":"https:\/\/nationalinstitute.pk\/index.php?rest_route=\/wp\/v2\/pages\/430\/revisions"}],"predecessor-version":[{"id":2690,"href":"https:\/\/nationalinstitute.pk\/index.php?rest_route=\/wp\/v2\/pages\/430\/revisions\/2690"}],"wp:attachment":[{"href":"https:\/\/nationalinstitute.pk\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=430"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}