Build an Offline First App using Flutter, Node, Bloc, Express, TypeScript, Docker and PostgreSQL!

[@cyberworldhack]

Rivaan the flutter expert

[@fatihyilmazz]

We missed you, I was just looking for a nodejs typescript docker microservices video. It came from my favorite guy. Welcome king.

[@pragatikalwar6851]

As I am complete beginner to node js . Can I watch this ?

[@axixkhanii4321]

@@pragatikalwar6851 You can but the docker is setup up with this and this guy is doing every thing perfect but I prefer you to start Node from local and don't involve with docker for now.

[@medoxcharm4561]

We missed you bro it's good to see you again, keep going bro you are the best

[@RivaanRanawat]

Thanks:)

[@-IT-KumarTe]

Hi Rivaan, I’m a final-year student currently working on a project titled Smart Parking Finder and Management System. It involves real-time parking availability, seamless booking, and efficient management using Flutter, Node.js, and PostgreSQL. Your tutorials have always been a great source of guidance for me. It would mean a lot if you could create a tutorial on a similar project to help students like me in implementing this system effectively. Thank you for the amazing content you provide! Looking forward to learning more from your channel.

[@sahilsinnarkar9650]

Bro you are such an expert in these stuff, really inspirational

[@shahabdolatabadi4116]

Hi Rivaan. Your tutorials are awesome. Detailed, clear, and comprehensive. One question. Will you be creating Serverpod tutorials in near future?

[@cptsakamoto]

I believe facing a realworld problems and fixing in a video gives proper understanding, if the someone dont want to see the fixing they can always skip

[@monaelkateb2652]

Another great tutorial, thank you.

[@saiphaneeshk.h.5482]

Watching Flutter Ad in between flutter tutorial, 👏 👏 👏 Edit: 12min Ad, damn

[@KrishnaparthDave]

Rivaan keep doing such great projects and thank you for sharing this with us and I really love your Flutter project videos

[@ivelandry2931]

The 🐐 dropped another, dunno why I didn't get notified Rivaan please clone file manager next, It'll help me a lot

[@actu-soft]

Thank you for this good job, so please do the second part to complete us all knowledge!

[@gamershubhya9769]

Your video will make my resume Stronger 💪🏻

[@infotration2225]

Last month i was searching for video for postgrasql and flutter now your video appear. It's like reading my mind and creating video for me. Thank you 😂❤ sir

[@RivaanRanawat]

Hahaha, happy to see you're trying out new things!

[@balogunmurtadho6157]

Rivann tutorial >>>>>>>>😍😍😍

[@Ash-2906]

Great content Rivaan. I'd appreciate it if you could make a tutorial on background syncing using workmanager pluggin.

[@savitrik3596]

Thank you for these insightful vids . Very helpful. So much to learn from u.

[@RivaanRanawat]

Thank you:)

[@landrynignan4426]

Goood job, I hope to see work manager tuto👍

[@Eunsmoqj]

thanks for doing this!

[@SsSs-gb9kj]

Today is my interview. Lord Rivaan ranawat thunai( means Lord Rivaan Ranawat will help me to pass the interview😂 ). Thanks a lot bro.

[@randomcsguy2065]

GUESS WHO IS BACKKKK

[@dreamlightcitymd940]

You can use Vania dart framework for rest api server, you can also deploy to render as docker cont

[@avparadox]

Thanks for making videos❤

[@thebeymaxgaming2.o991]

6:00:06 Day 4 (Completed!!!)

[@nodirectionvlogs7237]

hey rivaan i am geting issue 1:47:4 Pulling schema from database... error: password authentication failed for user "postgres" how can i fix?

[@chuncheongliu8550]

I fixed by delete "local" PostgreSQL, cause it is rather running in local than in the container.

[@nodirectionvlogs7237]

@ oh thnks i will try this

[@Ash-2906]

Hey RIVAAN, could you make a tutorial on production level application which can be put on resume? I mean this tutorial is very helpful from learning perspective and clears lots of concepts and thank you for that. but I was hoping for an app which can be used in real-world.

[@thebeymaxgaming2.o991]

4:08:27 Day 3 (I skipped some days! but i'll continue from today!!)

[@RivaanRanawat]

Only 2 hours left and the best part of the video imo!

[@satyamjha43]

Rivaan is heree🎉🎉🎉

[@AS-pt1mf]

What is architecture name do you use 😅?

[@nikhilmeghani9667]

Please give the link of GetX state management video ?

[@muhammadrahman3984]

Rivaan cloud you please make a tutorial about ads how to integrate where what ads is integrated and their police also discuss

[@todaytech7011]

love the video title i look for video where i can learn docker with postgress sql and i find it .

[@himanshukandwal3203]

if multiple devices add tasks locally, how will we sync all of them?

[@ShubhamKale-q2y]

We can use Hive Database For local Db its more Easy as compare sqlite

[@AMANKUMAR-km5ck]

Brother, i have an issue. When i am adding color picker, then for the first time when i am going in the add task screen, then check icon is not showing on the selectedColor. Also, when i am clicking on textfield, then for the first time, keyboard automatically disappears. After that, check icon is showing on the selectedColor and keyboard is not disappearing. How to fix it? Plz help. Code: Widget build(BuildContext context) { return GestureDetector( onTap: () => FocusScope.of(context).unfocus(), child: Scaffold( appBar: AppBar( leading: IconButton( onPressed: () => Navigator.of(context).pop(), tooltip: 'Back', icon: const Icon(CupertinoIcons.chevron_back), ), title: const AppName(), ), bottomNavigationBar: isBannerLoaded ? SizedBox(height: 50, child: AdWidget(ad: bannerAd)) : const SizedBox(), body: Padding( padding: const EdgeInsets.symmetric(horizontal: 20), child: ListView( children: [ const Text( 'What\'s your plan?', style: TextStyle(fontSize: 15, color: Colors.grey), ), const SizedBox(height: 10), CustomTextFormField( controller: _titleController, hintText: 'Plan', onFieldSubmitted: (value) { _titleController.text = value; }, ), const SizedBox(height: 20), const Text( 'Provide a brief description', style: TextStyle(fontSize: 15, color: Colors.grey), ), const SizedBox(height: 10), CustomTextFormField( controller: _descriptionController, hintText: 'Add note', isForDescription: true, onFieldSubmitted: (value) { _descriptionController.text = value; }, ), const SizedBox(height: 20), const Text( 'Set target for each day', style: TextStyle(fontSize: 15, color: Colors.grey), ), const SizedBox(height: 10), customTargetContainer(), const SizedBox(height: 20), const Text( 'Select color', style: TextStyle(fontSize: 15, color: Colors.grey), ), const SizedBox(height: 10), Container( decoration: BoxDecoration( color: Theme.of(context).scaffoldBackgroundColor, border: Border.all( color: Theme.of(context) .colorScheme .secondary .withOpacity(.4)), borderRadius: BorderRadius.circular(10), ), child: ColorPicker( onColorChanged: (Color color) => setState(() => _selectedColor = color), width: 30, height: 30, color: _selectedColor, padding: const EdgeInsets.all(0), enableShadesSelection: false, pickersEnabled: const {ColorPickerType.wheel: true}, ), ), const SizedBox(height: 20), const Text( 'Select icon', style: TextStyle(fontSize: 15, color: Colors.grey), ), const SizedBox(height: 10), Container( height: 120, padding: const EdgeInsets.all(5), decoration: BoxDecoration( color: Theme.of(context).scaffoldBackgroundColor, border: Border.all( color: Theme.of(context) .colorScheme .secondary .withOpacity(.4)), borderRadius: BorderRadius.circular(10), ), child: GridView.builder( scrollDirection: Axis.horizontal, gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount( crossAxisCount: 3, // 3 rows mainAxisSpacing: 10, crossAxisSpacing: 10, ), itemCount: _icons.length, itemBuilder: (context, index) { final icon = _icons[index]; final bool isSelected = _selectedIcon == icon; return GestureDetector( onTap: () { setState(() { _selectedIcon = icon; }); }, child: Icon( icon, size: isSelected ? 25 : 20, // Increase size if selected color: isSelected ? _selectedColor : Colors.black87, ), ); }, ), ), const SizedBox(height: 10), Row( mainAxisAlignment: MainAxisAlignment.spaceAround, children: [ ElevatedButton.icon( onPressed: () { _titleController.clear(); _descriptionController.clear(); Navigator.of(context).pop(); }, style: const ButtonStyle( backgroundColor: MaterialStatePropertyAll(Colors.red), foregroundColor: MaterialStatePropertyAll(Colors.white)), icon: const Icon(Icons.close_rounded), label: const Text('Cancel')), ElevatedButton.icon( onPressed: () => _createOrUpdateHabit(), style: ElevatedButton.styleFrom( foregroundColor: Colors.white, backgroundColor: Colors.blue), icon: Icon(isHabitAlreadyExist() ? CupertinoIcons.refresh_thick : CupertinoIcons.list_bullet_indent), label: Text(isHabitAlreadyExist() ? 'Update' : 'Add')), ], ) ], ), ), ), ); }

[@thebeymaxgaming2.o991]

22:30 Day 1

[@granxavi]

Thanks bro! Iam watching The Ultimate Dart & Flutter Course 2024 in Udemy, and I wonder why did you took it down?, I bought it before you take it out, but I wonder why? It looks fine.

[@SajithS-xb6hd]

What is the vs code theme you are using ?

[@sujan2820]

Thank you so much

[@satdevlpr]

Thanks and as always great video.. humble request.. can you make a e-commerce Flutter app using Appwrite as backend with User and Admin Panel app ?

[@Shreyans-vc7eh]

Why bloc and not riverpod?

[@RivaanRanawat]

Last project video was riverpod (Spotify clone), let's try out new things!

[@vitami07]

Hey guys! If anyone has problem with nodemon in Windows, and your changes are not reflected to Docker, (I found it after hours of searching as I am a docker newbie..) just replace the "scripts" key in package.json files. from this "scripts": { "dev": "npx nodemon" }, to this: "scripts": { "start": "ts-node src/index.ts", "dev": "nodemon -L ts-node src/index.ts" },

[@AkashPatel-lo7vg]

Thank you so much, @vitami07! I was facing the same issue and couldn't find a proper solution. Finally, I decided to check the comment section, and here you are, solving my problem!

[@Ash-2906]

Oh Man!! Thanks a lot for letting this know. I wasted so much of time on this and finally thought to check in comments but I'd say worth checking here.

[@asad_alpha_]

Oh thankyou so much brother

[@Decem02]

I was so missed you 😢😢😢

[@freelancermunim-eq4wm]

Please make a complete project with flutter and django.

[@asuquoeyah1463]

How is Rivaan able to know all this. I love to follow his learning path 🙏

[@FatimaHasan-l9k]

can you please also make a full deep video on getx including all three ( route managment, state management, dependency injection). It would be very helpful for the people who are using getx . Pleaseee do ittt

[@RivaanRanawat]

kzbin.info/www/bejne/sJ2smKxqmthoitU

[@MahaLakshmi-bi8vv]

How do create Mobile model in vscode like this pls tell me sir

[@SpeedCodes-oc7ed]

awesome!

[@SagarShende-l7i]

Rivaan what is your thought on the nylo framework

[@RivaanRanawat]

I find it quite similar to GetX - Yes, it is a micro-framework not a package but it seems to do what GetX does. And I'm not a big fan of GetX for the reasons mentioned in this video - kzbin.info/www/bejne/sJ2smKxqmthoitU Please note that I've not looked at the source code of Nylo yet so take my comment on this with a grain of salt. Many things mentioned in the video are applicable for Nylo as well. I do like the consistency with which Anthony is working on it and maybe my thoughts change later on but as of now, I wouldn't use it.

[@SagarShende-l7i]

@@RivaanRanawat yeah correct, I watched that video on Getx that's why I may be using Bloc or Riverpod for State management... want to use own customization coding style

[@isaacakindipe]

Thank you, Rivaan! Pls, build an AI app with Llama 3.1/3.2 and Flutter.

[@RivaanRanawat]

Think you'll like the next video!

[@isaacakindipe]

@@RivaanRanawat I am highly expectant of your next video. Thank you so much.

[@BurnzGtaV]

is this course beginner friendly

[@thebeymaxgaming2.o991]

2:08:33 Day 2

[@RashidKhan-kd9xl]

Finally ❤❤

[@wittywidgets]

I want to have video on ANimation please

[@sidds09]

pls do backend projects in python with Djnago, drf and fastapi

[@rajkadam1199]

Hello! I am your subscriber. I like your tutorials very much. Also I likes your each video. Could you please make a tutorial on RedBus like app. It will be most useful for me and also there is no any tutorial by someone on KZbin that I found to be match redbus clone

[@Stefano.grosso]

Again, great Tutorial! Could you maybe include Go_Router in One of your future projects? Would be nice to have a more hands-on and project based usage of it, beside the plain tutorial you offer on your channel.

[@jeromesimms]

Lets gooo!

[@RivaanRanawat]

🔥

[@hashankannangara8723]

Great🎉

[@DilipKumar-p1e7c]

what machine are you using ?

[@RivaanRanawat]

Macbook M1 Air

[@praveenatherva7667]

next video flutter with nodjs mongodb

[@RivaanRanawat]

Already covered in Amazon clone vid

[@quizmania06]

it's best to show how to debug the errors and resolve them too

[@LEARNCOMPUTER-ie6pr]

Sir plz make a all video downloader

[@pandapubg6426]

Bro bro how to host backend??

[@FunnyDummy-ej7xs]

Use vercel/AWS

[@adityasinghrajput7815]

Vscode theme?

[@RivaanRanawat]

One Dark Pro Monokai Darker

[@ivelandry2931]

I really really need that and will be so grateful if you can fulfill my request

[@BukkyOdunsi]

Rivaan!!!!!

[@RivaanRanawat]

How's it going Bukky?

[@vloggeranki]

​@@RivaanRanawat It's awesome, bro! I randomly found it and started watching it continuously ❤❤❤❤❤

[@salmanrafi125]

❤️❤️❤️

[@codewithroman8180]

Plz flutter nodjs backend plz mongodb

[@RivaanRanawat]

Already covered in Amazon clone vid

[@codewithroman8180]

@RivaanRanawat do more project

[@codermadushan]

❤

[@scotts3062]

Firebase storage is now paid🙂..please teach us cloudinary

[@RivaanRanawat]

Covered it in Spotify Clone & Amazon Clone videos

[@FunnyDummy-ej7xs]

03:07:00 😂

[@nitinmore7686]

4.05

[@nitinmore7686]

1.49

[@nitinmore7686]

2.46

[@seemamore9884]

3.41

[@nitinmore7686]

3.57

[@nitinmore7686]

3.00

[@nitinmore7686]

3.22

[@codewithsadid]

love you @RivaanRanawat

[@nitinmore7686]

2.14

[@marufhassan634]

If someone is continuously getting "Type null is not a subtype of type String." at 2:47:00 Use this as your factory model in user_models.dart factory UserModel.fromMap(Map map) { return UserModel( id: map['id'] ?? '', email: map['email'] ?? '', name: map['name'] ?? '', token: map['token'] ?? '', createdAt: map['createdAt'] != null ? DateTime.parse(map['createdAt']) : DateTime.now(), updatedAt: map['updatedAt'] != null ? DateTime.parse(map['updatedAt']) : DateTime.now(), ); }

[@LEARNCOMPUTER-ie6pr]

Sir plz make a all video downloader