Flutter Facebook Clone Responsive UI Tutorial | Web and Mobile

Поделиться
HTML-код
  • Опубликовано: 3 фев 2025

Комментарии • 371

  • @WorstDeveloper
    @WorstDeveloper 4 года назад +368

    This is so much better than those "speed code" videos everyone uploads.

    • @sharishth
      @sharishth 4 года назад +17

      Yeah I mean whats the point if you are copy pasting. Might as well download and install app.

    • @iJuce
      @iJuce 4 года назад +19

      who tf watches speed code

    • @TheSclare
      @TheSclare 4 года назад +8

      Speed codes are pretty much pieces of garbage videos. We want to see the code, not the damn "show".

    • @benbenzyhome
      @benbenzyhome 4 года назад +4

      they even makes me hate flutter at times

    • @poyocadena
      @poyocadena 3 года назад

      Ya hasta me estaba poniendo nervioso porque no le entendía a flutter y quería abandonar, pero volví a recuperar la inspiración gracias a ti!

  • @khalidkhan5308
    @khalidkhan5308 4 года назад +233

    If u click on dislike please also give the reason in comments, the author put so much hard work to make like these videos I don't know what's wrong with this tutorial it's really hurts those who spends so much time. Don't be jeleous let appreciates

    • @mahmodulhasan7
      @mahmodulhasan7 4 года назад

      hmm bro that is

    • @RNMERIA
      @RNMERIA 4 года назад +1

      Idiots dislike such quality contents

    • @kenkaneki5433
      @kenkaneki5433 4 года назад

      @@RNMERIA not your fucking deal bastard who dislikes what

    • @RNMERIA
      @RNMERIA 4 года назад

      @@kenkaneki5433 Fck off you as*H*le for disliking this video

    • @Aadvait
      @Aadvait 4 года назад +3

      @@kenkaneki5433 Can you fuck outta here? Fucking inbred scumbag

  • @Cccccccccccl
    @Cccccccccccl 4 года назад +27

    I love the way you organize your widgets in their own files and then just export them into the main.dart file. I'm new to flutter and while I've watched many videos about flutter, I haven's seen any that show how to organize files, let alone any that organize their files such as you do. I really like it!!

  • @jackychen2109
    @jackychen2109 4 года назад +11

    Bro when I saw that you have a course I didn't even think twice to buy... Your teaching & delivery style is amazing! Thank you!

  • @TonyOwenUK
    @TonyOwenUK 4 года назад +14

    Long, but worth it. I like how you haven't copy and pasted code, showing the exact process. Great video

  • @Isthiyaquekambathagothi
    @Isthiyaquekambathagothi Год назад

    Am shocked to see only few people subscribed to your channel, i remember subscribing to you when i wanted to learn flutter, i started with your travel app video, now learning about responsive web and mobile, and found you made a video 2 years ago, keep doing what you do.

  • @lokeshj0210
    @lokeshj0210 4 года назад +9

    I won't say thank you, I'd rather say Love you, Sir! This one is the most helpful Flutter Video for me, I've been coding in flutter for over 12 months now.

  • @RACAPE
    @RACAPE 4 года назад +3

    I never considered to learn flutter. But I saw this video and I was: "Why not?". I'm sure that this will help me. Now I'm on front side with sass, javascript, react, vue. But why not? Every new thing you learn, it's a new step forward for a greater future.

  • @thomastthai
    @thomastthai 10 месяцев назад

    Excellent tutorial. Well explained with a calm voice and minimal amount of distractions! Keep it up!

  • @CodingWithGhostInCode
    @CodingWithGhostInCode 3 года назад +1

    I considered myself a newbie before i followed through the tutorial. Right now i feel like i need to be hired by meta. lol. This is great stuff.

  •  4 года назад +1

    I hope you're good Marcus :D I jump here from time to time to refresh my Flutter knowledge and this is the best channel ever. Wish you happy holidays

  • @KekeAmigable
    @KekeAmigable 4 года назад +2

    You know ...
    I was making an application like Facebook, but I saw how difficult it was and I left it, but this video has motivated me, inspired me to do it again, I'm very excited 😄

  • @newart47
    @newart47 4 года назад +11

    Great content as always. Thank you very much Marcus.

  • @Explore_Montreal
    @Explore_Montreal 4 года назад +2

    One of the best tut I've seen for learning flutter by building a beautiful example APP UI/UX . Keep up the great work 👍 Thank You

  • @danielrocha5774
    @danielrocha5774 4 года назад +3

    I really appreciate you taking the time to shared this with us

  • @karangadani5424
    @karangadani5424 3 года назад +1

    The Best Flutter UI video ever!!

  • @kombokenedy4750
    @kombokenedy4750 4 года назад +4

    You are just a beast, good work master

  • @Murtaza-Shiraz
    @Murtaza-Shiraz 3 года назад +1

    This tutorial really helped me to understand "Responive UI Design". I want to thank you for it. Also, the widget tree diagram by Mirarie Yang and Allen Su is commendable. Great job!

  • @codecounts7122
    @codecounts7122 4 года назад +2

    Awesome video Marcus. Beautifully explained.

  • @shamscorner
    @shamscorner 3 года назад +1

    I think RUclips puts some random dislikes in the dislikes button. Otherwise it will feel like, that dislike button is broken. How on earth there are some dislikes in this video. Makes no sense.
    Love your videos man. I pray for your success. Thanks 😊 🙏

  • @chuggingCoffee_
    @chuggingCoffee_ 4 года назад +6

    Trick for anyone using the VSCode Flutter extension. It gives you a shortcut key combo to do a few common tasks. When you get error messages under items like 'User' or when you create a stateless/stateful widget and have a million red lines under your code, it's because it's looking for material.dart, your data file or something else. With the Flutter extension, you can press CMD + . on mac to get a popup list of actions to take while your cursor is on an item with the red line under it.
    You can do this same shortcut key combo when you want to wrap widgets in a container/row/etc. Not sure what the key combo is on Windows, but I'm assuming it's Ctrl + . or Alt + . ? You'll have to look that up.
    Anyway..just know that a shortcut exists to do some common imports and wraps, and look up details on the extension to figure it all out. Just wanted you all to know it's there.

  • @nicoap4315
    @nicoap4315 4 года назад +44

    MasyaAllah, I love this tutorial...
    Good content, good teaching style , good audio, not too fast or too slow speaking speed.
    This is free tutorial but with premuim quality content.
    I hope i can see you tutorial on udemy because i dont have cc for subcribing on your website.
    Btw, about flutter web, is it good for seo? Is it recomended for website like news blog or ecommerce web that heavily depend on seo/ssr?

  • @kerimamanov7760
    @kerimamanov7760 4 года назад +1

    Great as always, Marc!

  • @kimbowaaloysius9034
    @kimbowaaloysius9034 4 года назад

    You make me fall in love with Flutter over and over again! Wonderful content Marcus, Wonderful!

  • @arthursiloka7437
    @arthursiloka7437 4 года назад

    This is fantastic. Nothing like this on RUclips. You have a new subscriber. Thanks

  • @عبدالقادرعبدالرحمنعبدالله

    Absolutely very helpful content.
    Thank you so much.
    I really love the way you explain things while cloning.
    Thanks again.

  • @mojahedmohammed
    @mojahedmohammed 2 года назад

    you have smart coding style, thanks for your effort, I hope more flourish your channel
    😍

  • @ChristianAlmeidabr
    @ChristianAlmeidabr 4 года назад +2

    Thanks man!!! This is gold!! Better of all you use to color things (like containers and stuff) just to let us know what "part" you are working on! Great!!

  • @akshanshkmr
    @akshanshkmr 4 года назад +2

    You made it seem effortless, definitely subscribing 👍

  • @harshgohel9626
    @harshgohel9626 4 года назад

    Good job bro. I like the way your delivery of content, i really appriciated. Keep uploading this kind of videos.

  • @eternalincantation
    @eternalincantation 3 года назад +2

    I love how you explain things and love the tutorials, can you make some on an entire app - fron and back end, not just UI? thanks a lot!!! Love the content you make!

  • @megaman236
    @megaman236 4 года назад +1

    man!
    u are the best ♥

  • @swedexa
    @swedexa 4 года назад

    Yeah man lovely content! Much love from Sweden!

  • @abdullahmoiz8151
    @abdullahmoiz8151 4 года назад +2

    Great tutorial, i really wanted to know how to make an app responsive and this cleared things up

  • @boravivek
    @boravivek 4 года назад

    I knew that flutter is something, but after seeing your video it appears that it's really amazing, i will surely consider giving it a try

  • @mihaidimoiu
    @mihaidimoiu 4 года назад +1

    Great tutorial. One tip on your website. In home page when you click on menu button is under the main component. I think you should bring it to the front when button is pressed. Accesed from chrome on galaxy note phone

  • @eQ-13
    @eQ-13 4 года назад

    You are amazing Marcus. Learn so many concepts from your tutorials. Thank you.

  • @ayushpratap4726
    @ayushpratap4726 3 года назад

    Amazing! Superb! Excellent!

  • @rexrex8664
    @rexrex8664 4 года назад

    Thank you for this tutorial. You explained it well and gave us ideas to make the code maintainable. Subscribed and like your video. Keep it this way dude!

  • @parzuko
    @parzuko 4 года назад

    Man, this is such a great and informative video, love it!

  • @julianrodriguezpetz3642
    @julianrodriguezpetz3642 4 года назад

    You are exactly what I have been looking for, thanks! Saludos desde Argentina!

  • @mohamedruslicali5926
    @mohamedruslicali5926 4 года назад

    Super clear and slow tutorial. Love it!

  • @mdsujonahmed9441
    @mdsujonahmed9441 2 года назад

    Thank you so much 💕.
    I am learning.
    Your videos are best to learn knowledge.

  • @streamerx007
    @streamerx007 4 года назад +2

    Great Video !
    Learned a lot of new things

  • @learning1online156
    @learning1online156 3 года назад

    Learned a lot about UI. Thank You very much

  • @vireakpanha7546
    @vireakpanha7546 4 года назад

    one of the best flutter tutorial. nice job!!!

  • @ostechanbi5455
    @ostechanbi5455 3 года назад

    Amazing tutorial... Keep up the good work !!! You are life saviour

  • @zuiazfar7483
    @zuiazfar7483 4 года назад +3

    like a McDonalds, I'm lovin' it

  • @dhevendhiranm4138
    @dhevendhiranm4138 3 года назад

    Excellent. I love the way you organize things very clear with live coding. Thank u so much for the video.

  • @Hangoutapp
    @Hangoutapp 3 года назад +1

    Really love your videos

  • @nepoleansingh5166
    @nepoleansingh5166 3 года назад

    After watching the video I'm gonna start with flutter. I was confused whether to choose react or flutter as i have good c#, REST, and JavaScript experience. This makes me clear what to choose.. Thanks for the wonderful video..

  • @anweral_sanabani725
    @anweral_sanabani725 2 года назад

    I Like ur Channel So Much dude... Keep going 😎😎

  • @Gagandeep2805
    @Gagandeep2805 3 года назад +1

    Great Video!

  • @aravindc6946
    @aravindc6946 4 года назад

    It was an awesome tutorial, really loved it! learned a lot! Thank you so much for this great content🤩 Keep rocking!!!❤

  • @korndev6862
    @korndev6862 3 года назад +1

    Thank you very much for this Tutorial, that very useful for people that learning the Flutter.

  • @dorian4875
    @dorian4875 4 года назад +2

    Dude, thk u for u work! Amazing tutorials and content :)

  • @matthewmbazima
    @matthewmbazima 3 года назад +1

    This is totally unbelievable!!! Your tutorial is so easy to follow along!! Would you happen to have a full tutorial on a facebook clone available on your cources..... Please

  • @sithumdasantha3147
    @sithumdasantha3147 4 года назад

    Very Useful! Keep it up!

  • @grsdjjggfss3373
    @grsdjjggfss3373 2 года назад

    You have got a new follower. ❤️

  • @sknazmulislam9158
    @sknazmulislam9158 3 года назад

    Best tutorial ever man.. thanks for your hard work

  • @akjelane8781
    @akjelane8781 4 года назад +2

    wow , thats a super cool video

  • @caiofelix623
    @caiofelix623 4 года назад

    Thank you so much, you are a incredible developer who really know who to teachs

  • @BitproGlobal
    @BitproGlobal Месяц назад

    Great video bro ❤

  • @sachinkalkur
    @sachinkalkur 4 года назад

    Learnt a lot than speed code videos. Thanks bro.

  • @devolution3333
    @devolution3333 4 года назад

    Thanks for the great content, This is what I looking for. I need something to guide me to learn flutter, many things in your content make me understand flutter. Thank you again for this workshop.

  • @gaetanberbin3207
    @gaetanberbin3207 3 года назад

    Thanks a lot...things goes well now. I have learned so much...keep going!!

  • @hamp2423
    @hamp2423 4 года назад

    Thank you Marcus it is really helpful to learn flutter layout structure and responsive app

  • @tsioryfitiavanaanhykrishna6992
    @tsioryfitiavanaanhykrishna6992 4 года назад

    You area the best! Thanks for your tutorials!

  • @saitejd8108
    @saitejd8108 4 года назад

    One more awesome ui design

  • @eadoard
    @eadoard 4 года назад +1

    Just an amazing tutorial and explanation ..... thank you so much

  • @sharanbabu2001
    @sharanbabu2001 4 года назад

    This is awesome. More content like this plz...

  • @fadwi5817
    @fadwi5817 4 года назад

    thanks for the bonus video & great course

  • @wevertonsantiago4305
    @wevertonsantiago4305 3 года назад

    New Subs Here! Thanks for your videos!

  • @kopianan
    @kopianan 4 года назад

    u r crazy boy.
    how cool it is.
    i will pay for it. but hey thanks for share this on youtube.

  • @mohammaedazzam314
    @mohammaedazzam314 2 года назад

    Thanks you so much Marcus Ng❤🌹

  • @mrcolo.
    @mrcolo. 4 года назад +8

    Woooow amazing! where did you learn to do all these apps and websites?

  • @choirulaffan5730
    @choirulaffan5730 4 года назад

    Great....!
    I was subscribed bro!

  • @ishangoswami9462
    @ishangoswami9462 4 года назад

    Genuinely thank you so much for this

  • @gabrielowusu1927
    @gabrielowusu1927 4 года назад

    Love it❤. Just finished watching. Learn alot thanks

  • @narendrachouhan1746
    @narendrachouhan1746 3 года назад

    very nice video, i think people needs this kind of videos..

  • @luciapineda2093
    @luciapineda2093 3 года назад

    Thank you! You explain things very well.

  • @orgiel1203
    @orgiel1203 3 года назад

    Excellent course! Thanks

  • @sakibshaikh3447
    @sakibshaikh3447 2 года назад

    Thank you for this gem🤗

  • @deblasiocorporationd.b.c.7603
    @deblasiocorporationd.b.c.7603 4 года назад

    Great work man!

  • @jaymitpatel6148
    @jaymitpatel6148 4 года назад

    Loved it ❤️very informative

  • @kenmaths8758
    @kenmaths8758 8 месяцев назад

    Thanks, great flutter video

  • @techyakshay6868
    @techyakshay6868 4 года назад +4

    I have copied from description for direct access :~)
    » Timestamps 🕒
    0:00:00 Introduction
    0:00:59 Download Starter Project
    0:01:28 Starter Project Code
    0:04:52 main.dart
    0:06:59 Sliver App Bar
    0:09:32 Circle Button
    0:13:57 Create Post Container
    0:22:19 Create Rooms
    0:29:22 Online Users
    0:34:36 Stories
    0:46:54 Post Feed
    0:55:47 Post Stats
    1:02:54 Custom Tab Bar
    1:11:12 Launch Web Version
    1:13:12 Responsive Widget
    1:16:24 Custom App Bar
    1:27:03 Home Screen Desktop
    1:30:59 Responsive Post Feed
    1:39:33 Contacts List
    1:44:44 More Options List
    1:50:33 Wrap Up

  • @footballfever134
    @footballfever134 4 года назад

    Wow.. Was looking for stuff like this... Thanks a lot😊😊

  • @hoekbrwr
    @hoekbrwr 4 года назад +1

    I watched video after video and in every one of them I see other widgets appear with fancy features. I am a bit overwhelmed by all these specials, but I must congratulate you on the fact I followed your building of the UI to the end without problems. Now I have to dig into the code a bit more(and see it another time when done with that). This is in fact only the UI and the data are fake! Is there another video where you grab the JSON for your data? This is however a great store of rather fancy UI techniques. I also will look into your Netflix tutorial for more techniques.

  • @samkumarg4704
    @samkumarg4704 4 года назад +1

    Very useful video, helped a lot

  • @gauravbagul4730
    @gauravbagul4730 4 года назад

    Thanks man, you explained it very well.

  • @juniorMr
    @juniorMr Год назад

    You have gained one more sub

  • @mindsetnuggets
    @mindsetnuggets 4 года назад

    Excellently delivered tutorial

  • @BNakato
    @BNakato 4 года назад +1

    Awesome content!!

  • @sanamtamang1208
    @sanamtamang1208 4 года назад

    New subscriber.
    Love it

  • @_aguskhaer
    @_aguskhaer 3 года назад

    i like the way you organize those files, i'm currently realized that all classes which want to be exported in another class, should include the export command

  • @malcolmmarkokabo8027
    @malcolmmarkokabo8027 4 года назад

    People please support and subscribe to Marcus Ng don't only enjoy the videos coz it ain't easy to make them and those hitting the dislike its so pathetic I don't see no reason not to like

  • @eskindergetachew4949
    @eskindergetachew4949 4 года назад +1

    Wow ...amazing tutorial

  • @danielphil4976
    @danielphil4976 3 года назад

    This is the best. Thank you.

  • @cursorop1716
    @cursorop1716 4 года назад +1

    Simply Great❤️❤️❤️