Code Push for Flutter - MVP Show ft. MD Sarfaraj
11K views
Jan 29, 2024
Join us on January 10 with MD Sarfaraj for to very first episode of the season 2 of MVP Live show to learn about Code Push for Flutter. Code push is a highly useful cloud service that enables developers to deliver app updates to users' devices quickly and efficiently. This feature helps ensure that users always have access to the latest version of the app, with all the latest features and improvements. šŗ CSharp TV - Dev Streaming Destination http://csharp.tv š C# Corner - Community of Software and Data Developers https://www.c-sharpcorner.com #csharptv #csharpcorner #flutter
View Video Transcript
0:00
So, I'm going to be talking about the
0:02
new technology that's coming out of the iPhone 6s. And I'm going to be talking about
0:08
the new technology that's coming out of the iPhone 6s. And I'm going to be talking about
0:14
the new technology that's coming out of the iPhone 6s. And I'm going to be talking about
0:20
the new technology that's coming out of the iPhone 6s. And I'm going to be talking about
0:26
the new technology that's coming out of the iPhone 6s. Hi everyone, and welcome back to C Sharp Corner MVP show
1:04
And as always, I'm your host, Simon. And we are back. We took a break
1:08
from the C Sharp Corner MVP show for about, I would say, in December
1:12
and November and December. But I'm so happy that we are back once again
1:16
And if you're someone who is joining us for the very first time, C Sharp Corner MVP show is a show
1:20
where we feature our C Sharp Corner MVPs. And those are the ones who are
1:24
the community leaders. They contribute to the community. They are very active
1:28
They're always helpful. They contribute in many ways. Some people write articles
1:32
Some make videos. Some reply in forums. Some write books. Some do
1:36
events. Some do speaking at events. And speaking at events reminds me that today we will
1:42
be joined by MD Sarfaraj, who is a rock star in India
1:46
If you're someone who works in the Flutter community or you are active
1:50
you will always see MD Sarfaraj over there. He likes to go by
1:54
his acronym MD. He's very active on LinkedIn, Twitter, wherever I see. If there's
2:02
any Flutter event happening or if there's any Flutter blog, on my news feed
2:08
anything around Flutter comes from MD Sarfaraj. So I'm really, really excited that I'm getting to host him
2:14
I think second or third time on this show. And guess what he's going to talk about
2:20
Flutter. So without any further ado, let's bring our guest today. MD. MD, welcome
2:26
to the C Sharp Corner MVP show. Yeah. Hi, Saman. Thank you for inviting
2:30
me on C Sharp Corner MVP show. Yeah. When you were giving such a nice introduction
2:36
I was thinking like, is it really me who is working so much? Yeah
2:42
You do, MD. I mean, when you like someone's LinkedIn post or when you share a blog
2:48
when you talk about, hey, this is the new feature of Flutter, when you share it on
2:52
LinkedIn or Twitter, people may not like it, but people like me, we see
2:56
it, right? So that is one thing that I, whenever I think about Flutter, I think about
3:02
you in India, few other folks, but you are way more close to me than anyone else
3:08
So thank you for accepting the invitation to be on the show. And
3:12
MD, tell me, how has life been and where are you actually joining us today from
3:16
Yeah, it's going very good, Simon, and currently I'm in Hyderabad. So I'm joining
3:22
Hyderabad today, yeah. That's nice. That's nice. All right. So we won't
3:26
take much of your time. I know you're going to talk about Code Push for Flutter
3:30
which really helps people to go ahead and deploy their applications smoothly and easily
3:34
I'm going to let you take over the stage. So please feel free to go ahead
3:38
and share your screen. And everyone who's watching, if you have any questions related to Flutter
3:42
generally Flutter or around the session, MD is always there. You can
3:48
ask your question in the comment section and we will take them towards
3:52
the end of the session. Okay, Simon. I'm going to share my screen
3:58
Yeah, please go ahead and add it to the stream when I see it
4:06
Yeah, can you see my screen? Yeah, I think you're inside the stream once you
4:14
go back from there to some other screen. Once you, yeah, I can see your
4:20
slides. Yes, that's perfect. Everybody else can see your screen and the session's all yours
4:26
Yeah, so thank you, Simon. So, hello everyone and thank you for joining this session
4:32
Okay, so my name is MD Sarraj and currently I'm working as a mobile application
4:38
developer in AppSys. Okay, and apart from my work, I like to write blogs and articles
4:44
on CSR Corner, and apart from tech, I love to listen to music and reading
4:52
books. So, yeah, these are my hobbies. You can connect me on LinkedIn and you can follow me
4:58
on Twitter. So, today my topic is code push for Flutter application. So
5:06
our agenda is, first we will try to understand what is code push and after that
5:12
we will see what are the importance of code push in Flutter application
5:16
Then we will see what is Sorbet and we will see a live demo, okay, how
5:22
we can configure Sorbet in our Flutter application and at the last we will open
5:28
question and answer. So, without further ado, let's start. So, what is code push? So
5:36
for example, you are having an app live on your Play Store
5:42
and App Store, okay, and you are suddenly facing a bug over there, okay, you want
5:48
to fix that bug, okay. So, to fix that bug you have to send an update
5:54
to Play Store and App Store and their team will first review that
6:00
update, okay, then they will make it live, then user can update your app, okay
6:06
So, it is somewhat lengthy process. You have to wait for the review
6:10
and then your update will get live. But, you have to fix those issues as soon
6:18
as possible. So, code push in this scenario, code push comes into the picture where you
6:24
can send the update to end user device without depending on the Google Play Store, App Store
6:32
reviewing process. So, you can skip the review for small updates and you can
6:38
push the small updates to end user device directly. And why we need Flutter
6:48
code push for the Flutter app? So, basically when you are pushing small updates to
6:56
user, okay, without depending on the App Store and Play Store reviewing process
7:02
you can continuously send the update and you can seek the feedback from the user if there are
7:08
any production issues. You can fix as soon as possible, okay, and
7:14
you can do some small feature changes, okay, and you can roll out those changes directly
7:22
to end user device. So, these are the features which code push is providing
7:30
So, what is Sorbot? So, Sorbot is a platform which is managing the
7:36
code push for the Flutter application and it is developed by one of the Flutter team
7:42
members, okay. So, actually it is an open source project. So, you can
7:48
go and check that out, okay. So, now we will see how we can
7:54
do the... how we can configure the Sorbot in our application and how can we roll out
8:02
an update to end user, okay. So, first of all, you have to
8:06
search Sorbot in your search engine and you have to go to sorbot.dev So
8:14
currently Sorbot is using Google login, okay. So, you can login to any of
8:20
your Google accounts, okay. Once you are logged in, okay. So, I am going to use my Google
8:28
account. Once you are logged in, you will see this installation process. It is very simple, just
8:36
one line of command, okay. So, if you are a Mac user, you have to
8:40
copy this command and you have to open the terminal and you have to run this command
8:44
and Sorbot CLI will get installed in your machine. And if you are a Windows user
8:50
then you have to open the PowerShell and you have to run this command and
8:54
it will install the Sorbot CLI. Once it is, installation is done
9:00
you have to type this command sorbot login and it will give you an authentication link
9:06
You have to click on that link and you have to authenticate yourself
9:10
So, once you will get authenticated, now you can use the further
9:18
process. So, first I will go and I will create a Flutter project. So
9:26
I have a folder on desktop, which name is Sorbot demo. So
9:32
there I am going to create a Flutter project. To create a
9:36
Flutter project, we have a simple command, flutter create and project name. So
9:42
for this demo, I am going to give a name sorbot demo. So
9:52
I have a sorbot Flutter demo. And then you have to hit
10:02
enter and you have to wait for couple of minutes to complete the process. Yeah, it's done. Okay
10:12
After that, you have to open the project in any of the code editor
10:16
For me, Android stereo is more comfortable for me. If you are okay with
10:22
VS code, you can use that, not a problem. So, I will go and open the project, which
10:28
I just created now. So, here is my project. I will open this
10:38
So, Android is taking some time to load the resources. Let it load
10:52
Yeah. So, once it
11:02
all the resources loading is done from Android stereo side, we have to open the terminal
11:08
and you have to type the command sorbot login. So, I am already logged in
11:16
So, it is saying like you are already logged in. Okay. So, if you are not logged in
11:24
it will give you a link. You have to click on that link and it will authenticate
11:28
To configure the sorbot in our project, okay, we have to type the command
11:34
sorbot init. Okay. And it will take some
11:44
time to configure the sorbot in your project. Okay. And it is asking
12:02
name of the project. So, I want to continue with the same name
12:08
So, I will just hit enter. And yeah
12:20
So, one more thing. Sorbot requires internet permission. So, if you have not added your
12:28
internet permission, it will automatically add or it's better you can add. So, you have to go to Android
12:34
folder under app SRC main. There you will see Android XML file. Okay. Android
12:42
manifest file. There you have internet permission. So, I forgot to add this permission
12:48
but not a problem. Here you can see like sorbot already added. Okay
12:54
After that, you have to create a build for the Android platform. Okay. So
13:04
when we are creating, suppose when we are going to release our app on
13:08
Play Store, we have to make an app bundle. Okay. In the same way, here also
13:12
you have to make the app bundle. Okay. Or release. So, you have to type the command sorbot release
13:22
Android. Okay. Before that, if I come back here on console and if you will
13:28
replace it, you will see your app. You can see your app is
13:32
here. Okay. Now we are making the release. So, you will see the
13:36
release version over here. And once you will configure the sorbot in your project, you will get a sorbot.yml
13:44
file and this yml file will contains app ID and this app ID is
13:50
for the sorbot server. So, they will get to know your app
13:56
through this app ID. So, currently I'm making an Android build. Okay
14:02
So, it will take some time. So, we have to wait for couple of minutes
14:12
Okay. And
14:44
yes, one more thing I would like to say. Yeah. So, yeah, it's done. So, you can
14:52
see like your app ID here. And you can see the version and version number. Okay
15:04
So, you can see the version number. Okay. And you can see the
15:14
version and version code. So, you can verify the version and version
15:18
from pubspec.yml file and yeah, here is your version and version code. So, yeah, both are similar
15:26
And it is making the release build for this platform. I'm 64, 32
15:32
and 86 and 64 width. And currently my flutter version is this is the
15:38
is this why it didn't Yeah. So, it is saying
15:56
build is created and you can go here actually under build folder
16:04
app outputs bundle you will get a release ADB file. Okay. So, you have
16:12
to upload this ADB file in your play store. So, and they will review it and they will make your
16:20
app live. But currently I'm not going to do that. Because it is a very lengthy
16:26
process. So, to verify it locally. Okay. So, what we're giving us a
16:32
facility to verify your release app. Okay. In locally through a command. Okay. So, before that
16:40
once I will go and replace here, you will see and write
16:46
releases here. Okay. And the version and version came here. Okay. So
16:52
now I will try to install this current release in my local emulator. Okay
16:58
Through a sort of a command. Okay. So, we can do that
17:02
Just you have to type preview. Before that, you have to make sure you are connected with
17:10
ADB devices. So, as you can see, I have currently one emulator is running
17:18
Okay. One emulator is running. So, I will type the command show but preview
17:24
and it will download the, it will ask which preview would you
17:30
like to run. So, I am having only one at the moment. So, I will go to this
17:34
Okay. And it will download your app from the server to your emulator. So, ... ... ... ... ... ..
17:56
So, as you can see, it's downloaded and installing my app into my emulator
18:06
and this current app is downloaded from the server. Okay. Now, suppose I
18:16
want to change the theme of my app. Okay. And I want
18:20
to roll out this update to user. Okay. And I don't want
18:26
to depend on the place where the app is to review process. So, let's
18:30
do that. So, here currently the color is pink is deep purple
18:36
I will change this to deep orange. Okay. For example, let's change this
18:42
to deep orange. Okay. And I have to send this patch to show but
18:50
server. Okay. So, to send the patch we have to type the command
18:56
show but patch and platform name. So, I am sending for the invite. So, I will
19:02
write invite. Okay. Patch is nothing but the small changes which you are doing
19:06
in your code and sending it to show but server for the update
19:20
So, it will take some time to roll out your patch to show but server and all
19:26
the user device. So, just wait for some time. Yeah. And
19:56
while this is sending the patch. Okay. I would like to say this iOS
20:06
in alpha mode, alpha version so but alpha version. Okay. So, iOS is little bit slow at the
20:12
moment and they are working very hard to make the iOS stable
20:16
Again, it will ask you all the information are connected or not. So, it seems
20:22
everything is correct for me. So, I will type yes and it will roll out the
20:28
patch. Okay. So, it will give you a message. Patch is published
20:32
Okay. So, now let's do one thing. Here I will go and close this app. Okay
20:44
Again, I will open this app. Okay. Just look at this log. Okay. And here
20:52
it is checking for the update. Just wait a minute. Yeah. Here you can see in the log update
21:06
installed it. Okay. So, there was an update in the server as
21:12
you can see like if I refresh the server console. Yeah. You can see here
21:20
I just pushed one patch. So, you can see patch one is
21:24
there. Okay. But here I am not seeing any changes. So, I have to close it again
21:32
Okay. Because the update is installed but when you have to see the update, you have to
21:38
reopen it again. So, when I will open it again, you will see the
21:42
changes. The changes which I made in the color you see. Okay
21:52
So, yeah. Now you can see the app color is changed. Okay
21:58
So, this is all what Sorbot is. So, I wanted to say like Sorbot
22:06
iOS in alpha version currently. Okay. So, it will take some time to get the stable but Android
22:12
is stable. Okay. And when you will click on this app, you can see like you can add
22:18
more collaborators. Okay. So, they are having some plans and paid plans. So, according to
22:24
your plans, you have to collaborators are coming in the premium version
22:30
Okay. And you can see all the patches here and you can see the insights here. How many
22:36
patches get installed. Okay. So, they are having all these good charts
22:42
in their platform. Okay. And you can follow the documentation here. Okay. So
22:52
now the question is Sorbot is like it is following the Google Play Store
23:00
and App Store privacy and policy. So, yes, it is following the privacy of
23:06
App Store and Play Store and it is we can push the update over
23:12
here. Okay. It is like legal. Okay. And it is following the privacy to
23:18
know more about privacy they kept it over here in their documentation. So
23:30
this you have to go in FAQ. Okay. And here you will find
23:38
Yeah, that's the Google Play Store guidelines. And you can read the guidelines
23:48
here. Okay. Or you can directly go to Google Play Store guidelines and you can read all the
23:52
guidelines. So, they are following the guidelines. So, yeah, that's it. If there is any question, please
23:58
feel free to ask. I will stop sharing my screen. Yeah, Simon
24:08
That was really neat. Yeah, that was good. There are always some
24:16
into the demo and when it works with the Android Studio, it kind of always lags
24:20
We don't have any question at this instance. MD, but MD, I know you work with Flutter
24:26
in the development. So, is this the same tool that you also use when you
24:30
have to work in your production environment? So, yeah. Good question, Simon. Actually
24:36
take an example, you are having an app, okay, and that app is
24:40
serving millions of users. And suddenly, you are facing some issues in the production
24:46
So, you want to fix that issue as soon as possible. You can't fix the issue
24:54
on a cube mode. Like we are fixing the issue in the development
24:58
You have to make a build. You have to send to the
25:02
App Store and Play Store. They will first review it. Then they will make it public
25:08
So, it is like tedious task sometimes. Then this code came into the picture
25:16
What they will do? They will directly roll out the changes to
25:20
end-user device. So, you don't have to wait for small changes for the Play Store
25:26
and App Store to review your build. There are lots of apps
25:32
already doing. Like, take an example of LinkedIn. Sometimes, you will not update the
25:40
LinkedIn, but you will see some changes over there. So, LinkedIn is already
25:46
doing, I guess, Prime Video is already doing these changes. For React Native
25:52
App Center, the code whose name is App Center is there. So, Native developers are
25:58
using App Center. And for Flutter, there was not any single platform for the
26:04
code whose, but recently, I guess, one year back, one of the Google
26:10
team who was in the core team member of Flutter, they created this code whose platform
26:16
Okay. Currently, the Android version is in a stable mode, but the iOS is in alpha mode
26:22
So, they are really working very hard to make the iOS also in a
26:26
stable mode. And it is an open source project. So, if someone wants
26:30
to contribute in their project, they can go on GitHub and they can
26:34
see the issues and they can start contributing in the open source as well
26:40
That's good. I think this is a really handy tool one should learn, because
26:44
you are right. I mean, I use Instagram a lot throughout my day, and I see
26:50
sometimes they'll push some changes, and I don't have to go and update the
26:54
app. I can see the changes in the app. So, I think
26:58
having to learn this thing is really nice. And, if I just
27:04
missed it, where can people learn more of this stuff like this? I mean
27:08
this is a really nice thing, and I don't think people get to know
27:12
about this if they are learning it from YouTube or anywhere else, right? So
27:16
where do you share any of your tips or where do you learn
27:20
about Flutter and all that? So, most of the time, I am more
27:26
active on LinkedIn. So, if you are a Flutter developer, join any Flutter group, so
27:32
you will see lots of posted posts. Okay, whenever there are new things will come, they will post
27:38
You will see really nice posts. So, if you find anything which is interesting
27:42
just go and check them out, and you can follow the official social
27:48
handles of the Flutter. So, if there is any update and anything, you will get to know
27:54
And C-Sub Corner is one of them. So, there are a good community
27:58
of Flutter, so you can check out the C-Sub Corner as well
28:02
Yeah, MD, and that reminds me that we talk about starting a Flutter show
28:08
right? And I think it is time we start, but I need someone like you along
28:14
with me to co-host the Flutter show, because you are an expert, right
28:20
I reminded you for that show, I guess, in October. Yeah, you know
28:30
we did everything, I know this is getting off-topic, but you know, we had everything
28:34
for the show, logos and all. The show was supposed to be called Flutter Flight
28:40
I saw your post on LinkedIn, and I guess so many people recommended
28:44
you to host as well. Yeah, about 30-40 people, I think, you know what, MD
28:50
if I don't do it in the next two weeks, you complain to my boss
28:56
Because I think there's no real Flutter show going on in the
29:00
community, there may be one or two, but I don't know, but I think
29:04
we should start. The show is going on, actually, but those are not
29:10
from India, actually. Those are from the European countries. So, yeah, definitely we need
29:16
to do some show in India. Okay. And one thing I would like to add here is
29:22
Sourpad is not a free tool. Okay, so up to a certain limit
29:26
okay, it is free. If you are having a big user base
29:30
okay, then you have to pay the premium for that. So you can
29:34
go and check out the Sourpad platform and you can check out all these
29:38
premium and all these like, how much they are charging. Okay. Done. I'll definitely
29:46
do that. Thank you so much, MD. I really love this session. I believe everyone
29:50
watching in and who will watch later on when this video is on YouTube
29:54
they'll watch it at your face, their face, they will really love it. Any final thing you want
29:58
to plug in before we wrap up the show? For example? I mean, any
30:04
final words that you want to say before we, you know, finish
30:08
the show today? Okay. So, I would like to thank Cesar Pernel for
30:14
giving this opportunity to come and present and you, you are really great host. Okay, so
30:20
I am one, if you are an upcoming Flutter developers, okay, so yeah, as I said
30:26
like, try to follow Flutter's channel and all Flutter handles on all the social medias. Okay. And
30:34
try to brush up the basic things of Dart, okay, don't directly go and jump into the
30:40
like, getX or block and provider, first try to understand the basic
30:44
thing, then come into the restrict management, and yeah, Flutter is very good
30:50
SDK to build a really nice app. Yeah, so that's it. Nothing more
30:54
from my side. Thank you so much, Emily, you're always very kind and
30:58
thanks for all that you do for the community and for the C Sharp. We're really, really
31:02
blessed to have you. As I say, whenever we think of Flutter
31:08
MDSFrag is the name that strikes our head. So thank you so much, MD, and
31:12
thank you so much, everyone. That was it in the C Sharp on the MVP show. We'll see you
31:16
some other time. Until then, take care of yourself, and we'll see you soon. Ta-da
31:20
Bye-bye. Okay, bye, Simon. Bye. Have a good day