10 JavaScript changes you missed in 2023
Vložit
- čas přidán 26. 11. 2023
- How has JavaScript and web development changed in 2023? Learn about the top 10 updates to Next.js, React, Angular, Vue, and Node.js.
#webdevelopment #programming #top10
💬 Chat with Me on Discord
/ discord
🔗 Resources
JS groupBy method developer.mozilla.org/en-US/d...
Next.js Criticism pilcrow.vercel.app/blog/nextj...
HTMX in 100 Seconds • htmx in 100 seconds
🔥 Get More Content - Upgrade to PRO
Upgrade at fireship.io/pro
Use code YT25 for 25% off PRO access
🎨 My Editor Settings
- Atom One Dark
- vscode-icons
- Fira Code Font
🔖 Topics Covered
- JavaScript framework of the year award
- New features in JS language
- HTML dialog element
- Next.js App Directory
- What is UnJS?
- Major changes to Angular 17
- Bun JavaScript Runtime vs Node.js - Věda a technologie
Wanna go deeper? Get 40% off my full JS course all week with code CYBERFIRE fireship.io/courses/js/
We are already pros, waiting for more courses, by the way, I can help you create a trpc course
ok :/
I would love to go deeper but i am not in the mood
i'm already balls deep. the question is - why anybody needs this course when ydkjs is free?
Gotta keep em guessing so we can keep our jobs updating said framework anually
I love when frameworks reinvent themselves on a yearly basis! New methods mean new ways to create code that is unreadable to anyone.
let's all keep the AIs training data out of date!
Hence why I have been using Angular for years. Breaking changes are minimal and most can be automatically applied by migrations the Angular team provides with every update. Also helps that it ships with almost everything you need to build a fully featured site so 3rd party dependencies are kept at a minimum.
They reinvent themselves until they become the same as what came before.
And more interestingly, most of them apply PHP methods 😊
Don’t worry, AI can read it 😉
JavaScript community has to learn a new framework with every major framework update
I'm not sure if you meant to write the rebuttal to your comment within your comment itself (impressive if you did), but you're right. These ARE major updates, and by definition break things in a big way.
I don't really see the point in releasing a major update if it doesn't cause a significant enough change for there for be major learnings for the developers 😅
@@TVIDS123 frameworks aren't supposed to be business gigs for whomever is weird enough to like learning new nonsensical paradigms every so often, that all are always striving further from the actual problems they were trying to solve
Vue hasn't changed at all in years. The composition API was released with Vue 3, but you can still use the options API which is basically the same thing that you used 6+ years ago.
We gotta keep the AI guessing
you mean evolve ,grow and learn from past mistakes ? yes very much
>Me, 2013: I think I'll use Vanilla JS until these frameworks stabilize
>Me, 2023: I think I'll stick with Vanilla JS until these frameworks stabilize
I think I'll just stick to php.
@@imdtap1448and use HTMX 🧠
>Me, 2013: I think I'll use Intercooler.js until these frameworks stabilize
>Me, 2023: I think I'll use "Htmx" (the new name of Intercooler.js) until these frameworks stabilize ... and continue not wasting my time :)
This is so me, thanks to HTMX, any dynamic thing is done with vanilla js
You only have yourself to blame
excited to see ECMAScript slowly re-implement lodash for the next 20 years!
What the fuck is that emoji
And PHP.
I love how his 10 changes list starts at index 0
As HTMX myself, I'm thrilled to get the Nobel prize of javascript
Congrats. Should I try and fit you into a Vue3 project?
@@LeeGee No joke, I actually proposed to start replacing Vue with HTMX in one of the old projects, cause all we are doing is trying to replace existing SSR HTML with Vue and JSON API, when there is almost no benefit to that in our case.
HTMX is just another jQuery alike library with less coding, sugar coated attributes and handler functions.
@@jondoe79 Not completely true. HTMX much simpler and convenient to use. Especially if you use it with Hyperscript.
@@jondoe79 So nothing like jquery
As a dinosaur who started back in '98 I have tons of respect for people who have to start learning all this stuff from scratch in this day and age. The sheer amount of information you have to consume and make your own is mind boggling.
and you also see the same things happening again and again and again and again and..
Did you ever heard of Indian CZcams tutorials?
I think it's easier to learn it freshly than using old stuff and overlooking changes for ages and then trying to integrate them to your dinosaur knowledge-base 😅
@@borstenpinsel getting stuck in old ways is a real threat for sure, it's important to keep up with change 👍😄
Thank you for acknowledging our pain. I remember when the realization of how much useless shit I know hit me.
I loved learning React a few years back and already then I couldn't understand half the existing projects out there (because they were made in an older, wildly different version) and when searching for something on Stack Exchange and even official docs mix deprecated old features and new supported features ☺
its a nightmare. same thing is happening with next.js 13. everything you learned is totally diff now.
People keep sleeping on Angular. Sure they redid the whole thing for version 2 but after that it's been the most stable, easy to understand Javascript framework out there but people want to be trendy 🤷. They've wasted so many productive hours learning new frameworks instead of accepting that Angular is just fine and no, the others aren't great either and are not worth the pain.
@@ShaferHart suuure, meanwhile lemme just create 4 files for every component and spam rxjs everywhere to cope with the lack of reactivity in components
@@ShaferHart I had an employer once who thought like this and I was like good for you but I'm not working with that shit.
@@ShaferHart I think there's reasons web developers choose React, not Angular. At least Angular is not that fine to them.
Javascript gets a new framework in literally every nano second
Yeah, but you can ignore them and just stick with React or Vue if you want to. Whichever you pick, you definitively want to use it together with Vite though.
No new framework is being talked about in this video...
@@fred.flintstone4099 You can't ignore it. Jobs will requires 100 different frameworks.
there is a js framework called "nano". i shit you not.
But there is a framework called reejs lol
Fireship always dropping knowledge combined with top-tier comedy
I wish people were more focused on stabilizing technologies before developing new abstractions to go over it.
With how insane web development has become, I'm glad I don't have to deal with it. Embedded may be difficult for a lot of people, but at least the toolchains have been the same for the past 30, 40 years
The tooling being older than Pangea is also precisely the reason why so many people find embedded difficult 😬
Sometimes I think I should try to become a “regular” developer to try to make more money. Then I see stuff like this and I’m like, “actually… C is fine.”
I actually am interested in embedded, assembly is my favorite subject rn, if you have anything from practice from that field I'd be glad if you shared it. Thanks
It's not insane, people just like to meme about it. It's gotten much saner since the days of people writing PHP pages in notepad full of SQL statements in the same file as their HTML.
You know, normally things NOT evolving is a bad thing, not something to be praised. The "insane" thing would be if web development HADN'T changed at all since 40 years ago.
Just want to say thank you. 5 years ago I started learning angular using your angular/firebase tutorials, now I am a team lead and head Angular dev and I owe a lot of that to how good your tutorials are and how captivating your videos are.
Vue has been my framework of choice for about four years. I've been using it at work, and although there were times when I considered other options, I now believe it's in the best shape it's ever been. It's currently one of the strongest, if not the best, choices available. It's amazing how it has steadily improved over time.
good shill bro but srsly tho it’s the best one for people like me who don’t want to end up in the React torture dungeons
Best decision I made. Never bothered about the mess going on in React
Can I collab using Vue? I've been looking for work and heard open source was a good way to start.
As strong as Vue 3 is, it is still shackled by all the Vue 2 libraries and articles out there.
Finding a library that turns out to be incompatible with Vue 3 bc it was made for Vue 2 is heartbreaking.
Agreed. I feel that I dodged a bullet by choosing Vue 5 years ago. Never had to torture myself with react!
While people develop ChatGPT and Dall-e, JS developers are still trying to sort an array
I've just asked ChatGPT to sort me like 20 numbers, and it could not do it correctly
@@trainee5471 skill issue
Lmao this thread 😂😂
Please do the new angular in comparison to the old one in a 90 seconds video if possible
It used to be red and white, but now it's purply with a gradient.
@@adamcetinkent😂 good one
Vue and Nuxt teams are killing it. They ripped out Vite, Vitest, Nitro and UnJS to make a better and wider dev community - even outside of Vue. This is all on top of making incredible strides with Vue / Nuxt 3 themselves. Now Evan is working on Rolldown to replace Rollup built with Rust. 🥳
Cool. I'm gonna go use HTMX now.
You just vomited a bunch of cosmetic buzzwords that haven't contributed any meaningful technological advancement that you couldn't do 15 years ago. Prime example of shiny toy syndrome.
I'm very happy to see vue getting popular. They've literally killed angular in market share (react not quite yet).
yeah, but i'm still can't find any work on Vue 🤷♂ to much xenophobia for chinese and free open products from murrica, and others countries just copied that behaviour, that's why everyone's uses ugly and slow _rect_ 🤢
@@chiboreacherect?
I'm loving these videos coming out this fast, thank you for all of your effort!
I always love it when Fireship makes videos on topics I will never ever care about (except HTMX because I do want to learn more about that). 🤣
Mere reading the example page on the official site is enough to learn everything
Only HTMX is worth your time and it's easy. Everything else a time suck because they're inevitably going to reinvent themselves just because.
Thanks @Fireship for amazing content and keeping us up to date!
Just sticking with Vue. Evan You is a powerhouse.
hes a communist
yes, same here.
He is the real GOAT.
Btw, I just released the Rust-based compiler for Vue (it's in alpha). It's already 6x-60x faster than the official one and I plan to make it stable next year.
@@phoenix-tt sick! Send the repo link when youre ready :)
soooo good to have you back. youtube isn't the same without you.
Great video as always!
Past 2 months were crazy and awesome as I'm transitioning from Hardware to Software Development. I started with JS, basic CSS, HTML now I want to make a MVP of one of my ideas, that involves mobile apps and I started looking at Flutter. Your channel is instrumental in my learning curve. Keep up the good work!
Vue didn't change much - great news! I'm pretty happy with the ecosystem now.
Great video, love your content! Keep up the amazing work 🙂
Wouldn't it be nice to have a react based frontend framework that was more focused on developer experience and stability rather than pumping out new features every year, an equivalent of laravel in react framework land would be fantastic 😩
Fantastic! That's exactly what I meant! Adding a new section for comparing LLMs and a guide on using LLMs would be excellent!
I didnt know some of these. Thanks and good vids!
As someone who works with Angular for a living, the recent updates (most of which have come in the last year, maybe 2) have made working with it so, so, so much nicer. It’s not a framework I’d choose personally (although I did choose it for work years ago, but there’s better now, and I prefer SolidJS myself) but many of the recent changes have made it almost fun to use it, so I’m very happy they’ve been expanding and improving.
Things like standalone components and host directives make composing stuff really clean, and even though them introducing signals is kinda a meme, it genuinely does make working with changing values much cleaner than observables/async pipes have been. All of this combined with the massive 1st-party library ecosystem, it’s honestly one of the heavy punchers now, and I’d actually recommend giving it a go for people who are on the fence about which framework is worth trying.
standalone components isn't a feature, it's something other frameworks have had for years
@@marusdod3685 Sure, but it was only introduced this year with v15, so *for Angular* it is. They've been playing catch-up this last year and it's showing in how much better it's getting than it used to be.
I'm really looking forward to upgrading my works codebase from 12 to 17 in the new year. I love working with Observables and ramda more than anything any other framework has to offer for working with data. The new template language will finally clean up the html that I can't stand reading and made me cringe every time I was forced to add to the chaos.
@@ghostinplainsight4803 Bloody hell, good luck xD It'll certainly make the codebase nicer to work with, but we've been doing upgrades at most 2 versions at a time and even that's been tricky, going through 5 versions sounds painful
Looking forward to the htmx course on fireship 👍
I am not a developer or coder but I always come back here even though I don't understand much of it. The edits are always so on point and funny that even if I don't understand shit, it just drags me back in when there's new stuff uploaded here lol
So good you’re back. Missed the amazing videos!
I'm sick and tired of those js libraries/frameworks, it's quite okay to stick with one language and use it for long time in backend, same for mobile development you can pick RN or Flutter and those doesn't change much but if you want to create a web application you are fucked up, I created 3 Nextjs applications in 3 years and each time when I open to add something I realized that Nextjs is changed completly.
well, nobody is forcing you to update everything. just use old versions.
@@cool_piglet Documents force mentally, they switch to new thing by default and I don't want to remember what I have used last year
Glad to have you back Jeff. Had us worried back there
Amazing content as usual bro! 💪🏻
I really hope UnJS will blow up even more in 2024 👏🏻
Such an underrated project - still.
Yeah cuz we don't have enough new things
@@isimvol your brain is just too smöl too keep track of them
Yeah like every other new thing in JS Land, am I right?
I've been a full-time FE dev for around 3 years now working with Next.js. Although 3 years isn't all that long, I'm already starting to get tired of the constant new developments in this space. Most of our projects are built with the pages router and we won't upgrade them unless nescessary later on. New projects however, are built using the app router and it's been so painful. There's so much confusion with this new approach. My lead developer basically called me crazy when I told him that components marked with "use_client" also run on the server and had to create a POC to show him, lol.
Plus there's many third-party libraries that don't work with the app router yet. These changes are all happening too fast and it's basically driving me away from Next.js and instead looking at other options.
I'm in a similar boat, literally taking my 7 month downtime to rethink if I want to go back.
Could you please share ! the POC on how "use client" still does not make the component render on the client completely. I would love to know that.
@@yashsolanki069 all client components are first rendered on the server, like old next components used to before the upgrade. then any subsequent useeffects are rendered on the client. unless you explicitly disable server-side rendering, then it's just a plain spa React framework
@@yashsolanki069 i don't have the poc anymore. But you can check the prendering on the server if you disable javascript in your browser. Components marked with "use client" will still show their data, unless browser specific APIs are used or interactivity is required.
At this point i have given up on JS and its mutant children (The frameworks) and just going to stick with raw dogging HTML with HTMX and some kind of PHP Framework (CI4). 😰
amazing video man , just kept similing the whole video!
Jeff, we have been missing you for so long. I'm happy to see you back regularly on YT!
Angular became so nice and cool in last versions! And it works like a charm even for very small and very large projects!
I never felt that big difference since Angular 6. Okay, 17 has a new template syntax and vite is much faster in building. But I never had issues with using modules. I still use them to bundle components into groups, especially when developing libraries.
Angular always will and always has sucked balls
but the biggest bestest and most great change is the logo
I miss working with Angular.
@@ofuetsdo you like angular more than Vue?
Its funny that each framework starts because they don't like something in a specific framework and want to do differently but in the end, they all become almost the same thing, like the most important thing is the market share to create a product on top of it later. Funny Runescape reference tho
Have missed your videos! Glad to have you back
Interesting stuff as always. I've just wrapped version 1 of a a framework (private) that uses both Bun and htmx plus the subject oriented parts of rxjs (avoiding pipelines as much as I could), and it's really neat, small, super fast and server side rendering (well, kinda, with htmx it's kinda 50/50), outperforming any other system of normal ilk we've got for the larger systems in container environments. It sometimes really helps to start afresh with new tools, even if at first it feels daunting; well worth it.
Share git please
@@shittycoder5892 nope, private and company property, at least for now, sorry, but it's not rocket science
Less than 10 new frameworks released in 2023. JavaScript is clearly dying.
It’s already dead 😵
I love Bun! It's a really promising project and it can really simplify your dev experience. I've to give a try to HTMX later. Thanks for the report.
Happy to have you back @Fireship
1:27 that's right there straight away taken live from a real website ph🤣
Good to see you back mate🤘
Are there any plans to update the Angular course? Or are you waiting until Angular reaches it’s final form? haha great video.
Nuxt has been incredible recently 💯
So happy having you back in my feed 😭 the dopamine when I see the notifications for your channel are unmatched
How's every video is this useful...amazing work. Thank you!
I built a simpler HTMX that focuses on forms I dubbed it HTMF but that was already taken on NPM so it is up on npm as "html-form". It's a fraction of HTMX size and doesn't need to be "hydrated" like HTMX does since all I need it to work is `addEventListener('submit', ...)`. I have been able to successfully create an offline-first SPA with it and a back end first progressively enhanced MPA with it. This pattern is amazingly powerful and amazingly flexible in what it can do.
Microsoft have an old library called jquery-validation-unobtrusive and another one called jquery-ajax-unobtrusive which lets you do form validation and Ajax form submission using HTML5 data attributes.
Oh how i've missed you these past couple weeks Jeff, keep up the great content. A fireship video is much more entertaining than a Mr. Beast video ;)
@@dqvid_ Actually best
Wow you are so cool.
@@dqvid_ thanks i compliment like i code
loved the example
Not even an honorable mention of Qwik 1.0 in May? Qwik is a game changer in the fact it completely changed to no hydration!
This is why web dev classes in college aren't good. Sure it's good to have classes that teach you the basics but web development beyond that is changing so much every year, the course would basically change every semester.
Even coding bootcamps would be pointless as well. By the time you are done with the course, they are already outdated 😅
I never learned any frameworks until I learned javascript, html & css. Now I can write them myself. If I saw something in a framework I challenged myself to replicate it. Maybe they should teach the basics instead of frameworks, or delve into how the frameworks use the low level primitives and patterns. Don't know didn't go to College, I didn't even finish High School, learned it all from CZcams and Books.
Man, I am just so happy to see you are back
So good to see you back!
every javascript framework converges to the react(hooks mostly,effects,state etc etc.) way of doing things with some major improvements, and then react just decides to go down the server components rabbit hole that nobody(except Vercel that has significant interest obv) asked for.
Let them cook, maybe they’ll discover something interesting
I am just waiting for Vite to support RSCs
TO be honest the angular update cought me by surprise. Created a new side project (as you do...) and got completely dumbfounded as I thought I had a stroke while reading it. It is nice now.
We missed you so much Jeff 😭😭❤️❤️
Thanks for coming back
I love it when you put some shiny new features in frontend infrastructures
Your statement about Next.js slow dev server being made with rust is not correct though. The current (slow) dev server is still webpack. The new one (turbopack) is made with rust, but is still in beta and has some compatibility issues.
I love angular. its very stable and I can do anything without going to search or install 3rd party libraries and not worry about something breaking.
Tfw you're feeling depressed, but a new Fireship video makes you laugh and saves the day.
Good to have you back man
Can‘t wait to search for solutions in a not updated documentation :)
Have the problem all the time with Shopware. Either out of date or not even there
Gotta love it when you’re still stuck on an old version of some package and they’ve just removed the documentation for it…
With every year that goes by and with every framework update, the only thing I'm thinking about is wanting to get more and more away from using JS, and when I do have to use JS, not having to use a framework.
@@madd5hell no, we just want a simple universal way to load on scroll and refresh elements. Everything can be done server-side.
PHP is the way
If you try to use JS for a large project without a framework, eventually you will reinvent the wheel by creating your own custom framework which will most likely be:
- unmaintainable because new developers will not know how to use it
- unoptimized because you don't have the resources that huge teams with decades of experience have
- unergonomic because it was created for a single purpose and is not a general solution
@@marcopeterson805Blazor server side!
@@okie9025 Yes, I do agree with this, and when I'm "just another dev" at a company that wants to do things a certain way, it makes sense, but for my own things, I don't like the thought of introducing some of these frameworks at all, or at least, not so early in the process.
Welcome back bro, missed ya a lot
This cracked me up a bunch. Thanks.
htmx is good even if you like javacript. Why wouldnt you want to just have less code to maintain?
less http requests / more client-side stuff
I saw a tutorial and it seemed the component would make a request to the server on every interaction. It looks like syntactic sugar over ajax
@@phoneywheeze9959 it’s up to the person writing the code to determine much or how little to render. You get full control.
What I got out of this:
- Next.js is unusable by anyone outside of Vercel, but is still popular
- Vue and Svelte (my choice) are still the most rational developers experiences
- but Svelte wants to deprecate core things people are used to and like about it (I’m not happy about that)
- bun still rocks
Thanks for the informative video. Would have been nice to see the "using" keyword.
Lol that RuneScape picture for runes took me back to my childhood😅thanks!
i use nuxt and it's awesome! + u didn't mention astro they really dropping enhancements everyweek lol :)
1:27 I SEE WHAT YOU DID THERE 💀💀☠️☠️☠️ SUS....
"Compared to PHP; one of the most offensive slurs you can make against a JS framework"
Fucking GOLD.
Love your Code Report ❤
Angular new logo is basically adobe but colorful 😅
lol
I watch these to catch the latest buzzwords so I can throw them around in an interview
Didn't know I missed Fireship comical vids so much.
Happy to see you back
Never has a web dialog made me tear up. Hi mom indeed
Ah, the good old days of JS framework wars.
Excellent video 👍 Thank you 💜
The year 2023 brought significant changes to various industries, including web development where most frameworks reinvented themselves. Some of the recent changes in JavaScript include the standardization of new language features in ECMAScript, such as the object group by and array 2 sorted, which allows manipulating arrays as immutable values. Web developers also got new HTML elements, including the search tag and dialogue element, which allow creating modal dialogues and controlling them with JavaScript. Next.js, the most popular JavaScript framework, became entirely different from what it was last year, thanks to the app directory that became stable in May with version 13.4. However, the app directory has received mixed reviews due to its rushed and half-baked nature, making running Next.js correctly challenging outside of Vercel. Other frameworks, such as Nu and the Vue ecosystem, also had cool updates, including Dev tools that make it easier to understand complex applications. Finally, Spelt announced a new feature called runes, which will change the developer experience in version 5 by getting rid of reactive variables and stores.
I didn't know the dialog API was recent... I've been using it for my past 2 projects. Makes sense why tutorials do not use it (they create dialogs from scratch) and the confusing methods (.show() vs .showModal())
Is it generally available though?
@@danvilela yes
Users who are using older browsers may not be able to view it.
@@CW91 are there even users with older browsers?
@@CW91 good
When designing these frameworks (apart from htmx), did anyone ever ask, is this actually accessible and understandable for developers?
if they weren't no one'd be using them and they'd fade into irrelevancy
damn astro slighted... transitions are sweet
I love your videos, your cadence, and your humor
With Rails' new philosophy of a "renaissance developer" being pushed by DHH about going back to monolithic full-stack development and actually being productive as developers business value-wise, I can't help but feel like JS-related frameworks are about to be "so last season"... I'm back to writing Python Django myself and trying to be be productive without using all sorts of Pocket or Supabases and still getting stuff off the ground - and somehow I bet I'm not the only one. As described by someone else, most JS-frameworks feel like they were such a "zero-interest-rate phenomenon", haha :'D
I agree!!.. am building a website now, and I swear am writing my server using only the stdlib... i dont have time for their shit
Or just use angular with a barebones api… pretty sure that framework is only seen as uncool because it actually works decently. Not knocking simplicity though. At least 80% of frameworks are just wrappers for relatively simple processes you can write in any turing complete language
Regardless of what you think, React will continue to dominate like it has for the last 10 years
@@trentbosnic used both angular easier. Popularity not a proxy for goodness. Look at popular anything these days
going back to rails for the same reason with all the knowledge I gained working with node/js
Hey Jeff, what makes you use svelte over solidjs?
I started using svelte about 2 years ago but last year tried solid and I haven't looked back. Solid has similar reactive/signal patterns as svelte, but allows you to use jsx instead of svelte style templates.
Worth noting that you still can't use Typescript in Svelte templates. So even if you're not a fan of JSX, it's better to use Solid if you value type-safety.
Svelte has bigger community, meaning more and better packages. Also better DX.. solid is just react on steroids
@@danvilela Solid is not react anything. React re-invokes render functions whenever anything changes and uses reconciliation copiously. Solid re-invokes render functions never and has no need for reconciliation. This affects what code you can write. React requires ways of tracking component identity between renders, and it's a thing that can go wrong. This is not a thing in solid.
@@recursiv doesn’t matter, DX is still similar. I use svelte to scape from react. But if you like jsx its a solid option
@@chris-peethat feature was announced recently, and iirc will be added in version 5
Brilliant video series! Please do one every year!
Having Wix Studio as the ad spot at the end of this video is perfect. Why deal with JS when you can noCode.
I just use vanilla JS and it is ridiculously comfy
2 big hits in the webdev realm for me in 2023 :
1) HTMX, means I don't need any layers of BS on the frontend anymore
2) Zig web libs have matured, so I don't need any layers of BS on the backend anymore
1 + 2 == Super lean and clean, and so simple to work with. It's nice to be able to just focus on the app for once, and not have all this massive baggage that comes with all these frameworks and tools. Generate a single statically linked binary, that includes all embedded assets, build for any platform, and only needs a few MB of memory to run.
Rust, Vue, React, Next, Angular, Go, PHP, Java, Node, etc etc - can all go in the bin now.
I like the realism nature in your videos.
This is my favorite CZcams channel and I don't even know how to code.
This is why web development pisses me off. There are too many frameworks to learn and they constantly change, some might be better or worse in any given year. Developing windows apps is easy because all you need is .NET and C#. There needs to be a standard ECMA framework.