- Видео 21
- Просмотров 39 297
Technotherapist
Объединенные Арабские Эмираты
Добавлен 30 апр 2020
Technology with Thoughts
Devlogs [Urdu] || Building card UI, updating job entity
Another episode of DevLogs series where we created a small UI card for a job and added more properties to the domain entity to reflect real data in the card.
We also did some refactoring and extracting out widgets.
#flutter #buildinpublic #architecture
We also did some refactoring and extracting out widgets.
#flutter #buildinpublic #architecture
Просмотров: 94
Видео
DevLogs [Urdu] || Debugging an year old code
Просмотров 2095 месяцев назад
After 10 months of inactivity, I finally opened the code for DevLogs and continue to figure out my way towards building a small app with good architecture in public. The video has some fixing and debugging of the old code that I haven't touched in almost a year, along with starting some extra feature development. #flutter #architecture #debugging
DevLogs || Home Page header development
Просмотров 158Год назад
Creating the header part of the explore page with working tabs for jobs & talent #flutter #architecture #dart
DevLogs || Home Screen Architecture || A simple custom Bottom Nav Bar
Просмотров 177Год назад
0:00 Intro 1:48 JSON null checks 3:30 Updating theme 4:52 Adding custom nav bar 22:17 Ending notes In this video: Adding null checks for JSON class Updating theme colors for both light & dark themes Creating custom nav bar with state functionality. #flutter #architecture #dart
The fastest way to add Firebase to your Flutter apps!
Просмотров 812Год назад
Just a couple of commands and your Flutter app is connected to Firebase in under a few minutes! No hassle of picking up bundle identifiers & adding separate apps to your Firebase project, one command does it all for you! #Firebase #Flutter #Cloud
DevLogs || Google Sign In, Firebase Auth, Firebase CRUD
Просмотров 239Год назад
0:00 Intro 1:22 Creating firebase project 4:32 Flutterfire 7:50 Google Sign In Firebase Auth 20:40 Firestore 37:30 Ending notes Implementing Google Sign In, Firebase Auth, and Firebase CRUD in our laid out architecture was never easier, just another implementation of abstract repositories and everything else remains intact! The code is in the same repository: github.com/wal33d006/devlogs_flutte...
Create an interactive immersive space for Apple Vision Pro using Reality Composer Pro & SwiftUI
Просмотров 14 тыс.Год назад
0:00 Intro 1:26 Creating new project 2:29 Adding 3D object in Reality Composer Pro 16:36 Unexpected problem 18:38 Adding gestures to the 3D object 28:24 Adding another object in the 3D space Build amazing immersive experiences using Reality Composer Pro, xrOS & SwiftUI for Apple Vision Pro. I am learning to figure out things related to Vision Pro and xrOS, I have picked up some bits and pieces ...
DevLogs || Implementing dual theme in Flutter, following the architecture
Просмотров 194Год назад
0:00 Agenda & pre-context 1:36 Adding theme 24:44 Ending notes In this video we are implementing dual theme with our current architecture that we have been learning in the previous series. The code is in the same repository: github.com/wal33d006/devlogs_flutter_xchange DevLogs || Onboarding: ruclips.net/video/eTzeiJtA8bI/видео.html #flutter #architecture #theme #darktheme #usecases
Coding with Apple's VisionOS for Vision Pro | A Developer's first-hand impression
Просмотров 15 тыс.Год назад
0:00 Agenda & pre-context 1:09 Pre-requisites 1:47 Simulator go-through 3:34 Create a new app 5:27 Some live coding 10:20 Ending notes How to get started with Apple's Vision Pro simulator and VisionOS development. Download XCode Beta 2: developer.apple.com/download/all/?q=xcode 15 The application shown in the beginning of the video: github.com/wal33d006/vision_pro_samples/tree/main/My First App...
DevLogs by Technotherapist || Onboarding || Flutter Xchange
Просмотров 571Год назад
The beginning of a new series called the DevLogs by Technotherapist. We are building Flutter Xchange's application from scratch using the architecture we have learnt in the series "Flutter Architecture for Beginners" which can be found here: ruclips.net/video/6aTyndnwy8c/видео.html In this first part: Creating onboarding UI from scratch Add google sign in functionality using mock Updating user ...
Flutter Architecture for Beginners (اردو) - Part 6 [Refactoring, Network Layer]
Просмотров 453Год назад
0:00 Agenda & pre-context 1:31 Refactoring 18:50 Network repository 30:34 Debugging error 36:55 Next video Part 6 for Flutter architecture for Beginners. We are refactoring and cleaning some code and adding a network repository Repository: github.com/wal33d006/flutter_architecture_series/tree/main/part_six Part One: ruclips.net/video/6aTyndnwy8c/видео.html Part Two: ruclips.net/video/bAiJ_ghDnt...
Flutter Architecture for Beginners (اردو) - Part 5 [code generation using mason_cli]
Просмотров 441Год назад
0:00 Agenda & pre-context 2:05 Adding mason template 05:48 Creating a new mason template 12:34 Hooks 23:41 Output directory 25:49 Generating the whole feature 35:50 Next video 36:20 Surprise Part 5 for Flutter architecture for Beginners. We are discussing boilerplate code generation using mason_cli in dart Repository: github.com/wal33d006/flutter_architecture_series/tree/main/part_four Part One...
Flutter Architecture for Beginners (اردو) - Part 4 [Navigation Layer]
Просмотров 515Год назад
0:00 Agenda & pre-context 1:15 Adding navigator to pages 12:14 Using navigator to navigate 21:22 Adding AppNavigator class as a layer 30:02 Ending notes Part 4 for the "Architecture for beginners" series. This is one of the most important and complex topic for beginners, we started from creating navigators and routes for our pages and then ended up turning it into a fully-fledged navigation cla...
Flutter Architecture for Beginners (اردو) - Part 3.5 [++Feature, Initial Params, empty constructor]
Просмотров 464Год назад
0:00 Agenda & pre-context 1:39 Recap 2:13 Adding a new feature 12:59 Setting user to initial state 14:31 Adding error to state 19:29 Adding initial params 24:47 Recap & ending notes Part 3.5 for the "architecture for beginners" series. We added a new feature to our code with some explanations about states, and initial params. Repository: github.com/wal33d006/flutter_architecture_series/tree/mai...
Flutter Architecture for Beginners (اردو) - Part Three [Either, Failure, Equatable, Exceptions]
Просмотров 554Год назад
Flutter Architecture for Beginners (اردو) - Part Three [Either, Failure, Equatable, Exceptions]
Flutter Architecture for Beginners (اردو) - Part Two [Repositories, DI, domain & data layer]
Просмотров 826Год назад
Flutter Architecture for Beginners (اردو) - Part Two [Repositories, DI, domain & data layer]
Flutter Architecture for Beginners (اردو) - Part One [Create Cubit, refactor code, emit states]
Просмотров 2 тыс.Год назад
Flutter Architecture for Beginners (اردو) - Part One [Create Cubit, refactor code, emit states]
Flutter - Callbacks in a custom widget
Просмотров 5254 года назад
Flutter - Callbacks in a custom widget
Create a fancy card in Adobe XD and export it to Flutter
Просмотров 2984 года назад
Create a fancy card in Adobe XD and export it to Flutter
Make API calls in Flutter using TDD approach
Просмотров 1,4 тыс.4 года назад
Make API calls in Flutter using TDD approach
Thank you. Subscribed for more videos
Thank you so much waleed bhai.. Mery oops kay concept clear ho rhy aapki videos say.. Thanks alot❤
please make video on setting custom environment
at 3:15, when we are setting default value in userJson, id: json['id] as int? ?? 0 instead of this, why don't we write=> id: json['id] ?? 0
That’s because we treat backend as dumb. It could send a null. So json[id] could be a string, or a double or a null. And if we directly parse it as int and it’s something else, it would throw an exception. So we parse it as a nullable int which means if it’s anything other than an int, it will become a zero. Sorry for delayed response, I am not well these days
@@_technotherapist Great, thanks for the detailed response and I pray for your speedy recovery. Looking forward to have more such informative videos. Thank you.
sir please make a more videos
I am going to come back to youtube insha Allah. I am not well these days
Waleed Bhai Bohat Shukria aap itni help kar rhay.. Allah Pak Jazaye Khair Atta farmain Ameen.. Bhai search bar per next video ager bna dain.. aur kindly aap apna bta dain..kya aap yehi architecture follow krty?
I can make a video on search next. Yes, more or less I follow the same architecture. When apps get bigger, I further refactor folder structure, but the architecture is pretty much the same.
Thanks
As you are going to refactor things in next video, I would like you to handle font responsiveness too like you handle in your real time company projects. Right now we are passing fixed constant height, widths, font-sizes. We should make it responsive for different mobile app screens and handle like you do in complex large scale apps. :) thanks
From what I have experienced, the font size is relative to the font size you have set in your phone. If your phone has larger font size, the app will show larger font sizes, if it's smaller, the app adapts to that. I just tested the live Flutter Xchange application on both iOS and Android, it adapts the font sizes based on what you have set in your phone, it caters accessibility automatically. So font sizes can be hardcoded if you don't need some rocket science in your app. Regarding the heights, widths and responsiveness, I usually use MediaQuery and LayoutBuilder, you can check this here: ruclips.net/video/LeKLGzpsz9I/видео.html You can also learn about responsiveness and adaptiveness from Flutter's official documentation. docs.flutter.dev/ui/adaptive-responsive In theory, I always try to give 16 paddings from the walls of the device and let the UI expand in the width. I don't give heights to anything since the components automatically take up whatever height they need and I give them 8/16 paddings within. For some components, like the Event banner on top of the events tab in Flutter Xchange application, I give them a height divided by the height of the rendered screen size using MediaQuery. Something like MediaQuery.of(context).size.height/4. Vertical spacings between components is usually 8 or 16 which falls under popular design guidelines. For cross platform UI adaptation, I use LayoutBuilder with MediaQuery. If you have a screen width that's more or less than a certain threshold (you can set it yourself) you can change the places of the components in your view. Example: Bottom bar in a phone-view might become a sidebar in a broader website or tablet view. For scalability, it is different based on situation. You can start simple, hardcode things, and improve them, extract out repeated code and keep improving things as per the need. You can extract out complete UI components so that you can easily place them differently for mobile and web view. But you would need that only if you are going full cross platform on a single codebase. If you are developing for mobile only, you might need to extract out UI components for reusability but might not need to over-architecture things. I was planning to make a video for this, but I found a lot of good content from Flutter's official documentation therefore I didn't create a separate video for this specifically, but I would mention it briefly in my next video. I hope it helps. Thank you.
@_technotherapist Sir still waiting part 7 to onwards
I am getting back slowly, will get there soon insha Allah
@@_technotherapist إِنْ شَاءَ ٱللَّٰهُ
The wait is over, Long time no see! Finally, you are here❤. Thank you so much, sir. Please continue; we are waiting eagerly
I was waiting for this. Good to see you again. Just a question. The Architecture that we followed in this series initially was like that lib -> domain -> models, repos data -> usecase, entities, repos, stores presentation -> each screen 5 files (cubit, navigator, state, page, params) but in this video you move this folder scheme/architecture inside each presentation section... like you made like that -> presentation -> explore page -> domain (models, repo), data (models, repos) Can you please let me know which one we should follow as Standard and which is being used by large scale apps in market right now. thanks in advance and once again they way you explain things, I have never seen before.
Thank you for your kind words, I am glad it helps. Regarding your question, I figured out I ripped the folder architecture I was following, we will fix this in the next video. Thanks for pointing this out, I was just navigating the code and figuring out my way, that's the beauty of unplanned live coding, the presenter also gets to learn. Thanks.
This level of clean code is really inspiring..learning a lot from it🙌🏻
Thank youuu for this amazing explanation!!
Broseph, thank you for the knowledge share. Excellent topic chosen. Would you be as kind as to clarify the name of the developer video that has the code?
Here is everything related: developer.apple.com/visionos/learn/ I am learning from here as well
@@_technotherapist Thank you much.
What language are you coding in?
It’s SwiftUI
I am interested in using it for coding. Not building apps for VisionPro. Seems like it need coding apps.
Same, trying to find a search term that doesn’t include coding FOR VisionPro
Check out the next video, I integrated 3D objects and controlled them with SwiftUI code there, hope you like it 🙌
For BLoc same navigation structure follow kia jaiga ? jaise Cubit me kar rahe he navigating from cubit ?
Yes, navigator injected in BLoC and navigator function being called from BLoC
Excellent explanation, Love your teaching. Really help full Series ❤
What Xcode version are you using in this video?
XCode beta latest
Amazing Sir❤🎉 Also Congratulations for going abroad.🎉🎉
💞 "Promo sm"
Great sir g❤
Waleed bro! This is one of it's kind. Agay badhay hum Sab connected hain
Great series Waleed bhai! Thank you for your efforts! 👏
Slam sir. I must commend your remarkable work, and the impressive manner in which you explain concepts. I have learned a great deal from you. I find myself facing a challenge with the BuildContext that you've set in the initState of the UI. Is there a method to enhance this aspect?
Yes there can be multiple ways, I am going to fix that in my upcoming videos. I am myself figuring out the best way to do it. Will update this soon. Thank you for your appreciation, I am glad the sessions help you out
Mjhy aik baat ki samjh ni ayi ham pori series mai main page k liye stateful widget e kyu use kar rahy hain ?
Good question. One reason is we want to use initState function to initialize our context and cubit. Secondly, we are not rebuilding complete page every time the state changes, we wrap our UI parts in BlocBuilder and only those parts rebuild on state changes, so we don’t have to worry about the page being stateful since it is not completely rebuilding. Not a very good hack but works in our case
is there any way to handle context outside of initState ? @@_technotherapist
@@gizmogeeksguide Yes I am going to fix that soon, there can be multiple ways, I am still figuring out the best way to manage this, will try to incorporate it the upcoming sessions
thanks alot sir for your playlist .... but sir i am stuck .... mere pass ek case aya for example me user list page py hun or wahan se me detail post py ja rha hu its working fine but agar osi screen se mene multiple jagah par jana ho to is case me kya hoga qk apne to user list navigator route ko detail k sat attach krdia ab mere pass for example ek posts ki screen ha to woh yahan py kaise kron ga
UsersListNavigator with UserDetailsRoute, PostsRoute, CreatePostRoute You can attach multiple routes to a single navigator
Thanks for your respond sir❤️
Bhai is k Baki. Full project Kahan Hain??? From start...
The project has only one repo and I am adding all the code to the same and updating it with every video. You can check the previous commits for old code if you want to see the start. I am not making separate repo for each video for this DevLogs series
getting so much learning in just half an hour is amazing..thank you for this
Amazing explanation Sir👏🙌
yehi chahiye tha bari mushkil sy mila hay abhi b ni milna tha agr ap ki video asif taj k channel py na pari hoti to. Thanks to both of you guys Learns a lot form both of you but your teaching style is awesome. Keep it up bro. esy e hamain sikhaty rahy and don't stop it.
Thank you for your kind words. My videos are not very frequent like Asif’s. Youtubing is really difficult for me, but I am trying my best to keep making videos. Thank you
thanks for making this series bro itna acha content mjhy kahi nhi mila
Great job! Thank you for not editing out where you ran into issues. Listening to you work through the issues was equally as helpful as the video.
I am not a pro RUclipsr, I don’t edit, I just screen record and post it directly in its raw form. Thank you for enjoying these 🙌
This is an excellent project. The only change is Earth should be the 3rd planet from the Sun.
😁 thank you for your kind words 🙌
you did great job well done
for windows, you'll have to enable developer mode and ensure that the environment variables are set up properly. other than that, good vid
Thank you for this. That’s a part of the setup process. 🚀
Thanks man, It's an explanatory video.
Thank you for this video!
Thank you so much Sir🥰
Wow...Awesome video. Thank you, men.
good! please tell how to make a user and then ask him to fill the form and then next page show those details with image ,,, user can signin using facebook. and linkedin and google as well...also i cant understadn this flow of signing in the user, and then taking data and storing it and then displaying its details
Hi, Already done that in the latest video of DevLogs series
MashAllah! just started!
sir nai smjh ayai sahi sai :( please step by step krwaihn
If you are having difficulties understanding this, I would recommend you follow some basic Flutter codelabs by Google or some other basic level tutorials first, as I said in the video, this is for those who have already worked in Flutter a little and now are looking to learn advanced architecture stuff. I would recommend you check out this link and work your way through: docs.flutter.dev/codelabs
now do firebase login using google and linkedin etc using this method from scratch
Follow all the parts and then look into DevLogs series
👍
Hello Mr Waleed. Hope you are doing good. Please make a series on a simple app where we handle 1) user session 2) local database 3) Rest API (multiple endpoints used on 1 screen , i.e 5 endpoints data need to show on 1 screen) 4) Handling Network images(As using cachednetworkimage gives a flickering/blinking affect) 5) Where to wait when data is loading and prevention from fetching data again and again. 6) Checking connectivity for internet. All these things using the same architecture. Your teaching methods are understandable. Thank you.
Check the DevLogs series, I am creating Flutter Xchange app from scratch in there. All of the above points will hopefully be covered there
+1
Sir aik video may yeh samjha dayn kay every folder ki kia working hay means repository may kia hota hay, data layer, domain, state-management, network,and all other stuff in simple words... Jaisay ap nay btaiya kay cubit ka yeh kam hay sirf state ko daikhna baki kuch nahi... Isi tarha, if possible then aik video may wo be bta dijiye Thank you so much...
Very informative both devlog videos... Sir firebase and CI/CD with some test-cases. Also lints... Thank you for this series❤❤.... Sir, kia hum choti choti applications may be implement kar layn for the sak of practice. Because practice is must. I called myself a beginner intermediate 😅.
Thanks, sir. It is really helpful for us
Amazing Lecture sir how can we add firebase by using any statemanagement is the code related fierbase will come in data layer or in api repository ... if any link to understand these concepts plz share
My next part will be about firebase, it will come as a new implementation of a repository inside the data folder
It is a really interesting and helpful series. Waiting for further DevLogs videos. thanks