Nuxt in 100 Seconds
VloĆŸit
- Äas pĆidĂĄn 12. 06. 2023
- Nuxt is a full-stack JavaScript framework based on Vue.js that provides server-side rendering, data fetching, state management, and many other features. Learn how to build web applications with Nuxt in this quickstart tutorial.
#webdevelopment #javascript #100SecondsOfCode
đŹ Chat with Me on Discord
/ discord
đ Resources
Nuxt Docs nuxt.com/
Nuxt on GitHub github.com/nuxt/nuxt
Vue in 100 Seconds âą Vue.js Explained in 10...
Vite in 100 Seconds âą Vite 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
- Nuxt basics tutorial
- Vue.js metaframework
- Nuxt directories explained
- Nuxt vs Next.js
- Vue vs React
- Which JavaScript framework should I learn? - VÄda a technologie
I just love how aesthetically pleasing these 100 second videos are
Bro used asthetically đđđ
Still waiting on tamagui to get a video zzz
Same
And still wondering why is it not 100 seconds
@@hamadaelwarky3640 just because your vocabulary is shit doesnât mean youâre any better than him
Yes please! I love these 100 seconds series as they help me get a general idea on new things or the thing i haven't' used yet
would love a HuggingFace one
Nuxt and Vue are amazing, the work of people like Evan You, Anthony Fu and Patak to create and maintain them is a great example for open source projects.
And Posva. ;)
@@AngelHdzMultimedia And Daniel Roe, and Poya Parsa, and Harlan Wilton, just to name a few. All of them amazing devs. â„
and almost entirly of Africa and China for some reason companies their love to use them dunno why thou but huge communities in-comparisons to here in Eastern EU we still stuck with Angular and SPring in the Backend I'm tired from writing slow java code and almost had to fight to jump some java to rust and convince management it will save ton of money
@@ko-Daegu to complete your statement, NuxtLab is based in France, and I agree this is an awesome technology big companies should adopt, because the dev experience is incredible.
But in eastern Europe, enterprises are stuck to spring and angular for multiple reasons :
- angular & spring are here for decades. Why bother changing while this works.
- moreover, this means that devs should spend time learning this new technology, and there might be a lack of colleagues with expertise on that field. When moving on a react project, it was a pain for me, because nobody in my team could help me (the one who chose that tech stack did it because it was trendy, and ended up leaving the company).
- nuxt is unfortunately not mature enough. It took only a few years for the V2 to be deprecated, making a lot of big projects obsolete after only one year of run. What about V3 ?
- mixing the template, script and style section in the same file would end up making them very huge in real cases scenarios, and therefore, less maintainable.
When working on a personal nuxt V3 project, I noticed that splitting too much code into separate files or components would impact the performance and the number of requests, even on a production build.
@@ko-Daegu you didn't save them any money. Your novelty projects as a dev are not relevant to a company. If they use the java stack and you don't like it then get another job. Now you've just made sure that they need to hire a rust dev in the future or make one of their devs waste company money learning rust in order to support your novelty project in the future. All of that could've been avoided if you had stuck to Java which let's face it could've handled your stupid novelty project just fine but you just wanted to use rust.
You skipped one of Nuxt's coolest features! It has Typesafe API endpoints with useFetch. Any endpoints you write in the server/api directory will have typed responses and paths when used with useFetch. Feels like Remix's data loaders.
The web framework (called H3) for server apis is also extremely fast and trades blows with Fastify.
But my favorite part of Nuxt is that they've built it with an open set of tools called "unjs" so anyone can build their own nuxt-style framework. Analog is an Angular framework that's using it
PLEEEEAASAASEEEE!!!! We need MOOOOOAAAAARR 100 seconds videos.
They are awesome.
They help not to dive into a new framework every 3 months - because you get the idea =)
nice dino emoji đ
đŠ
Behind Code Report, X in 100 Seconds is my favorite content. Your Angular tutorials are also great.
Angular comment on a vue video?! Blasphemy!
@@yegorzakharov8514 I have to use Angular for work, but if I were to build a project from scratch, I'd use Vue or Svelte đ
@@blackfi12e622 I don't think anyone enjoys using Angular for hobby projects lol. It's always the case that you have to use it for work
@@blackfi12e622 my condolences for having to use angular. But it pays the bills so worth it
@@blackfi12e622 built an llm app with sveltekit the experuince is beyond great i jumped from next to nuxt finally staying with sveletkit
I would not have started using Svelte if it werenât for your 100 second video on it, and itâs changed my web development experience forever. Please keep it up!
Props to
- Daniel Roe
- Anthony Fu
- Patak Dev
- Sebastian Chopin
- Pooya Parsa
and many more contributors that make Nuxt 3 possible đđŒ
Daniel Roe is a Godfather
Daniel Roe is actually a Nepalese guy
const props = defineProâŠ. Okay nvm.
Don't forget Pooya Parsa
Loved the nuxt-up easter egg.
If Nuxt had some opinionated framework or boilerplate for dependency injection, I could easily see Nuxt as the future of Web frameworks.
There's loads more which wasn't covered, like the server directory for file-based routing for building an API, server rendered component islands, and more things about how good it's DX is. Nuxt is â€ïž
Muuuch more! They are working in session, authorization/authentication, strategies. And devtools is having a lot of improvements. And all the good stuff being added to Vue like defineModel, Short v-model macro (with @vue/macros), props destructuring, generics. Nuxt is đ
Nuxt3 is easily one of the weapons of choice for smaller and bigger web projects. One of the best DX I had in over 20 years of web development.
These 100 Second videos are my favorite because you give us, the viewer a simple overview of something that we may like and can see while at the same time we get to explore and try it for ourself through our own methods. Amazing work and please keep making these 100 second videos! :D
Nuxt is awesome. It took me just a day to start building with it.
same!
Took me almost 3 days to start building with it. The struggle here on Ceres is real đ€
Yes, more of those videos would be much appreciated. They also serve as a much-needed refresher of certain knowledge for us, non-developers, out there... Thank you for your effort!
I really love these 100 secs videos because there's just enough to keep me engaged but not so much that I don't feel like going to explore it myself. Definitely keep doing these, please.
Love the 100 second series. The perfect intro to new technologies that help users & viewers understand if it's something they might need to dive a bit deeper into and take advantage of! Definitely keep it up đ„ł
Yes, please. I always rely on 100second fireship videos to explore new tech.
Please please do a totally unbiased, deep comparison between Nuxt and Next!!
+1
+1
Nuxt is better and I am bias against Next... đ
Been waiting for this one! Last year i coded mostly on Nuxt and rails and fell in love with nuxt. Saved me from a lot of headaches
Love the 100 sec videos! I'm not a professional dev, but I watch your channel to stay up to date on dev news and to learn the capabilities of all these tools quickly, as I work in the tech industry and have a hobby home lab for fun Plex, nextcloud, and other fun projects. đ
Love these types of videos but I think making more beyond 100 seconds videos would be amazing!
This video is literally 169 seconds long
you can buy his course for that.
his beyond fireship channel is exactly made just for that
@@Goldeooooooo a perfect square!
@@louisuy_ yes it is! đđ
Been developing whole ecomere site from scratch and this framework is really refreshing
Everything works out of the box, deployments are easy, and the speed of writing code is insane, no need to think about states, imports, bundle sizes, cross component communication
You literally focus only on the logic itself, everything else is being handled
If you had to point out any negative points, what would they be?
@Andai To understand interactivity of day to day components (drop downs, modals, styled reusable inputs), flows, caching mechanisms, statistic trackers and other things so that later i could use this knowledge to improve existing projects
â@@mateleo78 i second this
The negatives of nuxt 3 hmm.. thats a hard one. Initially there were integration issues and missing libraries but its all now fixed.
maybe a slightly bigger bundle size as an empty project. but once fully loaded it ends up being smaller than next and cra. atleast in my use case.
I had a hard time with data fetching.
Especially for requests that should be made in the browser, but not on the server
Hey buddy! Your "100 Seconds of Code" videos are absolute gems! Seriously, they've been a game-changer for me. Your teaching style is spot on and I always walk away with practical tips. Keep those awesome videos coming, my friend! You're making a real impact in the coding world. Cheers to you!
Definitely not written by an AI.
Please continue. Time is scarce and what you are able to explain in 100 seconds is fantastic.
Your 100 seconds videos literally gave me a college degree worth of education by incrementally exposing me to so many concepts in web dev and software engineering, giving me the chance to explore what looked like a nightmare of intertwined concepts with so much ease. You have no idea how much you've helped me. I'm a a data science undergrad and before your channel I felt like I had tunnel vision but all of a sudden I can see everything. Plus your sense of humor is fantastic and your videos have amazing visuals. Please keep making these, coz we do appreciate everything you do, and you are helping MILLIONS.
i'm a soon to be grad also data science and yeah man this guy is so good at keeping you knowing whats going on in the landscape. if only we had this for DL...
@@connorkapooh2002 too true
Yup yup yup Iâm a recent grad too and these videos are gold. Few other people can make videos that are as informative and concise as fireship, and the humor makes everything 100x better. Iâve learned so much just form these videos and they provide great places to jump off from if I want to deep dive on something that I like or will help me at work
100 seconds is the best series on CZcams, change my mind
...guess the ELO?
Definitely keep turning out these shorts. They keep me updated on tech so much better than many other resources it isn't even funny. Great work! đ
I definitely think you should continue making these 100sec technology/ concept videos. Just having some introductory knowledge of more techs and concepts in software development greatly improved my ability to understand and problem solve. Especially as someone transitioning from a different field of engineering!
Bro your 100 second tours are always awesome, pls never stop đ„ș
I used to use Nuxt in version 2.x. With version 3, a lot has changed, developed and improved. Nice to see it. Of course, a video like 100 seconds of something is great!
Iâd absolutely watch them, if you made more of these! They are like a Tech radar for me and I love how you manage to get all the important features across, without wasting your viewers time!
Yes please keep making these videos. You're pretty much my main source of quick summary on tech these days. Thank you for everything you do. Cheers
Love these videos so much Jeff. Keep it going!
Nuxt is just beautiful. Thanks.
Definitely keep the 100 second videos going, they're great! I love getting a nice overview of whatever cool thing you do a video on.
yes pls more of these, this is all the time I have these days to watch something about new tech/not-yet-tried stuff
Fireship does it again. CONTENT MACHINE.
Waited this for so long â€â€â€â€đ„đ„
I love these, it's almost impossible to keep up with all the new things nowadays... these short summaries are extremely useful. It helped me massively to prepare for my latest interview and I got the job ;)
Thank you sir, even though I don't need some 100 seconds videos, I really love to watching it. When I need it, it's a gem. Hopefully more to come.
I would love to see you do OCaml in 100 seconds. Such an underrated language
In my opinion, Vue is underappreciated. It's significantly superior to React. Your further introductions to Vue will definitely encourage more people to use it. It doesn't deserve to be neglected
Vue is too intricated. React is much easier for understanding and that's why it's most popular.
@@igor-grudinin No that's not. React is popular because of meta. I have used both in projects, and I believe vue has a better DX.
@@igor-grudinin That's not true, Vue is easier to learn and understand, you don't need to know what everything does under the hood.
@@igor-grudinin You know what's the best of both worlds? SolidJS. Solid is looking similar to React, but much more performant/efficient than Vue.
@@davidvultur8704 and how many vacancies are opened for SolidJS? I see it very rarely. And React is everywhere.
Yes, keep making these videos. They're super helpful when I'm over here stuck in a dark corner of tech while everyone else plays with new shiny stuff
Keep making these 100 seconds videos. They are great to get a solid idea about a framework of language before diving into it.
Nuxt is great. The only thing missing from the Vue ecosystem IMO is a React Native style framework. If anyone can make it work it'd be the Nuxt team!
I think Quasar is it
NativeScript has you covered đ
Vuetify
vuetify if imo the best. quasar is also pretty good
@@TilenPirih I think he's talking about something for mobile development. NativeScript Vue is the way.
1:27 "nuxt up" đ
The 100 seconds series is the reason why I subscribed so I would look to see those every now and then. Nothing wrong with your other videos, I just have missed this series.
A mixture of both your newer videos and the 100 seconds videos would be nice.
These videos are invaluable source of information about latest frameworks. In such a short time you managed to give just enough information to decided wether I want to have a deeper dive into the framework or its not for me.
If you make a full Nuxt course on your website I'll buy the PRO membership I swear
Me too
Not gonna lie I read the title without the X
I guess that means you identify as a dog...
I can do that though
Yes, the 100 seconds video are awesome to quickly get an overview of languages, frameworks and concepts.
They are the videos that made me discover your channel.
The code report, beyond 100 and other materials are what kept me.
It's understood that there can't be 100 seconds videos daily or even weekly. No harm in that.
I like all of your videos, but the 100 seconds are my favourites! It must be quite an effort to condense all that information into such a small duration, amazing!
Nuxt is incredible but not enough people use it so in some edge cases it's hard to find support for some functionalities and I have to navigate my way through some unknown third-party open source plugins.
If channels like this one keeps promoting React more, of course Nuxt is going to be underrated and with less tutorials/answers.
@@AngelHdzMultimedia I don't necessarily think that this channel is specifically pushing for React. They tend to use React for code snippets/examples since it's the most popular thing and is the most likely to be understood. But I do agree that in the CZcams space, React is way more popular.
Thouh I live in an alternative world (France) where the most used solution for production is the Angular-Spring stack lol
+ performance are just bad if u compare to Nextjs
@@user-re8lt2gy3g are you joking, right? đ
@@AngelHdzMultimedia u need to read a blog from the astro creator him self nuxt is ranking low in every test
Why the hell have I not found nuxt earlier.
Continue making these 100 second videos, they help me get a gist of new technologies and helps choose if they are interesting enough for me to try them out :)
I love these videos, because it quickly introduces me to a technology/stack I hadnât used before, but without getting bored with technical info. Itâs just the elevator pitch.
NUXT > NEXT hands down no cap. Screw React.
âitâs good for employabilityđ€â my ass-sets
My fellow Reactors, make the switch. become a Vuer
I really love 100 seconds and beyond 100 seconds videos as well. Keep up with the great work.
The combination of editing and information makes this video amazing!
Yes, please keep this kind of videos , they are really informative and straight to the point. Also, it would be nice to include more dev ops stuff.
Yes please, we need this videos. They help a lot in knowing what tools are out there when working on stuff.
+1 for more 100 second videos ... don't even really care what you cover, just really appreciate the format and how well they are made.
More 100 seconds videos please. These have been my intro to many of the tools i've adopted in more recent times.
Hell yeah bro, keep it up! Whether itâs the code report or 100 seconds of whatever, Iâm here for it. đ
These type of videos are why I subscribed to your channel in the first place. Keep them coming :D
Great overview which is very useful when you are looking for new frameworks or just wanting to understand the current state of art. Many thanks!
You should definitely continue making these clean and short, fun and educative videos đ
The thing I love about these videos is that they allow me to take a look at new technologies that I haven't used without needing to get balls deep into a project
Thanks @Fireship for featuring my open source project (Medusa module for Nuxt) in your video! This is quite an achievement for me đ
Videos like this one made you famous, keep doing this amazing work, we all want to see more đ„
These "in 100 seconds" videos are so valuable lmao, you literally get info on the basic starting points you require to begin
1. Initialize and use the library/language
2. Basic uses
3. Advanced uses
4. Tips and tricks
Absolutely great
definitely love the 100s series! They're great to see if a tool is worth taking a deep dive
Of course continue making in 100 seconds videos, its one of the things that brought me here. No problem diversifying as well though, just keep doing what you do.
Amazing, you're my first front of frontend news.
And helped us define our new stack in work, keep up good work, bless! đđđđ
Definitely would like to see more of these videos again. As much as I love the mid-AI-video thrill of not knowing whether I'm being educated or brain-melted with all that meme sludge being poured down my throat.
please keep bringing these 100 seconds videos as they are really good and informative.
These Videos are great. Even if i are not initially interested in a topic or specific framework, i can quickly watch these videos and lern something new and maybe take a deeper dive in the future
Been using Nuxt for years, still my favorite framework to use đ
Love the 100 Seconds videos, and love much that you made one for Nuxt â€
Your in 100 seconds videos, when you used to make them all the time, I got so excited for. With the wait, I was even more excited because I love them so much! But don't make us wait longer, because we love your videos đ€Łâ„
Def keep making videos like this, because there's a ton of stuff we all want to learn
This is the video I've been waiting for since the last Nuxt release! Thanks!
please never stop these 100 seconds! they my bible and guidance sensei! haha
Those videos rehydrate the passion in my heart for programming and it's really dry there no pun intended
I love these videos man! It gives me a quick review of the subject and then I can decide if i go deeper into it or not.. You are the best!
These Types of Videos are the best. Please make more of them!
Great video thanks! I've been using nuxt for a while now and it's awesome. And yes please make more of these videos
YES ! I would love more videos like this. Whenever there's a technology I don't know, I first check into youtube "[tech name} in 100 seconds" lmao
I really appreciate and enjoy these 100 seconds videos
Whenever I come across a new technology my first search has now become a youtube search for "x in 100 seconds". So yes, pls continue. I like the code report series too and the videos going into a lot more detail on certain technologies, but this series is really my top "click on every single one of them" series.
Yes make more of these videos! I would honestly like longer versions too
LOVE these videos. You should consider an audience that isn't technical. I have a friend that works in product and I always send them your videos but often they are still too technical for the content they need. A product manager channel with tehnical content for non-technical people would be huge.
Bonus point for using the phrase "Nuxt up". I've not seen this before and I have to say: it looks pretty darn cool. Thanks for sharing â€
Absolutely keep on making those awesome 100sec videos
I really love the 100sec series. Keep 'em coming.
I love your 100 seconds overviews very much!
Its now an official Nuxt3 Video. Kudos to Jeff for making this awesome video and Nuxt team for acknowledging it.
Okay damn I'm sold, thank you very much for 100 seconds!
Please continue, I go back on these to review my stack and stay up to date
I am a great fan of yours. I love all your contents. Super classy and perfectly confined.