Flutter for the JS Developer

  Рет қаралды 395,866

Fireship

5 жыл бұрын

Flutter/Dart basics for the JavaScript web developer. Learn the similarities and differences between Dart and JS side-by-side. Compare Flutter Widgets to React Native components. fireship.io/lessons/flutter-for-js-developers/
- Flutter flutter.io
- React Native facebook.github.io/react-native/

Пікірлер: 344
@michaelwoodruff6634
@michaelwoodruff6634 5 жыл бұрын
"Let's fade out the music and get into the code" I see what you did there. You listening to us.
@Fireship
@Fireship 5 жыл бұрын
That's what I do! Incorporating feedback is very important to me.
5 жыл бұрын
I wish all languages had a comparison 1:1 tutorial versus the languages it's based on. I always procrastinate before learning a new language because it's a pain in the ass go through the basics stuff. Your video in the other hand, go right into the topic!
@THEMRfatefighter
@THEMRfatefighter 5 жыл бұрын
That's genuinly a great idea. I'll build a new channel and start with the basics: html vs C#
@themirac5614
@themirac5614 4 жыл бұрын
@@THEMRfatefighter have you done it yet?
@THEMRfatefighter
@THEMRfatefighter 4 жыл бұрын
@@themirac5614 dude, it was a joke. ^^ every language has it's application. Html is for web content, js for web scripting, python for apps (not efficient but quick to setup), c# for lengthy apps or games with classes and heritage, ect. The idea is great but it's like comparing wine and wiskey. Both are alcools but you just use them in different situations.
@aryanshmahato
@aryanshmahato 4 жыл бұрын
@@themirac5614 Man.. That was a joke😂😂
@psy667
@psy667 4 жыл бұрын
This can help you hyperpolyglot.org/
@MarcoAZeballosS
@MarcoAZeballosS 3 жыл бұрын
This is why I jump to your videos whenever I want to learn a new technology or language, your work is special man, thanks for your effort making things effortless to us.
@corynorell3686
@corynorell3686 5 жыл бұрын
I decided to build an app with Flutter a couple weeks ago, found your channel last week (which has been immense help) to brush up on my JavaScript for interviews, and then you release this. Quite astonishing timing I'd say.
@brhh
@brhh 3 жыл бұрын
atleast you found him
@bilalkureshi7437
@bilalkureshi7437 2 жыл бұрын
@@brhh yerp mates from other groups talking abt him so that's pretty much how I found him lol
@this.is.lapc506
@this.is.lapc506 5 жыл бұрын
I've been looking for a quick introduction like this for months! Thanks a lot dude!
@elephant_888
@elephant_888 4 жыл бұрын
Great video. Bridging learning with a side-by-side comparison with javascript was genius.
@code_report
@code_report 5 жыл бұрын
This video was awesome! Love the side by side Typescript vs Dart! Would love to see more!
@sayanmallick2644
@sayanmallick2644 5 жыл бұрын
Dart = java(only the good parts) + JavaScript (only the good parts)
@relentless5723
@relentless5723 5 жыл бұрын
Dart is actually quite similiar to C# and I don't mean that because C# is similiar to Java. Anonymouse methods and types, promisses, properties, async/await and so on are part of C# for years.
@HermanWillems
@HermanWillems 5 жыл бұрын
@@relentless5723 C# is not a scripting language. I always felt like Java and C# to be like in a realm that is not needed. Yes we need scripting languages for dynamic stuff, and yes we need system languages for fast static stuff. Both can be used together. Where C# and Java is more like trying to do those both but failing at each of them. Dart is nice for scripting, while rust is nice for system level.
@bernadotornado7068
@bernadotornado7068 5 жыл бұрын
@@relentless5723 I have to agree on that. I learned programming from making games in Unity and was avoiding the JavaScript version of Unity because C# syntax was just more appealing for me. Ever since I started web-development i have always used TypeScript because it is basically C#script to C# as JavaScript is to Java. Dart is even more like C# which is why I only use Unity for making games and not for app design anymore.
@JK92007
@JK92007 4 жыл бұрын
Should I learn js or Dart..? Any one plz...I m new bees for programming..
@pankajmanali
@pankajmanali 4 жыл бұрын
@@JK92007 Depends if you are going for web development or mobile development. For web its definitely JS plus you can write mobile apps as well using react-native, ionic etc. Flutter on other hand is mostly suited for mobile applications and it gives better performance over mobile apps written in JS.
@carniattos
@carniattos 5 жыл бұрын
Great video, I was waiting for it since your last video, I'm intrigued with flutter and this video gave me the bare minimum to kickstart a flutter app
@MikeCatrone
@MikeCatrone 4 жыл бұрын
I've been dabbling with Js and React Native for the past year, but just recently I decided to learn some Flutter/Dart and it's been a much easier experience so far
@hos7012
@hos7012 2 жыл бұрын
same
@darshangowda309
@darshangowda309 5 жыл бұрын
JS is my wife, but flutter is my mistress! Awesome😂😂😂
@Fireship
@Fireship 5 жыл бұрын
Love that quote 😂
@LukePighetti
@LukePighetti 5 жыл бұрын
😂
@djpete2009
@djpete2009 4 жыл бұрын
Lol!! I like it. Let's talk Darshan. Flutter app.
@JK92007
@JK92007 4 жыл бұрын
😀
@indahpratiwi4308
@indahpratiwi4308 4 жыл бұрын
Shutup harami
@florentarlandis1209
@florentarlandis1209 4 жыл бұрын
Await for loop?! This looks awesome!
@JannisAdmek
@JannisAdmek 5 жыл бұрын
I don't know js but am coming from C++/Java/Python, now working with flutter.. THANK YOU fine sir for that wonderful overview!
@CarlosBruno82
@CarlosBruno82 4 жыл бұрын
Thank you. That was what I was looking for. It will help me a lot in my migration from JavaScript to Dart. Sorry for my English. I used google translator.
@JonathanCGroberg
@JonathanCGroberg 5 жыл бұрын
Looks like a merger between a lot of good qualities from many languages. Its getting to the point where all languages are evolving toward the same end goal.
@_Amilio_
@_Amilio_ 3 жыл бұрын
Started with Flutter and now learning ReactJS and I can see a lot of similarities and where Flutter got it's inspiration from. React a lot easier to learn now.
@firaskudsy
@firaskudsy 5 жыл бұрын
Only with ur videos.. i give like before start watching.. lol .. fully trust the content
@firaskudsy
@firaskudsy 5 жыл бұрын
Jeff .. can u do a separate tutorial for state vs stateless in flutter .. and how to structure the files .. components .. services .. 🙏
@Fireship
@Fireship 5 жыл бұрын
@@firaskudsy Thank you! Yes, I have a long list of topics. State management is a full video that will come soon, but project organization would be good also.
@firaskudsy
@firaskudsy 5 жыл бұрын
@@Fireship one more question.. why we cant see the old tutorial and videos on fireship.. i mean the one on angularfire ..and would my subscription valid on fireship too ?
@Fireship
@Fireship 5 жыл бұрын
@@firaskudsy yes, the angular firebase membership will work on both :)
@CodingCatDev
@CodingCatDev 5 жыл бұрын
Super helpful comparison! Every time I create a demo Flutter app I resist going any further because it reminds me of Java in college and I don't want to go back there 😺.
@Fireship
@Fireship 5 жыл бұрын
I've never worked with Java, but it feels like a sibling to TS, or kinda like JS & C# had a baby.
5 жыл бұрын
But Java is nice af!
@devilmanscott
@devilmanscott 5 жыл бұрын
@ Nope. Kotlin, Scala and Clojure are nice, Java is a bloated mess, forced only to be OOP.
@chop098
@chop098 3 жыл бұрын
@@devilmanscott there isn't a suitable alternative for java for large-scale infrastructure
@ghevisartor6005
@ghevisartor6005 3 жыл бұрын
@@chop098 c#?
@SprHero
@SprHero 5 жыл бұрын
Looks really cool! Thanks for the comparison 👌
@mustofa_id
@mustofa_id 5 жыл бұрын
Dart like Modern Java mix with JavaScript. Thanks for awesome video!
@boradmay
@boradmay 5 жыл бұрын
The animations in video are so well made.
@Fireship
@Fireship 5 жыл бұрын
Thank you, I'm not an animator, just learned a few tricks after making so many videos.
@secondry2
@secondry2 4 жыл бұрын
@@Fireship mind sharing? it's so cool!
5 жыл бұрын
Flutter/Dart is a great career path to JavaScript programmer to go cross platform and fully native. Your side by side rapid fire comparison worked really well! 😍 👁💧👁. 👣
@Fireship
@Fireship 5 жыл бұрын
Thank you! Excellent emoji usage 🍻
@lovesimpleton8177
@lovesimpleton8177 5 жыл бұрын
is flutter/dart considered native?
@not2day646
@not2day646 5 жыл бұрын
@@lovesimpleton8177 eh, its close enough. Not fully though
@VeryBlueBot
@VeryBlueBot 5 жыл бұрын
Thanks! Very helpful starting point, would defiantly dig int to Flutter more
@fredmaiaarantes
@fredmaiaarantes 5 жыл бұрын
Your content is always great! Congrats and please keep doing this. 👏
@juangamarra1463
@juangamarra1463 5 жыл бұрын
Genial. Excelente trabajo. Gracias. Esperamos mas noticias de Flutter.
@Benony91
@Benony91 4 жыл бұрын
Last element in an array (even strings) in JavaScript: *element.slice(-1)*
@keokawasaki7833
@keokawasaki7833 4 жыл бұрын
I dont think anything would beat element.last in smoothness
@Benony91
@Benony91 4 жыл бұрын
@@keokawasaki7833 Not sure what you mean.. there is no last function for String or Array.
@keokawasaki7833
@keokawasaki7833 4 жыл бұрын
@@Benony91 that's exactly the point. javascript doesn't not have Array.prototype.last or anything like that. So we will have to rely on ugly or (mildly ugly like yours) solutions...
@Benony91
@Benony91 4 жыл бұрын
@@keokawasaki7833 haha yep! 😂 It's strange that something so trivial is missing..
@ThePandaGuitar
@ThePandaGuitar 4 жыл бұрын
Typical JS programmer response. Look again how shitty that code statement looks. Nothing beats element.last
@shaiker
@shaiker 4 жыл бұрын
12:38 nice stackoverflow right there
@Kay8B
@Kay8B 2 жыл бұрын
Coming from C# as my mother language in coding. This look eerily similar. Gonna give this a go and finally build that app my wife keeps asking me for!
@OproDarius
@OproDarius 4 жыл бұрын
Man...This guy knows a lot!
@JimmyS2
@JimmyS2 5 жыл бұрын
Excellent introduction, thank you
@alexschlake9701
@alexschlake9701 5 жыл бұрын
Mmmmm the C like syntax reminds me of my wild college days.
@JannisAdmek
@JannisAdmek 5 жыл бұрын
Alex Schlake wild malloc times? ;)
@luiaslan
@luiaslan 4 жыл бұрын
C is life.
@keokawasaki7833
@keokawasaki7833 4 жыл бұрын
I am going through them... still need to learn how yo use gdb
@manueldiera6781
@manueldiera6781 5 жыл бұрын
Some of the best material on youtube. Hands down. I will be buying one of those Flutter shirts too btw. P.S, everyone reading this comment should go checkout his video on Flare animations and integrating them to your Flutter app.
@dhanyakumar8965
@dhanyakumar8965 Жыл бұрын
Super thanks for sharing I hesitate to learn flutter dart program as a js developer but after watching you're video hesitation gone
@bedruomer8777
@bedruomer8777 2 жыл бұрын
array.at(-1) can also be used to get the last element in an array in JS
@sveinsoermo9883
@sveinsoermo9883 5 жыл бұрын
TWO WORDS ...VERY IMPRESSED!
@mattiaesposito5525
@mattiaesposito5525 5 жыл бұрын
very nice tutorial thank you i think i'm gonna learn dart and flutter
@johnmukendi7650
@johnmukendi7650 Жыл бұрын
I was given soft soft as a gift in 11, and up until recently, I was so overwheld by the complexity of it that I never got past just using
@tomvanlieshout524
@tomvanlieshout524 5 жыл бұрын
Great video. Just wish you'd have used a de-esser plugin on your voice recording.
@nabin9363
@nabin9363 3 жыл бұрын
Now every js developer must learn in2021 , I love js , But i like flutter too . 😍😍😍😍
@AbhishekKumar-mq1tt
@AbhishekKumar-mq1tt 5 жыл бұрын
Thank u for this awesome video
@avi12
@avi12 5 жыл бұрын
When I started to learn Dart, I immediately understood why Google wanted so badly to standardize this language for the web Such a good language that seems to me like a combination of Java and JavaScript, in a very good way I personally favor JetBrains software over Visual Studio Code, so I also benefit from quick-fix, which saves so much time In short, I can't decide what I love more - Dart or JavaScript
@Fireship
@Fireship 5 жыл бұрын
Dart might not be exciting, but it's a very productive language. Almost everything just autocompletes with inline docs.
@sourishdutta9600
@sourishdutta9600 5 жыл бұрын
Stream of knowledge!!! Offfff !!! Cool Man. Thanks
@emersontavera9362
@emersontavera9362 Жыл бұрын
It resembles more like Java to be honest, great video
@dami-i
@dami-i Жыл бұрын
In JS, you can get the last element of array with ".at(-1)".
@alexpiano
@alexpiano 2 жыл бұрын
Always nice and instructive videos. If I may, music is a bit too loud in my opinion, tough to focus on what you're explaining.. until you stop the music of course.
@sortof3337
@sortof3337 4 жыл бұрын
I know I am late, but I have been doing Java my whole life and flutter seems like something I've been asking for but too afraid to check out. :P
@brhh
@brhh 3 жыл бұрын
than don't wait, java is dying
@dmitryrudenko4998
@dmitryrudenko4998 4 жыл бұрын
Flutter is gem!
@MatthewChenIsAwesome
@MatthewChenIsAwesome 5 жыл бұрын
Do you think it is quicker to write react.js and react native and reuse some code between them or write vue (im more comfortable with vue than react) on web and flutter on mobile? Having a really difficult time deciding rn :/
@mehmetkose1753
@mehmetkose1753 5 жыл бұрын
top notch quality!
@AkshatKanchan
@AkshatKanchan 5 жыл бұрын
Please more of this!
@bas_kar_na_yar
@bas_kar_na_yar 4 жыл бұрын
I love flutter because when I ask it to align content center, it does align content center..
@Yivan4
@Yivan4 2 жыл бұрын
Unlike centering a div
@FernandoLucaDeTenaSmith
@FernandoLucaDeTenaSmith 5 жыл бұрын
You are awesome men!!
@ameenu
@ameenu 5 жыл бұрын
Thank you very much ,,,,,,,,,,,,,,,,, you make my day :)
@shafi2344
@shafi2344 5 жыл бұрын
Plz make Nativescript tutorials as well. It is the best for solution for an angular developer for truely native app.
@Outthebots
@Outthebots 5 жыл бұрын
how about nativescript :)
@flutterfromzero3075
@flutterfromzero3075 2 жыл бұрын
Great video! 👍👍🔥
@yolamontalvan9502
@yolamontalvan9502 3 жыл бұрын
Wow, this is what I call Learning at Warp Speed.
@GeraldScholz
@GeraldScholz 5 жыл бұрын
I thought Dart would be more complicated and therefore I didn't touched it. But this looks pretty easy to get into.
@bibibobs
@bibibobs 5 жыл бұрын
3:30 or press F5 and it will hot reload on save
@Vietnamcamping89
@Vietnamcamping89 4 жыл бұрын
pure javascript, react and angular-typescript, that's all for me :)
@MechyBang
@MechyBang 5 жыл бұрын
You, sir, are the shit! 🙌🏼🔥
@mitchross2852
@mitchross2852 3 жыл бұрын
Great video
@bruh8731
@bruh8731 3 жыл бұрын
High quantity content 💯
@vianddirect5196
@vianddirect5196 3 жыл бұрын
very nice video introduction....keep it up #team
@Todiros
@Todiros 5 жыл бұрын
I have a pretty ambitious application that I'm trying to build. It would be targeted for mobile users but as a single web developer, I would build a web app first using React on the Front End (not yet sure on the Back End). I thought of using React Native for mobile apps but then I heard it won't be optimal performance wise and that debugging in production would be a nightmare so I'm thinking that maybe I should use Flutter. I do like Dart and coming from C++ and C# it seems it won't be too difficult to get used to it. Still not quite sure.
@mohammadrasoulfard-habibi3066
@mohammadrasoulfard-habibi3066 5 жыл бұрын
Give it a try buddy. Would love to know how you get on with it. Good luck 🤞
@amirhosseinrafiee2926
@amirhosseinrafiee2926 5 жыл бұрын
Flutter have alot in common with qt quick (qml) which you think is better !?
@jnsp6081
@jnsp6081 2 жыл бұрын
You should make a discord server for your community :p Love your videos
@CodeMaster-w5g
@CodeMaster-w5g Жыл бұрын
Flutter is way better than js frameworks for multi platform applications , I wish I know this sooner
@mayorityz
@mayorityz 5 жыл бұрын
Wow. Deep stuff
@bripowered
@bripowered 5 жыл бұрын
Thank you!
@tntg5
@tntg5 3 жыл бұрын
To get the last element of an array called array you just go with [...array].pop() wich won't alter array
@javadziaebrahimi3568
@javadziaebrahimi3568 4 жыл бұрын
awesome thanks😍
@bundayyolayinka3352
@bundayyolayinka3352 5 жыл бұрын
Great Stuff
@DB-ho8cc
@DB-ho8cc 5 жыл бұрын
What editor or ide are you using that gives you that info when you hover over something?
@VikramSinghVikroatwork
@VikramSinghVikroatwork 5 жыл бұрын
OMG. So many languages. I have an experience in Java, C++ and C and now I have trouble deciding whether to go for Angular or react or Vue as a web developer for a job prospect
@THEMRfatefighter
@THEMRfatefighter 5 жыл бұрын
Js. Functional Js should never be underestimated
@philippklemmer3785
@philippklemmer3785 5 жыл бұрын
First improve you J's knowledge. If you would go with angular, you have to learn typescript, which is really nice. React also supports Typescript, but I don't know about Vue. The point is, search for available jobs near to you and learn it, if you just want to pay bills. I would recommend you to look in every framework and pick the one you like the most :)
@nishanthdipali6838
@nishanthdipali6838 2 жыл бұрын
Can we take functional approach in dart(flutter) as we can in react or flutter just restricts us???
@digitalalliance4283
@digitalalliance4283 5 жыл бұрын
look like we have too many choice to develop programming in 2019
@jjjjjjjjwwjwjw
@jjjjjjjjwwjwjw 5 жыл бұрын
Web -> JS, Hybrid -> Dart, Native -> Swift/Kotlin Doesn't seem too bad.
@ownagejuice1394
@ownagejuice1394 5 жыл бұрын
Ji Park and by Web we mean Vuejs or Svelte haha
@brandongonzales9687
@brandongonzales9687 5 жыл бұрын
@@jjjjjjjjwwjwjw You mean, web => JS, PHP, Python, Ruby, Java, Kotlin. Desktop => Electron, Rust, C, C++, Python, C#, Java, Kotlin. Mobile => Java, Kotlin, Ionic, Flutter, Nativescript, React Native.
@okie9025
@okie9025 4 жыл бұрын
@@jjjjjjjjwwjwjw Flutter isn't hybrid, it uses native components. React Native is hybrid
@mr_ks_gaming
@mr_ks_gaming 4 жыл бұрын
@@jjjjjjjjwwjwjw Flutter isn't hybrid , it's cross platform.
@MrDzprofessional
@MrDzprofessional 5 жыл бұрын
for the await for you can use map in js and await it with Promise.all(arrOfPropmises)
@mikeymop
@mikeymop 3 жыл бұрын
I _really_ like this video. As an RN developer this was very concise and informative. I was sad that at the end you left Stateful widgets listening to Streams with just a code snippet, instead of the perfect detail you included on all of the other concepts. I poked through your channel for all videos on flutter you have made hoping there was a good video dedicated to Streams and Stateful widgets but came up empty. Can you recommend one that you liked when you were learning them?
@Its_Pritam_
@Its_Pritam_ 4 жыл бұрын
Flutter with the android studio is much more convenient and powerful, so I avoid vscode. I am a native android developer and knew very little about javascript. So for me, it was easy to learn flutter than react, because dart is pretty similar to java.
@jouebien
@jouebien Жыл бұрын
my biggest issue with dart is that it hasn't go a native double type - any time you want to calculate money your stuck using a third party library which hasn't implemented comparators. My biggest issue with flutter is the bugs and the issue auto close robot which closes open bugs before they get fixed. I still have like 10+ bugs in flutter which are over a year old and are still broken.
@leivicyper3827
@leivicyper3827 4 жыл бұрын
what do you think about flutter after a year of programing? (excelent video!)
@itsdazing1279
@itsdazing1279 3 жыл бұрын
Question: Was that quizzes app build with flutter?
@viralvideos9227
@viralvideos9227 3 жыл бұрын
please make a video on performance between dart vs go vs java script
@mdriyazuddinkhan
@mdriyazuddinkhan 5 жыл бұрын
it's awesome.
@islamibrahim8121
@islamibrahim8121 3 жыл бұрын
lmao, I should like your videos more often
@martinalcala4823
@martinalcala4823 4 жыл бұрын
Does Dart have generators? If so, how different are those from JavaScript?
@MehmetKoseDev
@MehmetKoseDev 5 жыл бұрын
great explanation!
@vivekshingala1431
@vivekshingala1431 5 жыл бұрын
Which one should a beginner choose? React native or flutter?
@rodrake1
@rodrake1 5 жыл бұрын
I’ve never seen a developer talk so fast... do you speed up your videos? 😁
@Fireship
@Fireship 5 жыл бұрын
Did that whole video in one take :) JK, I cut out dead air from the audio track.
@pastuh
@pastuh 4 жыл бұрын
I just started deep dive javascript... I don't know if its worth to switch.. :X NodeJS also very popular
@kayan_dev
@kayan_dev 4 жыл бұрын
amazing
@humanontheinternet6510
@humanontheinternet6510 5 жыл бұрын
Google planed to use dart for angular 2 but they used typescript 😥😥 But now dart is back with 🔥🔥🔥🔥🔥
@not2day646
@not2day646 5 жыл бұрын
I can see why though. They didn't want to make that drastic of a change. Ts although different is much more similiar to js. I think they would have lost too many js devs if they went straight to dart
@MrHasanaki
@MrHasanaki 5 жыл бұрын
so many frameworks shoot like mushrooms out of the ground - it is so hard to keep up with everything - impossible
@saideepkonduri6429
@saideepkonduri6429 5 жыл бұрын
Awesome , life will be easier if dart is superset of js,ts
@tsortanidischristos412
@tsortanidischristos412 5 жыл бұрын
I think they chose Dart cuz it's one really close to JavaScript syntax and also compiles directly to native code
@Niccolatorres
@Niccolatorres 5 жыл бұрын
Do you haver a similar vídeo about React Native?
@WorstDeveloper
@WorstDeveloper 4 жыл бұрын
What happened to your flutter app @Fireship? It appears to not have been updated for a long time now.
@anthillca3665
@anthillca3665 5 жыл бұрын
Dude, please create a Flutter/Firebase course on Udemy. Your vids are great, and Udemy is in need of a Firebase course that truly does it justice. Or just do a Firebase course by itself, that would be enough.
@sommie4935
@sommie4935 5 жыл бұрын
I think I'm in love
@roronoa_d_law1075
@roronoa_d_law1075 4 жыл бұрын
what's the difference between dynamic and var ?
What it feels like cleaning up after a toddler.
00:40
Daniel LaBelle
Рет қаралды 83 МЛН
Женская драка в Кызылорде
00:53
AIRAN
Рет қаралды 494 М.
Mom's Unique Approach to Teaching Kids Hygiene #shorts
00:16
Fabiosa Stories
Рет қаралды 34 МЛН
Каха заблудился в горах
00:57
К-Media
Рет қаралды 9 МЛН
Look, this is the 97th generation of the phone?
0:13
Edcers
Рет қаралды 7 МЛН
Проверил, как вам?
0:58
Коннор
Рет қаралды 124 М.
Как удвоить напряжение? #электроника #умножитель
1:00
Hi Dev! – Электроника
Рет қаралды 1,1 МЛН
8 Товаров с Алиэкспресс, о которых ты мог и не знать!
49:47
РасПаковка ДваПаковка
Рет қаралды 167 М.
My iPhone 15 pro max 😱🫣😂
0:21
Nadir Show
Рет қаралды 599 М.