One Codebase For All Screens

A quick look at Flutter.
💬 Topics:
What is Flutter?
What is Dart?
Native vs Cross platform development;
Flutter basic app example;
Stateless vs Stateful Widgets;
🎖The Yes JS Course - www.yes-js.com/
🥇 Become a Member - / @awesome-coding
✉️ Join the Newsletter - newsletter.awe...

[@alinghinea]

Would be cool to see also the result of the implementation in this kind of videos 🚀 Thanks!

[@bijayaprasadkuikel5162]

Yes, without output the code only does not make any sense

[@chotai]

​@@bijayaprasadkuikel5162 This will be showing basic layout only. I can even imagine how it would look. Either it will be in row-column structure or only row of elements on the screen. Nothing much is expected. This was all about the logic behind and this is clear enough. You cannot say "code does not make any sense" because people like me were only interested in code. Output would be silly addition.

[@roiborromeo7921]

​@@chotainot everyone is you

[@kyuss789]

Few notes - Stateless widgets can have their props changed, a stateful widget above can pass in new props no issues - The underscore naming convention is better explained as only the file it’s defined in can use it. IMO. - you made a passing comment about not using a webview which is correct but it’s should be noted that it doesn’t render “native” elements. It renders everything to a canvas which is why flutter is great for making games. Because it’s basically a 2d game engine for making apps.

[@wlockuz4467]

If you think Flutter syntax is confusing just think of JSX components but with class constructors.

[@unknownguywholovespizza]

LMAO who's writing jsx components using classes in 2024?

[@wlockuz4467]

@@unknownguywholovespizza I think you completely missed my point. I am not talking about class components. I am comparing Flutter's composition with JSX's composition.

[@unknownguywholovespizza]

@@wlockuz4467 I apologize. May you elaborate more please?

[@carlosmspk]

@@unknownguywholovespizza he literally said "JSX components BUT with class constructors" implying that JSX components are typically not classes

[@crism8868]

Yes, you're returning UI widgets instead of returning JSX, apart from that the architecture is very React

[@siya.abc123]

Awesome man, personally I'm happy about the longer but not too long video formats! I'm also proud to have been subscribed since the early days. Here's to 100K 🎉

[@TechBuddy_]

okay that turned out better than i expected. Really cool

[@awesome-coding]

Thank you!

[@roninspect4357]

Flutter ftw!

[@AnthonyDev]

Flutter is amazing, welcome to the Flutter world. 😍

[@devyb-cc]

one thing i didn't like about flutter, it has a lot of boilerplate that makes code looks more verbose.

[@zotoavinaandriamanamihaga6661]

Flutter is great, but the fact that os rely on meta programming and codegen and the boilerplate oriented syntax is sometimes too much IMO

[@ShinSpiegel]

Never liked flutter for some reason.. but I liked the video.

[@user-eh5wo8re3d]

same for me with html, js, css. sometimes the vibe is just of. personally love working with flutter

[@ShinSpiegel]

@@user-eh5wo8re3d yeah, same with Java also, don't like it either... but flutter does have some special sauce that I really dislike and I don't know what to point why I don't like it...

[@awesome-coding]

@ShinSpiegel Thank you!

[@unknownguywholovespizza]

I got used to the simplicity of web. Flutter was a huge pain for me especially that I'm so used to web development. Many easy things in web were hard in flutter such as centering, styling....

[@azad01_]

the gradle is a pain in a**, i stick with pwa

[@namaefumei]

Omg yes I hate that shtty piece of tech

[@azad01_]

​@@namaefumei🫂

[@F38U]

oh i have to use gradle?? no ty

[@AnthonyBullard]

You don’t have to use gradle, unless you want to build an android app. And if build an android app, you will use gradle. -source: former Flutter team member 😊

[@mubin-ansari]

As a react native user, even before watching the video I need to mention it. It supports iOS, Android, Web, Mac and Windows. It's also used in Microsoft Windows (in some sections in start menu), and in couple of games as well.

[@iritesh]

I guess the only real bad thing is performance right?

[@infantfrontender6131]

@@iritesh, especially on the web. It's a canvas, so we have poor accessibility, bad performance, no SEO, no SSR, and a huge app size. If the web is your main priority, then it is better to choose JS

[@sadkebab]

@@iritesh the performance of React Native is worst in the sense that you don't get the same frame rates you can get with Flutter, but performance is not bad since you are still rendering native UIs and animations, executing JS only for logic. But soon we will have stuff like Static Hermes who will allow react native to be compiled as machine code, so eventually the performance gap should be filled since the overhead of a js runtime for business logic will disappear.

[@sourabhsingh4515]

@@sadkebab @iritesh bro ever herd about expo it supports 60 fps native animation speed and if you integrate react native reanimated you can get 120 fps animation what else do you need ? do you need 260 hz for scrolling through reels ?

[@sadkebab]

@@sourabhsingh4515 That is litteraly what I meant, Flutter allows you to reach higher frame rates but you don't really need them in app development for most cases. Why such an antagonistic attitude man? 🤣🤣

[@lcarv20]

Great Video. I also know that flutter uses webassembly for web, for faster renderings.

[@moritzschuessler]

And doesnt use any web standards and is bad with accessibility or basic browser stuff

[@awesome-coding]

Thank you!

[@lcarv20]

@@moritzschuessler don’t take me wrong, if you wanna build a traditional website you should stick with what’s out there already. But if you want to build more complex applications (like a video or image editor, a great example is rive), you have flutter which proves to be a great alternative.

[@tubbystubby]

I just love the fact that JS is there with arm and intel.

[@awesome-coding]

My only mistake is that the JS logo should have been displayed first, before arm and intel to outline JS's superiority on all fronts speed included.

[@z0nx]

I video about screens and UI without actually showing screens and UI. Haha, peak developer right here

[@awesome-coding]

Sorry - for design inquiries please reach a different department.

[@ForAeonz]

Tauri 2.0 supports Mobile too, on top of the cross platform desktop support in Tauri v1. Cant wait to use Tauri 2.0

[@aLfRemArShMeLlOw]

Tauri just wraps your web app in a webview, it's not comparable to Flutter.

[@wlockuz4467]

0:31 "...as well as JavaScript for fast performance on any device" hold up

[@drdejavu240]

Lol, I think he meant to say 'on any platform'

[@wlockuz4467]

​@@drdejavu240 I am more talking about JavaScript for performance lol

[@awesome-coding]

@drdejavu240 @wlockuz4467 yep.. on any platform 🤦‍♂️ my mistake :D

[@wlockuz4467]

@@awesome-coding I was just joking about JavaScript and fast performance haha

[@carlosmspk]

@@wlockuz4467 I think that was intended as a joke

[@QueeeeenZ]

How do you handle SEO with Flutter?

[@Space_Wanderer.]

Flutter is for the cases SEO is not a concern. If you want an app with SEO you should use html

[@wog4299]

That's the neat part ,you don't

[@fritzbender5916]

Good intro

[@awesome-coding]

Thank you! :D

[@riigel]

what do you think about dioxus?

[@saramshshrestha7641]

where is the output?

[@PetrosTotskas]

So what are the biggest downsides? It's not fast, is it?

[@skorp5677]

Performance is not a problem usually - unless you build something that requires a LOT of animations or such. It's not ideal for web development as it does not use standard web components, which hurts SEO and accessibility. If you want to build primarily for the web, use a JS framework. If you need any old app to run on any platform, give Flutter a try :) Also, Dart doesn't let you shoot yourself in the foot as easily as JS but it object oriented, so a tad harder to learn.

[@cbaesemanai]

Been there tried it, web apps are its weak point. Best off targeting native in either case.

[@justindouglas3659]

Do a react native vid impression.

[@awesome-coding]

Will do! Thanks for the suggestion!

[@ryoschinlot9153]

Did he say JS and fast performance in the same sentence...

[@chudchadanstud]

I tried to use flutter in the past but the code nesting turned me off. It's insanely difficult to read.

[@AnythingGodamnit]

It's code, so you can refactor it.

[@mojojojo6525]

Cool video but seeing the results would have been great

[@awesome-coding]

Thanks for the feedback! Will keep it in mind for future videos.

[@ryanlog]

biggest problem with Flutter is that Dart is ugly af I'd rather code in PHP

[@apexashwin]

lol when will script kiddies like you learn a real language and get a job

[@hellelo.5840]

The browser is the best rendering engine for print and screen period, sometimes its slow but its the best.

[@ulrich-tonmoy]

Game engine the best crossplatform tools

[@lamontevlogs]

this video felt incomplete lol

[@awesome-coding]

Sorry 😅

[@lamontevlogs]

@@awesome-coding to give you a real response, it felt like the video was just starting theb it ends

[@F38U]

code looks ugly tbf but im gonna give it a try

[@skorp5677]

Yes, definitely something one has to get used to. I really appreciate code folding, 2 space indentation and VSC breadcrumbs :D But it's actually pretty fun to write

[@F38U]

@@skorp5677 i mean, that circle constructor thing seems really unnecessary and looks ugly

[@crab-cake]

one of the main reasons i'm turned off by dart/flutter is that the entire language is built around this platform. i think it's great for android/ios developers that also want a landing page or something like that. i don't see much potential beyond that.

[@arpitvasani]

Didn't Google fired their flutter core team recently?

[@StingSting844]

Flutter will die a slow death. Its already showing signs

[@awesome-coding]

What would be the signs?

[@lolgreek123]

Already being abandoned by Google

[@awesome-coding]

Nice! The mandatory Google joke!

[@infantfrontender6131]

Two months ago Google laid off staff from Flutter, Dart, and Python teams. So...

[@blackflame_]

Lol I can't keep track of how many times I've heard this stupid argument

[@blackflame_]

​@@infantfrontender6131flutter team size hasn't changed that much

[@TechBuddy_]

Okay they did fire people but the flutter team is still super active and building a lot of cool features like wasm backend for dart and impeller. Google is using flutter for a lot of their internal stuff so it is not really in danger as the tech social media might lead you to believe

[@gaming_zen_99]

You are talking like flutter is brand new....lol

[@awesome-coding]

Where did you get this idea from?

[@iDizzasTeR]

Used Flutter, became a fanboy, started building a real app with alot of complexity, realized how messed up flutter is when you write anything beyond youtube tutorials, became a hater. Switched to react native and never looked back.

[@bean_TM]

Flutter isnt native. It renders to a canvas for all devices. React native is real native code for mobile devices. Its incredibly misleading to say flutter is native code

[@hellpunch9414]

You have some confused ideas; you render to canvas only if you are wrapping a web view, using canvas, as the name suggests.

[@abdelkd_]

Flutter is native, but everything is just drawn using skia. Meanwhile RN creates native elements (eg: buttons are real buttons in RN the same as ones in kotlin/java on the other hand flutter draws them using skia and doesn't use native components)

[@hellpunch9414]

@@abdelkd_ guys you two have no idea what you are talking about. Search for 'fabric react native'

[@idunno121]

Flutter is dying. Many devs from the core team were laid off recently.