How to Build Server Driven UI w/ Firebase + Jetpack Compose
ฝัง
- เผยแพร่เมื่อ 16 ก.ค. 2023
- Hey there! Get ready for an exciting tutorial on building server-driven UIs for Android. Server-driven UIs may seem like an advanced topic, but fear not! In this beginner-friendly example, I'll introduce you to the concept and show you how to harness its incredible flexibility and scalability. Join me as I demonstrate how to leverage Firebase's Realtime Database to bring it all to life. So grab some popcorn, sit back, and let's dive into the world of server-driven UIs!
Don't forget to subscribe and enable notifications to stay up-to-date!
Jetpack Compose Basics: developer.android.com/codelab...
=========== Popular Series ===========
Redux e-commerce app: • Season 10: E-commerce ...
Rick and Morty app: • Season 6: Rick & Morty...
=========== Connect with me ===========
LinkedIn: / domenic-polidoro-802b72b4
Instagram: / dom_polidoro
Twitter: / developer_dom
Tiktok: / building_android
Thanks for stopping by if you watched the premiere with me -- let me know in the comments your thoughts or any questions you may have!
Looking forward to this
Starting soon! Join me live
Very informative video. Thanks for helpful tutorials !
Glad it helps! Pretty cool how it all works and not super complicated 🙂
This is amazing, I don't know why some big companies still using webview to build their apps, such as Amazon shopping app, and their argument to defend this (from what i have looked up online) is that the UI can be updated without having to push app updates through the play store...
Thanks for the comment and watching!! This is a super interesting problem, especially at scale (like Amazon or something). When you do it through web views, you get the web implementation AND the mobile implementation from one bulk of work. I think that's the most powerful bit of that work. This backend driven UI concept is SUPER powerful, but it can be a big effort to get the application very configurable. I still had fun building it, and it has its usages in production, but some people/companies are stuck in their old ways because "if it isn't broken, don't fix it" 🤷
many companies in the world use server drivern ui ,, like ARBIN VTC ,, Shopify ,, alixpress etc and many more
I like the concept, recently learned how to draw in canvas jetpack-compose, wanna try to create Generic E-commerce Template based on this idea, with my drawn icons and composables.
That sounds like a great application for something like this! Many different ways to display the products and such, adding them to carts, etc. You should definitely try it out!
This is cool! Great video. I wonder this paired up with navigation would become very powerful. I guess this where some SDUI frameworks come in?
Yeah it is pretty cool -- thanks for watching! It can get pretty complicated pretty quickly to manage navigation and "nested navigation" such as a tab layout or something similar. Working in Android or iOS (Kotlin or Swift) the languages are "strongly typed" in comparison to something like java/typescript (Web) which may have an easier time implementing certain aspects of this methodology. Regardless, it is still possible to build out more complicated solutions to grant you navigation capabilities and such, but it does require a bit more design and thought beforehand.
In our example though, the NewsItem data class does have an ID field on it, which you could use to "fetch that news item by its ID" if you wanted to handle something like navigating from the list/grid view to a more detailed view on a particular item the user selects. So simple things like that aren't too difficult to figure out, but something like an "add to cart" feature might get a bit more complex. All possible though! Hope this helps :) I haven't really used any specific SDUI frameworks -- typically always a custom build because it just makes sense to have full control when you do something like this.
@@TheAndroidFactory Got it. I have heard about Epoxy but I guess now with compose it is easier to build the custom rendering engine. I get it that state management would get complex pretty quickly.
This video was my first time seeing SDUI in action, pretty good intro. Would be great to take this forward and look into state hoisting.
Yeah epoxy is great, but compose is superior for sure. I will try to think of ways to build something out further
Wow, just timely with Compose Multiplatform could probably leverage this idea!
Oh for sure! You may want different layout types based on the system it's running on too. For instance, a grid with 4 columns doesn't make a lot of sense for a mobile device, but it would if the Compose app was running on your desktop using Compose for Desktop, yanno? You can very easily add in "client type" (mobile vs. desktop) to some request when fetching the data and it could return to you a layout style that makes sense for the platform. Or, in our example, even in the "grid" layout type, you could have "columns_mobile=2" and "columns_desktop=4" and it would accomplish the same thing! Lots of power here :)
😲🔥❤️👏
Starting soon! Join me live
i have a quesion for you sir suppose if we want to add a contact/Note(for this app case) and we move to another screen then we move bacak to our main screen of contactList/note collection (for this app) then we need to fetch all data again(of contacts / notes) and our main screen will recomposed again Is there any way to get rid if this unusual recomposition of main screen ?
Hmm, a little tough for me to say, but have you tried using rememberLazyListState() or does that not solve your problem? I'm having a tough time understanding where the problem is. Maybe you need to manage the data better? Are you using ViewModels and Flow to emit information your Composables display? If so, your Composables should only be updating when they think something has changed. Can you explain the problem further?
Can we use Firebase Cloud Firestore instead of Firebase Realtime DB?
Absolutely! I've never worked with it yet actually, but I could probably make another video about it!
@@TheAndroidFactory ok, I am waiting for your upcoming videos, great stuff, and I must say you are a great teacher.
Can I suggest something -
Problem we face as an beginner developer -
Beginners (myself) know how to write code and build very basic apps but don't know how to build production standard apps and noone even a single youtuber solve this issue, they provide good tutorial but on a single problem or how to build this functionality, but noone cover how to build app from zero to production grade and they don't know what goes through a beginner mind as they are good engineer, they don't understand our mind of state.
My suggestion is
make any app and cover the full journey from designing the app to making the first version (basic app)and publishing it on Play Store with CI/CD pipeline and then gradually increasing complexity of the app and updating the first version - adding some more functionality , increasing complexity and then pushing an update and covering some other topics like test cases, debugging etc..
Awesome feedback!! I truly love it. And I want to help. If you haven't watched the Rick and Morty series yet, I would recommend you check it out. I go from File -> New Project all the way to publishing on the Google Play Store! There aren't tests and automation around deployments, but those are definitely more advanced concepts. To be honest, I've single handedly built multiple production applications either solo or on a team without tests 🤷 I'm not saying tests aren't valuable, but they definitely ARE NOT necessary to launch something!
@@TheAndroidFactory I really loved Rick and Morty season, and awesome learning in that season, thank you so much ,
As you are an experienced developer who is currently working in the Industry,
Can you please make a video about how to get into android dev roles, what it takes, what one needs to learn and how , about projects and your journey etc..
Yeah I know a lot of these roadmap type videos are out there, but most of them are just youtubers, not working in the industry and sharing things that they don't have experience of,
I know I am asking a lot , you don't have much time, sorry for asking, but whenever you do have time for the next video, I want your video on this problem, that would be great help to us.
Don't be sorry for asking - some great ideas! My only issue with non-coding videos at the moment is they wouldn't be very appealing to watch because I don't have a camera to record myself talking nor a good place with a clean background to make that kind of video clean looking. I like the idea, so I'll keep it in mind and try to figure something out!
can you share code
Did I not push it to GitHub?
18:38 nice! we crashed he app
Thanks for the idea.
Hahaha gotta test everything! Simple fix :)