Flutter Layouts for the CSS Developer

SdĂ­let
VloĆŸit
  • čas pƙidĂĄn 28. 07. 2024
  • Learn how to align, position, and build layouts in Flutter with comparisons to CSS flexbox đŸ’Ș📩 - they have more in common than you might think fireship.io/lessons/flutter-w...
    - Get the T-Shirt, use promo FLTTR teespring.com/stores/fireship...
    - Flutter Layouts flutter.io/docs/development/u...
    - Flexbox developer.mozilla.org/en-US/d...
  • Věda a technologie

Komentáƙe • 140

  • @Alex-my1qz
    @Alex-my1qz Pƙed 5 lety +38

    Bro this channel is so underrated

  • @shubhsheth
    @shubhsheth Pƙed 5 lety +1

    Just loving the type of content you're coming up with. Appreciate your time and effort man ❀

  • @mawulijo
    @mawulijo Pƙed 5 lety

    I love flutter and it's weird I have never had this point of view of it. Nice to know I was just flex boxing all this while. It adds a mild touch to the whole experience. Thanks man

  • @thaanu
    @thaanu Pƙed 4 lety +1

    That was really helpful. Have been looking for tutorials and didn’t really get my head wrapped around this. Thanks a lot.

  • @alexanderviljoen6117
    @alexanderviljoen6117 Pƙed 5 lety

    You know what mate I’ve been struggling with flutters layouts and this has really helped me. Full on respect dude for a simple explanation! Thumbs up from me

  • @gleesog4
    @gleesog4 Pƙed 5 lety

    Fantastic video. I love the pace and succinctness of your communication. Generally, I find educational/training videos to be slow and laboursome, this gets right to the point.

  • @RagoDN2
    @RagoDN2 Pƙed 5 lety +4

    I'm really glad I discovered Flutter when I did. NativeScript is neat but Flutter has the advantage of everything being done in one language rather than three. Good video as always

  • @taki_fouhal
    @taki_fouhal Pƙed 2 lety

    this video is so needed for every web developer that wants to try flutter, thank you for your time and efforts

  • @thenavman7
    @thenavman7 Pƙed 21 dnem

    Great video man! I watched so many other tutorials on layouts but by far this is the best one.

  • @chregano
    @chregano Pƙed 5 lety +1

    Great video as always. Thanks so much! Loving the Flutter content.

  • @ellsonmds5310
    @ellsonmds5310 Pƙed 4 lety

    The most comprehensive flutter tutorial so far, thanks

  • @naga2054
    @naga2054 Pƙed 5 lety +2

    Awesome content as usual Jeff
    I like the pace of videos coming out this year

    • @Fireship
      @Fireship  Pƙed 5 lety +1

      Thank you. I think I'm settling into a good pace, the workflow for Fireship.io has made me more productive.

  •  Pƙed 5 lety

    I have been waiting for you to do flutter videos, thanks!
    A full Instagram project with firebase would be awesome - also with some tests maybe

  • @r4t40
    @r4t40 Pƙed 5 lety

    Another Nice video.. I'm starting Flutter just because of your work!!! Keep going dude

  • @MsPedroGomes
    @MsPedroGomes Pƙed 4 lety

    Channel is literally fire! Would love Tinder card style animations layout. There's already a couple of Flutter libraries that allow creating and handling Flutter animations pretty well, would be nice to check a few. Thanks for the amazing content.

  • @markg5986
    @markg5986 Pƙed 3 lety

    VERY clear explanation. Thanks!

  • @FunOfHeuristic
    @FunOfHeuristic Pƙed 5 lety

    Nicely explained with good examples
    Thanks 😀

  • @fideltorres8109
    @fideltorres8109 Pƙed 5 lety +8

    Video suggestion: From Angular to Flutter.
    This video would explain router | services | directives | components. Thanks for the great content

  • @carltongordon
    @carltongordon Pƙed 5 lety +35

    A full Instagram project with flutter please Jeff? that would definitely get us a foot in the door

    • @Fireship
      @Fireship  Pƙed 5 lety +11

      That would be cool, but insta has a lot of features that are more complex than they seem on the surface. Would be a good challenge tho.

    • @carltongordon
      @carltongordon Pƙed 5 lety +2

      @@Fireship can be a basic level one witout the messaging and the heavy security

    • @putinninovacuna8976
      @putinninovacuna8976 Pƙed 5 lety +2

      hahahahahahahaha this guy is crazy, dude, are u really asking him for Instagram app? u clearly have no idea how hard is build a simple app, imagine instagram, fireship has so many things to do he hasnt time for build Instagram just because u said, building app like Instagram would take more than 1 person and it could tooks months

    • @burakbirer
      @burakbirer Pƙed 4 lety

      @@Fireship well you're the only channel i know that can take that kind of challange :) Especially it would be great to see production grade cloud functions, real life security and firestore optimizations. A paid in-production style course would be ok too.

  • @chronyan
    @chronyan Pƙed 4 lety

    This really helped me. Thank you!

  • @gabrielgutierrez641
    @gabrielgutierrez641 Pƙed 5 lety

    Great content Jeff!! I would like to see some examples with crud operations with firestore. Thank you!

  • @sagnikpradhan3594
    @sagnikpradhan3594 Pƙed 5 lety

    That was a lovely video. More such videos!

  • @matiullahkarimi7416
    @matiullahkarimi7416 Pƙed 5 lety

    Thanks for the great videos, please make some videos about state management in the flutter.

  • @MrMatharu9
    @MrMatharu9 Pƙed 5 lety

    Thank you for a very clear and concise introduction to Layout. Flutter is fast and smooth, unlike React Native. Will you be covering Flutter state management patterns ??

  • @beratsulimani9823
    @beratsulimani9823 Pƙed 5 lety

    Owww I love this Tshirt... Perfect explanation.

  • @haifzhan
    @haifzhan Pƙed 5 lety

    Wow! Great as always!

  • @AlexanderPataridze
    @AlexanderPataridze Pƙed 5 lety

    Absolutely amazing. Thanks

  • @rakeshroy7986
    @rakeshroy7986 Pƙed 5 lety

    Nice tutorial, please add all flutter video in one playlist

  • @jorchay
    @jorchay Pƙed 5 lety

    Great as always

  • @grzegorzsokalski7328
    @grzegorzsokalski7328 Pƙed 5 lety

    Love that content

  • @thejavascriptshow3754
    @thejavascriptshow3754 Pƙed 5 lety +6

    Great content as always,

  • @nash9785
    @nash9785 Pƙed 5 lety

    Really enjoying these :-)

  • @ricardosmith2060
    @ricardosmith2060 Pƙed 8 měsĂ­ci

    lol this changed everything for me, I'm highly versed in CSS but did not understand flutter's layout at all. I watched this 10 min video and 1 hour later I am building an interface with little effort. At this rate i think i can get to an acceptable level of proficiency in a weeks time.

  • @harshitpant3067
    @harshitpant3067 Pƙed 5 lety

    Great stuff. GraphQL stuff would be awesome in the future

  • @micalevisk
    @micalevisk Pƙed 5 lety

    sick! video for flutter with firestore would be great

  • @avi12
    @avi12 Pƙed 5 lety

    One of the main advantages of using Flutter over the native code for both platforms, is that Flutter applications will feed natively run on the incoming Google Fuchsia

  • @rithinprakash5045
    @rithinprakash5045 Pƙed 5 lety

    Flutter is awesome. Can you a video on state management in flutter

  • @abhinandankhilari9729
    @abhinandankhilari9729 Pƙed 5 lety +8

    Which vs code theme it is? Looks cool. Can you share the vs code preferences?

    • @josemchen
      @josemchen Pƙed 4 lety +1

      looks like Atom One Dark Theme

  • @armanmirk
    @armanmirk Pƙed 5 lety

    Hey these videos are great. Could you please do one about writing tests for a Flutter app?

  • @Synkto01
    @Synkto01 Pƙed 5 lety

    It will be cool if you can explain how work with forms or observables like in angular

  • @narcodico
    @narcodico Pƙed 5 lety

    I'd like to see a video comparing Scoped Model and Flutter Redux with best practices.

  •  Pƙed 5 lety

    Great video!

  • @fiordnord
    @fiordnord Pƙed 5 lety

    Awesome video, can't wait for app screens recreation in flutter. Let's also talk PWA, perhaps make fireship.io a pwa?

  • @ojolowoboluwatife1716
    @ojolowoboluwatife1716 Pƙed 2 lety

    Best Channel ever

  • @ikezedev
    @ikezedev Pƙed 5 lety +1

    Flutter uses dart, a javascript like language and uses styling similar to CSS...... It's a good thing that it is made for web developer to easily use flutter without so much stress. Thanks Jeff for this...... BTW, I love duolingo and it's UI

    • @Fireship
      @Fireship  Pƙed 5 lety

      Thank you, yes Duolingo is awesome and their ui is pretty easy to clone in flutter

  • @dinuka_bandara
    @dinuka_bandara Pƙed 5 lety

    😍 need to know about flutter bloc pattern state management and custom animations like css animations transitions, thank you

  • @darshangowda309
    @darshangowda309 Pƙed 5 lety

    I'm here for the T-shirt 😋

  • @hyzulfadli8289
    @hyzulfadli8289 Pƙed 5 lety

    Awesome content

  • @Mendez_84
    @Mendez_84 Pƙed 5 lety

    I'd like to see how to share code between flutter and angular dart using the BLoC pattern

  • @andrewvillegas122
    @andrewvillegas122 Pƙed 3 lety

    Hi! I'm so glad I found your channel! QUick question--how can I place an entire column at the bottom? Long story short, I'm working on a true/false app, and I'd like my column containing my TRUE and FALSE buttons to be at the very bottom of the screen. How can I accomplish this? THank you sir!

  • @siddhantkumar7036
    @siddhantkumar7036 Pƙed 5 lety +1

    Http request with flutter/dart would be helpful!

  • @fm2010erro
    @fm2010erro Pƙed 5 lety +5

    Well it could be a Widget in Flutter that lists your videos with push notification on fire base :D

    • @Fireship
      @Fireship  Pƙed 5 lety +1

      Now that's a good idea 😁

    • @fm2010erro
      @fm2010erro Pƙed 5 lety

      @@Fireship Yes I thought it would be a good idea to :) By the way I love your work, In my daily job I work with Angular, and your videos are a true help in moments of need, I find you a inspiration for my work, so I'm a big fan of you... Keep the good work :D

  • @bibibobs
    @bibibobs Pƙed 5 lety

    I'd like to see shared state management next

  • @Just_JasonZA
    @Just_JasonZA Pƙed 4 lety

    could you please go in-depth with Division in flutter, as the only tutorials on this are just about manipulation a button with animation, I feel that division is a lot easier to work with as one does not have to jump back and forth between parent and child just to change colour or position. thanks

  • @firaskudsy
    @firaskudsy Pƙed 5 lety +2

    👍👍 am working on a side app with flutter and firestore. I would love to see a tutorial on data sharing.. best practice for flutter file structure.. and the most imporrant statful vs stateless and when to use them .. for angular and ionic developer am still seeing everything as a component.. i feel flutter need some changes in the way we think

    • @Fireship
      @Fireship  Pƙed 5 lety +3

      Yes, this is a great area. I have my own opinions that don't align perfectly with the rest of the Flutter community. I have a dead simple state management approach using rxdart that I may open source in the future :)

    • @dinuka_bandara
      @dinuka_bandara Pƙed 5 lety

      we can use bloc pattern and rxdart for data sharing and state management

  • @protrag
    @protrag Pƙed 5 lety

    Thank you a lot

  • @mycityofsky
    @mycityofsky Pƙed 2 lety

    You are awesome!

  • @SamuelCamargo1000
    @SamuelCamargo1000 Pƙed 5 lety

    Tks Jeff

  •  Pƙed 5 lety

    please tell us how to get data from youtube v3 api. no content out there for that!

  • @chandrashekard.7543
    @chandrashekard.7543 Pƙed 5 lety

    Could you do a video on React hooks

  • @Joshuaaa245
    @Joshuaaa245 Pƙed 5 lety

    How would you apply :nth-child?

  • @themindstorm9947
    @themindstorm9947 Pƙed 5 lety +2

    Thanks for this video! I also had a request for another: can you remake your AngularFirebase video on giving users usernames? Thanks!

  • @Shashank.Shinde
    @Shashank.Shinde Pƙed 5 lety

    Good video as always, I want tut on social media auth with Fultter

  • @adriandinca5682
    @adriandinca5682 Pƙed 5 lety

    What color theme are you using?

  • @MarcoMunk
    @MarcoMunk Pƙed 5 lety

    Thanks

  • @ajanieniola9172
    @ajanieniola9172 Pƙed 5 lety

    Nice one

  • @Gurpreetsingh-bl8gg
    @Gurpreetsingh-bl8gg Pƙed 5 lety +1

    It would be great if you can show how to set up flutter project into different OS also how to configure the emulators for the same

    • @Fireship
      @Fireship  Pƙed 5 lety +1

      WINNER! - send me a direct message with your mailing address and T-shirt size :)

    • @Gurpreetsingh-bl8gg
      @Gurpreetsingh-bl8gg Pƙed 5 lety

      @@Fireship Thanku........ :-). Done

  • @sajjadhassanpourkasebnia6745

    I would like to see something like ngKNob done by flutter :)

  • @alinawaz4034
    @alinawaz4034 Pƙed 5 lety

    is you are going to clone insta then you got a new subscriber!!

  • @balajkhan9894
    @balajkhan9894 Pƙed 5 lety

    More flutter please

  • @MightyMigi
    @MightyMigi Pƙed 5 lety

    can you talk about Data bases I want to see how to implement other kinds not like fire base and splLight

  • @RageBasterd
    @RageBasterd Pƙed 5 lety

    yay more flutter

  • @reek4136
    @reek4136 Pƙed 5 lety

    I would like to some basic Vue or Flutter videos

  • @juaooliveiralp
    @juaooliveiralp Pƙed 4 lety

    WOW VERY COOL

  • @nunofsilva
    @nunofsilva Pƙed 5 lety +1

    Great video. Please do one covering state management, specially BLoC :)

  • @anymeshsingh
    @anymeshsingh Pƙed 5 lety +1

    I would like to see the next video on firestore integration in flutter app😃

    • @Fireship
      @Fireship  Pƙed 5 lety +2

      That may happen! I was thinking about doing a basic crud layout with Firestore.

    • @anymeshsingh
      @anymeshsingh Pƙed 5 lety

      @@Fireship Thanx, It would really help in my college project.

  • @josephsteve08
    @josephsteve08 Pƙed 5 lety

    I would like to see video about BLoC pattern

    • @LukePighetti
      @LukePighetti Pƙed 5 lety

      That's still a touchy subject in the community.

  • @JFkingW
    @JFkingW Pƙed 5 lety +1

    Please do a video about in app purchases

    • @Fireship
      @Fireship  Pƙed 5 lety +1

      For sure. I am building an app now that includes inapp purchases, so will transfer that knowledge here :)

    • @JFkingW
      @JFkingW Pƙed 5 lety

      @@Fireship great, can't wait!

    • @JFkingW
      @JFkingW Pƙed 5 lety

      @@Fireship How is your app coming along? Can you give a little spoiler how you solved InApp purchases? 😁

  • @orlandogarcia4403
    @orlandogarcia4403 Pƙed 4 lety

    Background music?

  • @himesh_89
    @himesh_89 Pƙed 5 lety

    complete firebase course with angular and how to architect on firebase

  • @rathileshc
    @rathileshc Pƙed 5 lety +2

    Please do video for flutter with firestore

  • @panteliselef239
    @panteliselef239 Pƙed 5 lety

    Make a video about React Router

  • @hiteshchoudhary3412
    @hiteshchoudhary3412 Pƙed 5 lety

    Hi Jeff, which editor and font family is this????

  • @shabeer_m
    @shabeer_m Pƙed 5 lety

    Nice

  • @aladdin8494
    @aladdin8494 Pƙed 5 lety

    perfect

  • @JohnDoe-zc4mu
    @JohnDoe-zc4mu Pƙed 5 lety

    Awesomeuuuuu

  • @LikeAndFavBF3
    @LikeAndFavBF3 Pƙed 5 lety

    Hi, unrelated question, what happened to your 2019 technologies video ?

    • @Fireship
      @Fireship  Pƙed 5 lety

      Thank you for catching this, it's back up. Not sure what happened with that 😕

    • @LikeAndFavBF3
      @LikeAndFavBF3 Pƙed 5 lety

      @@Fireship just wanted to recall, back there you made a comparison that mongodb wouldnt repalace mysql, is that right?

    • @Fireship
      @Fireship  Pƙed 5 lety

      @@LikeAndFavBF3 Yes, I was quoting a sarcastic tweet that said mongo would replace postgres

  • @BogacGuven
    @BogacGuven Pƙed 5 lety

    Only resolution for this video is 360p ?

    • @Fireship
      @Fireship  Pƙed 5 lety +1

      CZcams does that when the video is first uploaded. It should have 4K option available in a few minutes.

  • @venir_dev
    @venir_dev Pƙed 2 lety

    This video should updated with a GridLayout equivalent in Flutter, which is not trivial

  • @RADIOSCATRACHASUTAN
    @RADIOSCATRACHASUTAN Pƙed 3 lety

    I am crap in front end man, cant get my head around with so many layouts..

  • @akashkasurde8979
    @akashkasurde8979 Pƙed 5 lety

    chatbot with dialogflow and flutter :)

  • @BNakato
    @BNakato Pƙed 5 lety

    What is BLoC?

    • @bibibobs
      @bibibobs Pƙed 5 lety

      Business logic components

  • @subbre2006
    @subbre2006 Pƙed 5 lety +1

    Flutter modelling and http services? :D

    • @Fireship
      @Fireship  Pƙed 5 lety

      Dart has a nice HTTP package that would make a good video 👍

  • @Ch1ll3dkro3te
    @Ch1ll3dkro3te Pƙed 3 lety

    Where are the cloned UIs? ;)

  • @carddamom188
    @carddamom188 Pƙed 3 měsĂ­ci

    This code has a serious lack of commas at the end... Do not auto format it without commas at the end!

  • @digitalalliance4283
    @digitalalliance4283 Pƙed 5 lety

    Flutter vs React Navie"?

    • @hiteshchoudhary3412
      @hiteshchoudhary3412 Pƙed 5 lety

      Flutter bro

    • @Fireship
      @Fireship  Pƙed 5 lety

      I touched on that a little bit here. They are similar in many ways, but I find flutter way more productive/intuitive czcams.com/video/7sJZi0grFR4/video.html

  • @qazyhn94
    @qazyhn94 Pƙed 5 lety +4

    Insta like

  • @vinceramcesoliveros6739
    @vinceramcesoliveros6739 Pƙed 5 lety

    I hope I can win this t-shirt

  • @gofudgeyourselves9024
    @gofudgeyourselves9024 Pƙed 5 lety

    How about CSS layouts for Flutter Developers???

    • @Fireship
      @Fireship  Pƙed 5 lety +1

      Haha, I think that audience segment is pretty small

    • @LukePighetti
      @LukePighetti Pƙed 5 lety

      Installation is the reverse of removal.

  • @ankushsarkar1746
    @ankushsarkar1746 Pƙed 4 lety

    This is hot