Flutter Onboarding tutorial with GetX || 30 mins coding challenge 👨🏻‍💻

Hey there, In this video we will learn how to create onboarding page in Flutter mobile application using GetX.
In this 30 minute coding challenge, we will also learn different shortcuts and tips n tricks for day to day development.
Leave your feedback in the comment section below and share what application you guys are working on!
Git Link: github.com/afz...
Design inspired by:
thememockup.co...
Clock App Series:
• Flutter Clock App | Tu...
Other videos:
Flare animation with Flutter || RIVE app animation
• Flare animation with F...
BLoC Pattern with Flutter || Basic Concept with Example (Part 2)
• BLoC Pattern with Flut...
BLoC Pattern with Flutter || StreamController
• BLoC Pattern with Flut...
Join this channel to get access to perks:
www.youtube.co...
Gears ========
Camera 📸 || Canon 250D : amzn.to/34isdKr
Mic 🎤 || Maono AU-04 : amzn.to/341g9wS
#CodeX
Connect with me on social media:
FB: / codexdevs
Twitter: / afzalali15
LinkedIn: / afzalali15
Discord: / discord

[@CodeXdev]

I hope you liked the video.. Let me know what you think about this Onboarding Screen? Does your application have one? 😀

[@hassanwaqas532]

How to destroy activity in GetX. And please make a video how can we take backup/restore of SQLite in flutter application. Thanks man great helpful tutorial.

[@faheemahmadofficial7701]

bro please install MAC os 11

[@betterhealthy1203]

I’m from Cambodia, Thank you for your tutorial that best learning and clearly. I’m winform application I want to learn flutter app and api :)

[@kbyo2006]

Great!! I was finding a tutorial as this. And a great teacher as you!! :) Thanks for teacking me.

[@rafikbenkhadem2642]

Thank you for this tutorial, as an "obs' you skiped the skip button!!

[@waqasroy5801]

I'm working on my final year project...And Thanks ALLAH that I found you...🥰 Actually, i was watching SERVERPOD and found that you did All tutorials on Flutter...😍

[@CodeXdev]

Welcome to CodeX. and best of luck for your project!

[@wjbtc4395]

How to show these screens the first time I open the app only the first time ?

[@josiasgomes4909]

Congratulations 👏🏼👏🏼👏🏼. Please, make a video about a CRUD with GetX.

[@IwanMukhtar]

You are a great teacher! You can teach me clearly. Awesome tutorial, keep it up man!

[@asmaashabaka8339]

wonderful and very helpful video

[@rajendrafodase2549]

nice broo (भावा)

[@sharbelokzan9673]

I was very excited when I saw another GetX tutorial,.. but not an onboarding screen 😕 we want something more complicated (logic-wise not the UI) so we understand the power of GetX anw thanks for this awesome video and the other video, keep on ✌️

[@CodeXdev]

Thank you for your feedback ☺️ As a content creator I have to target all 🎯 Experts like you and beginner like many 👨🏻‍💻

[@flutterclone1849]

Thank you for this video , getX is best state manager.

[@techys4335]

Awesome way of demostration

[@RohitGTA]

Great man !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

[@mohankumar-vz2uo]

i create flutter app ..but all mobiles are not properly visible..alignment will change one mobile to another ..i use media query also ..but no use ..so plz help me what can i do ..

[@andrewflearing]

Great!

[@calonProgrammer]

Please more video with getX

[@cengizhanbozkurt47]

Good job, Thank you for sharing video

[@CodeXdev]

So nice of you, 👍👍

[@eahofer]

At 24m09 you explain that whenever you have a function returning sn integer you can have it as the OnPage parameter. Do you mean that the "controller.selectedPageIndex" is going to be set to?

[@CodeXdev]

Yes, it will set the value of controller.selectedPageIndex.. behind the scene, every Rx type object you create, it has a method attached to it. If i say RxString temp; then you can assign value in two ways.. 1. temp.value = 'CodeX is awesome'; or 2. temp('CodeX is really awesome'); Now we know that Rx type variables can be called as method, we can assign to any event which has same method signature :) onSubscribe : temp; where onSubscribe has a signature like Function(String) onSubscribe;

[@ekoprasetyo3999]

Awesome tutorial, keep it up man!

[@HuynhLuong227]

awesome, amazing, thank you Codex. hope you make more tutorial about Flutter other

[@DaviesMaina]

Good video. Could you kindly do REST api authentication with getx?

[@CodeXdev]

I already have tutorial on API, you just need to pass Authentication parameter in header..

[@nthonyproblgomez9659]

Please uploaded a new video flutter auth with getx

[@yunuskocatas3879]

perfect explanation. please add more videos. you are perfect guy

[@CodeXdev]

Thank you, I will

[@rehmanshaikh6772]

please make a video on the showcase view package using Get X

[@canada_calling]

Great content. I tried to buy you a coffee and got a Stripe error on the page "it appears that you are cloning a card payment method to a IN connected ..."

[@banglafactsteller6780]

plz make a full app series with getX like pro

[@ankiy]

Great content 👍

[@CodeXdev]

Thank you 🙌

[@sanchitsaran8834]

sir i am using GetX in my project but whenever i used getbuilder in a secreen then i switch then controller comes out of memory but whenever i use Get.put as controller object then i change screen but my controller stays there..

[@CodeXdev]

That is the purpose of Get.put, You can create multiple controllers with "tag" or you can delete using Get remove

[@sanchitsaran8834]

@@CodeXdev Get.delete(force: true); like this?

[@dhrumilmathia4819]

Nice video.. keep posting more with getx.. Great content😊

[@CodeXdev]

Thank you, I will

[@mkmalikcom]

it's amazing I was able to feel the urgency and time limit 😂 Do some more videos like this

[@CodeXdev]

Thank you for feedback... I need to put heart beat sound also when timer is running out 🤣🤣

[@mkmalikcom]

@@CodeXdev heart beat sound💓 so now you gonna make it like flutter interstellar 😂 btw I am waiting......

[@thaliaamargianou7870]

bravo.. great video tutorial!!!

[@DholaSain]

please make a video on Shopify GraphQL API with Flutter. with models and etc

[@CodeXdev]

This is very specific topic, you want to discuss on Discord server where community members can help you out with reference

[@Isthiyaquekambathagothi]

For splash, do we create a controller and use a timer of 5 seconds duration to navigate after 5 seconds to onboard screen or do we use initstate ? Am new to getx state management.

[@CodeXdev]

If you don't have any other functionality to perform on splash then you can simply write navigation inside your stateful widget.. but if you are loading some data, performing some intialization then use controller with stateless widget

[@Isthiyaquekambathagothi]

@@CodeXdev thank you, I hope after doing couple of screens and project I think I would love it, till now I was not any state management, and I find issues with some parts like flow of the app, or refresh, I think with this Getx, most of the issues can be managed.. Love your videos

[@deepaknarang4326]

Hii, Do we need to create different controllers for different screens? Like if i am using a bottomnavigationbar and on load of both the tabs i need to fetch the data from the api, Is there any widget like futurebuilder in getx which we can use to fetch the data from api and render the screen? Currently i have created two controllers for two tabs.

[@yunuskocatas3879]

can you make a series that is contained the whole flutter application?

[@CodeXdev]

Coming up soon 🔜

[@nestorraulcamacho1923]

Quiero consumir una api de woocommerce, pero estoy bloqueado ayuda

[@martinntalika2712]

hey bud, i know its been sometime since you made this was just wondering like how do i apply the "go to home " in the fowardAction func

[@CodeXdev]

Simple answer, Get.to(() => HomePage()); If you are using named route then write like this, Get.toNamed('/home');

[@omerack4813]

thank you so so much

[@maulahaz]

Great Tuts... I'm getting addict with this Getx bcos of your Getx tuts. Superb tuts and easy to follow. BTW, I've try to make Quiz app using Getx a lil bit,..but i'm still confuse to use it. Also during making CRUD of Quiz. Can you make tutorial how to make Quiz Apps using Getx... Thanks in Advance.

[@CodeXdev]

Glad you like them! TBH I cannot promise on quiz app, BUT, but yes, I am going to upload more of GetX tutorials soon...

[@jims888]

Thank you very much, great tutorial video! You are a very good tutor.

[@CodeXdev]

Glad it was helpful! Thank you for sub!

[@adewaleadisa4346]

Thanks you, you are a good teacher

[@syedmuhammadshaheryar8997]

great work sir

[@Jan123.]

Great video!

[@michaelsolomon9847]

Thank you Very much! It is great content.

[@CodeXdev]

Glad it was helpful!

[@harrysuherman]

tanks bro, awesome tutorial...

[@Rawat_VL_comedylite]

start in home par kese jaye

[@papito93546]

Thank you, nice video

[@CodeXdev]

Glad you liked it!

[@niyobuhungiroyves5314]

Thank you sir

[@robidahariansyah4360]

great video

[@CodeXdev]

Glad you enjoyed it

[@uzunizci5620]

its wonderful you make more getx application for us

[@CodeXdev]

Sure, will do!

[@khanmohammedaamir8900]

Sir can you make a video on new features of flutter in one app

[@techliv9806]

How to make add to cart using getx

[@Rawat_VL_comedylite]

Thank you very so much Sir

[@CodeXdev]

So nice of you

[@BrYarDJ]

bro i hope create TU about flutter dark and light theme dynamic for some page. i sow your video but its not fix my problem, i hope create new TU about it. thanks.

[@hollowface2798]

Nice tutorial as always, could you make some tutorial about getx middleware sir?

[@ia.mtzrmz]

how can i go to specific page with Get.off() in the controller?

[@CodeXdev]

Get.off() removes current page and then move to next page.. if you want to particular page already present in stack then you can use Get.OffUntil()

[@farrazmohamed2612]

getting this error while using GetX with Stream builder , "You cannot add event to closed Stream", what im trying to do is once data is returned from the sream assign data to obs variable defined in the Controller class which extends GetxController

[@CodeXdev]

First thing, I will recommend you not to use both at the same time as it will create complexity... Behind the scene GetX also uses Streams to handle state so you can completely rely on GetX.

[@mohammedtaheershaikh6475]

hey bro can we use jenkins as Ci tool for flutter

[@muhammadfavianjiwani2274]

How can I move to another page if I click the 'start' button on the last page? for example, I want to move to home page. Thanks !

[@CodeXdev]

You can use the easiest way, Get.to(()=>HomePage());

[@muhammadfavianjiwani2274]

@@CodeXdev Thank you ! it works.

[@Lokesh3152]

@@CodeXdev The method 'to' isn't defined for the type '_GetImpl'. I'm getting this error for using to

[@Lokesh3152]

fixed forgot import thx

[@sangputukelover3512]

How do I move to the next page if I click the next button?

[@CodeXdev]

Get.to() the easiest way 👍

[@nirbhaysrivastava928]

Why don't you use bottom negation bar?

[@hashankannangara8723]

thanks for the video!

[@CodeXdev]

Keep visiting for more videos 😎

[@RaviKumar-em9hx]

Please provide us complete chat app flutter getx firebase

[@boburkaizen]

Hi dear, you've a really usefull content. I have a question. Can I construct some designs from dribble or somewhere else or i should draw them in adobe xd, and then 'export' them like u. What a u recommend?

[@CodeXdev]

As far as you have free rights to use, you can use any design.. just bring it in XD and then you can do copy paste magic 🪄

[@jims888]

@@CodeXdev hi, can you please also make a video tutorial on how to do this? thanks!

[@danishmehmood5375]

Sir, i would like you to make some details videos on Platform Views and Platform channels, I can recommend some examples

[@CodeXdev]

Sure, tell me a few use cases and I will plan for it

[@danishmehmood5375]

@@CodeXdev Go for native Ad example or something similar. It will include all possibilities within. 1. make custom Ad Layout in android or ios (for platform view) 2. then request for native ad (native networking) 3. populate Ad data into view, and send view back to Flutter 4. listen for clicks and perform different functions( platform channel)

[@jorgealejandrorodriguezovi3382]

Hello, very good, your videos I wanted to ask you if you have already getx_cli?

[@user-ng6eb9vt7q]

Do you have wifi_iot tutorial

[@abdulrehmananwar6990]

Any tutiorial datagrid or dattable with textfileds add row remove row feature using getx.

[@CodeXdev]

Not yet, it will be very advance topic though

[@umitkoc6420]

good video :)

[@CodeXdev]

Thanks for the visit

[@billywatsikenyere6656]

hi thanks for the video , how do you redirect on the last index , do you put that logic in the controller or the view

[@CodeXdev]

In controller you can create method and use pageController.jumpTo or animateTo to go to last page..

[@billywatsikenyere6656]

@@CodeXdev thanks for replying , l mean after the onboarding is done , moving to ie , Login or Register page

[@CodeXdev]

In controller, In the same method you just check for lastPage and navigate to desired page📄 i think i already added //comment indicating that☺️

[@RajA-me9cl]

We need an ultimate solution for responsiveness. Please make a tutorial.

[@CodeXdev]

responsive designs makes developer uncomfortable 🤣🤣 I will try to create a simple tutorial first :)

[@flutterclone1849]

BLoC or GetX ?which one is better ?

[@CodeXdev]

I will go with GetX

[@flutterclone1849]

​@@CodeXdev I was waiting for this answer, I am more comfortable with it

[@santhoshd3702]

im facing some error in Next button

[@santhoshd3702]

PageController.page cannot be accessed before a PageView is built with it. 'package:flutter/src/widgets/page_view.dart': Failed assertion: line 172 pos 7: 'positions.isNotEmpty'

[@armandfotie3844]

Thanks , but you have miss the skip bottom

[@CodeXdev]

Hahah.. don't tell anyone 😝 It just needs to visit last page in PageViewer.. use animateToPage() or jumpToPage() method from pageController 👍

[@abuflutter7045]

thanks

[@CodeXdev]

You're welcome! 🤓

[@nazar87ali]

thanx but why cannot slide by hand

[@CodeXdev]

Yes, you can slide as well.. both will give same results

[@nthonyproblgomez9659]

Please uploaded a new video flutter auth with getx

[@nitishkumargupta7302]

but chintu from whitehat jr can do it in seconds u know. 😂

[@CodeXdev]

Whitehat Jr can do anything.. 🤣

[@Rawat_VL_comedylite]

for use in skype in id

[@movieshop421]

0:27 30 second 😅😅

[@CodeXdev]

I realized while editing the video 😂 I would superman if can do that in 30 sec 😉

[@Rawat_VL_comedylite]

bro please

[@faheemahmadofficial7701]

please take 1 hour just teach us basics and teach easily and slowly please

[@danishmehmood5375]

Please use Android Emulator for development, its much better.

[@CodeXdev]

For me both works fine, TOP secret.. on iOS it looks prettier 🤓👨🏻‍💻

[@brokercl]

Im gonna quit informatic ja ja ja

[@CodeXdev]

I didn't understood.. but I visited your channel, you have may short videos! do you have a blog channel or what?

[@siruxsolutions]

Great video!

[@CodeXdev]

Thanks!