Bun Crash Course | JavaScript Runtime, Bundler & Transpiler

Ғылым және технология

In this crash course, we will look at the Bun.js JavaScript runtime/bundler/toolkit. I will show you how to get set up and check out some of the features.
Bun Official Website & Docs:
bun.sh
Check Out My Courses:
traversymedia.com
If you are on Windows, this is a video I did setting up WSL. It is old, but the steps are pretty much the same:
• Windows 10 Bash & Linu...
Timestamps:
0:00 - Intro & Slides
1:22 - What Is Bun?
4:41 - Features & Advantages
9:16 - Installation
11:50 - bun init
12:55 - bun run
13:18 - Bun.serve()
15:29 - Watch Mode
16:22 - Hot Reload Mode
16:43 - Env Variables
18:16 - Bun Scripts
19:30 - Simple Routes
21:00 - bun x
21:58 - Node Core Modules
23:59 - File I/O API
27:05 - Testing
29:19 - The Bundler
32:21 - bun build
34:26 - Bundler Watch Mode
35:03 - React & JSX
39:03 - Conclusion

Пікірлер: 137

  • @CodeWithMasood
    @CodeWithMasood7 ай бұрын

    For crash courses, this channel is awesome and must watch. Soo nice explanation and to the point!

  • @TraversyMedia

    @TraversyMedia

    7 ай бұрын

    Thanks my friend. I appreciate it!

  • @CodeWithMasood

    @CodeWithMasood

    7 ай бұрын

    I remember, when I started my web dev career by watching your html, css and js tutorial. Then I jumped to start learning HTML5 canvas for building 2D games. Now I am a full stack developer, a Pro freelancer and also started my own KZread channel. You are one of my Inspiration for this all Sir! Success has only 2 main principles: .Having a Goal in Life. .Hardwork to achieve that Goal.

  • @DC-xt1ry
    @DC-xt1ry7 ай бұрын

    BTW the reason why you may want to combine improt/require is because some required libraries may not support ES6 and you are stuck. Is handy to have the felxibility to have both, specially if you are mirating old projects.

  • @TraversyMedia

    @TraversyMedia

    7 ай бұрын

    Ah yes true

  • @Ahmad-lc1ln

    @Ahmad-lc1ln

    7 ай бұрын

    @@TraversyMedia Bro, r u giving heart to ur self.

  • @mkmalikcom

    @mkmalikcom

    7 ай бұрын

    ​@@Ahmad-lc1ln😂 I think by mistake bro

  • @trappedcat3615

    @trappedcat3615

    7 ай бұрын

    @@mkmalikcom It's too late. No take backs allowed. It's now in an infinite heart loop.

  • @mkmalikcom

    @mkmalikcom

    7 ай бұрын

    @@trappedcat3615 omg 😮

  • @judevector
    @judevector7 ай бұрын

    Just finished going through this now , thank you for making this I now have a grasp of what I can do and how bun works

  • @webdevluc
    @webdevluc7 ай бұрын

    Thanks for creating and sharing this awesome crash course Brad

  • @AindriuMacGiollaEoin
    @AindriuMacGiollaEoin7 ай бұрын

    Super exciting! Great course Brad :)

  • @tonykharioki6913
    @tonykharioki69136 ай бұрын

    this was amazing. I now understand bun more intimately. good job Traversy

  • @AGUNGKAYA
    @AGUNGKAYA7 ай бұрын

    Perfect timing Sir!

  • @champorado2131
    @champorado21317 ай бұрын

    I have been waiting for your own take on Bun!

  • @cyberprompt
    @cyberprompt7 ай бұрын

    I agree, I've been looking at Bun for just over a week and it seems awesome, and now we have Brad's take too. I might actually enjoy a Rainy Monday now.

  • @perplios
    @perplios7 ай бұрын

    I NEEDED THIS 🙏

  • @moonlightCR7
    @moonlightCR77 ай бұрын

    This is the video I was trying to find, Really appreciate Brad😢. Love you man, you're a life saver.

  • @TraversyMedia

    @TraversyMedia

    7 ай бұрын

    No problem. Enjoy!

  • @clixt984
    @clixt9847 ай бұрын

    I was just waiting for Brad's take on Bun! Time to watch this video!

  • @dezlymac
    @dezlymac7 ай бұрын

    Thanks for this crash course Brad! 👀 I was about to start learning node (I still will learn node) but I couldn't resist checking out the bun hype. So tasty lol

  • @Amar11115
    @Amar111157 ай бұрын

    Thanks for this Amazing Crash Course😊😊

  • @paulthomas1052
    @paulthomas10527 ай бұрын

    'Bun' looks like a pretty interesting library - great tutorial BTW !

  • @DC-xt1ry
    @DC-xt1ry7 ай бұрын

    Another price less class! Thx Brad!

  • @MuhammadBilal-ry5rb
    @MuhammadBilal-ry5rb7 ай бұрын

    I'm following Brad from last 2 years I believe he is one of the best Programming Instructor in the world and quality content I just love your teaching way that your primarily focused on quality content even less effort of editing that's really love and huge respect and love from PAKISTAN. God bless you Brad, you are inspiration for us. Thank you for your quality content :-)

  • @nordicnomad5473
    @nordicnomad54737 ай бұрын

    Thank you so much for this video. I was looking for a tutorial for how to use bun as a development server. My node/npm is broken in my machine and I wanted to try bun. Now I have the clear guidance on how to use it. Thabks again 🎉

  • @NuanceWebsites
    @NuanceWebsites7 ай бұрын

    Very informative, thank you. 😀

  • @Salah-YT
    @Salah-YT7 ай бұрын

    thank you so much Brad it is an amazing video about Bun 🙂

  • @biscuithammer
    @biscuithammer7 ай бұрын

    Thanks Brad! when you starred this on GH, i knew a new crash course is coming. 😁

  • @ratulghosh1631
    @ratulghosh16317 ай бұрын

    Time to put BUN in my resume!, thanks ❤

  • @kameikojirou
    @kameikojirou7 ай бұрын

    Awesome, thanks for this!

  • @xcrxwadda8287
    @xcrxwadda82877 ай бұрын

    Notifications on ♨️♨️ , exactly what I have been waiting for

  • @mrrolandlawrence
    @mrrolandlawrence7 ай бұрын

    10 minutes in & im going to try bun after watching this video. something exciting indeed.

  • @kwanelekhumalo

    @kwanelekhumalo

    7 ай бұрын

    Saaaaaaaaaaaaaaaame!!!! 😂😂😂😂😂😂

  • @okpakodavid4123

    @okpakodavid4123

    7 ай бұрын

    I know right...😂

  • @muhammedozalp
    @muhammedozalp7 ай бұрын

    Thank you bro for this great tut

  • @mdadnankhan666
    @mdadnankhan6667 ай бұрын

    Thanks Brad, for this crash course!! I am waiting for your full course on bun on Udemy 🙂!!

  • @husseinkizz
    @husseinkizz7 ай бұрын

    This is it, the great has made a video on it 🧙‍♂️

  • @youneshenni5417
    @youneshenni54177 ай бұрын

    Bun is such a good addition to the js ecosystem.

  • @CodingPhase
    @CodingPhase7 ай бұрын

    great crash course

  • @jameswalker9490
    @jameswalker94907 ай бұрын

    Thanks for making this informative video! I wonder how much of the functionality provided by bun replaces the rich plugin library available to webpack and babel.

  • @pokeyanteater598
    @pokeyanteater5987 ай бұрын

    This was pretty sweet

  • @amadujalloh4700
    @amadujalloh47007 ай бұрын

    The GOAT 🐐 strike again. Brad, you are the man.

  • @ahmedabdulrazzaq2015
    @ahmedabdulrazzaq20157 ай бұрын

    Nice dude

  • @mdyounusaliakash3168
    @mdyounusaliakash31687 ай бұрын

    Thanks for this.

  • @ashrafsayed1058
    @ashrafsayed10587 ай бұрын

    Great ❤

  • @b166er4
    @b166er47 ай бұрын

    thx, it look fun, i m going to use in a dev project.

  • @stevemcardle2013
    @stevemcardle20137 ай бұрын

    Wold be great to see you do a crash course on htmx

  • @IsxaaqAcademy
    @IsxaaqAcademy7 ай бұрын

    Thank you sir

  • @snithfferx
    @snithfferx7 ай бұрын

    Thanks for the video. Was very explainatory and easy to follow. just a question, is something I try to figured it out. Did you make it work with routes, but using a separate file of routes? I had have try to make it as node.js and express but without express is not possible.

  • @kimboender7749
    @kimboender77496 ай бұрын

    Nice one again!

  • @uzzipy
    @uzzipy7 ай бұрын

    woohoo Traversy Media always the best

  • @krissh_the_dev
    @krissh_the_dev7 ай бұрын

    The reloading on its own part ( 35:20 ) is because of the Live Server extension tho.

  • @HassanAllaham

    @HassanAllaham

    4 ай бұрын

    good catch ... but the --watch mode is working in a very good and fast way

  • @likandokayombo
    @likandokayombo7 ай бұрын

    Nice

  • @treyrader
    @treyrader7 ай бұрын

    yes!!

  • @sakarsr
    @sakarsr7 ай бұрын

    Thank you for this Bun crash course. Is Bun ready to be used in real development?

  • @jayparekh2592
    @jayparekh25926 ай бұрын

    Your proshop 2.0 is just wow....

  • @Boylagak
    @Boylagak7 ай бұрын

    Sir more tutorial about PHP Programming language please!

  • @odebroqueville
    @odebroqueville4 ай бұрын

    Very nice quick overview of what we can do with bun. Thank you, Brad. Just wondering, couldn't you have used fetch() instead of axios?

  • @WaliaIbex
    @WaliaIbex7 ай бұрын

    One Ring to rule them all 😛

  • @viralmoney8619
    @viralmoney86197 ай бұрын

    Sir. Please make project playlists for nestjs❤🎉

  • @Abdulhannan.m
    @Abdulhannan.mАй бұрын

    Excellent Brad. But there is no need to put await before Bun.file function as per the offical docs. Code should be like this const file = Bun.file("cv.txt"); console.log(await file.text()); console.log(file.stream()); console.log(await file.arrayBuffer());

  • @howuseehim
    @howuseehim7 ай бұрын

    Are we getting a php course with building custom MVC templating with twig and all the good stuff?

  • @lule-ahmed
    @lule-ahmed7 ай бұрын

    Elysia js tutorial pliz , that would be fantastic !

  • @jrmc732
    @jrmc7327 ай бұрын

    The bundler is not only for the frontend the bundler is for JavaScript Applications.

  • @AaronStorey
    @AaronStorey7 ай бұрын

    Im a native Android developer, but I'm looking to expand my horizons. Looks like now is a more exciting time to check out web development 🤔

  • @jeanssmith5864
    @jeanssmith58647 ай бұрын

    ❤❤❤❤😊

  • @baegopado
    @baegopado7 ай бұрын

    woah nc

  • @jujijiju6929
    @jujijiju69297 ай бұрын

    Zig itself isn't 1.0 is it not? How reliable can Bun be and how long will it last? This feels a lot like the 'Deno will replace Node' hype phase everyone went a few years ago. But this has such good features, it's worth tracking for a couple of years to see how it will evolve.

  • @Sebastian-hg3xc

    @Sebastian-hg3xc

    7 ай бұрын

    from what i found on their website, their monetization plan is to at some point start offering hosting that runs bun, which doesn't sound promising. i'd be very careful around this tool. too much hype.

  • @nightfury8848
    @nightfury88487 ай бұрын

    May i ask what's your approach to learning new technologies? Do you read whole docs first? Or do you dive directly into development and figure it out? Or do you watch videos to learn about it?

  • @TraversyMedia

    @TraversyMedia

    7 ай бұрын

    The docs are usually my first stop. I will usually just open a file and start working with it following along with the docs. From there I just experiment. I use a lot of articles/blog posts, etc. Once I am somewhat comfortable I go deeper with tutorials and courses. Then when I feel I am ready, I will start creating my own projects from what I have learned. ChatGPT now has a big role in my learning as well.

  • @nightfury8848

    @nightfury8848

    7 ай бұрын

    @@TraversyMedia Thank you for providing your insight , I am currently trying to figure out the most efficient way to learn a new tech , my mistake lies in wanting to read whole docs before building something seeking to get a full overview of the capabilities. I'll try to have a more experimental approach similar to what you're doing, thanks again mate.

  • @headlongsegun3697

    @headlongsegun3697

    7 ай бұрын

    ​@@TraversyMediaBrad, ❤ from Nigeria. You have impacted me immensely. I am newly introduced to coding and am getting along so fast. I am age 42 but getting inspired daily to move further deeper in learning at your feets 😊😊😊 Thanks 👍

  • @mohamedsakr9301
    @mohamedsakr93017 ай бұрын

    Thanks Brad for creating and sharing this awesome crash course do you plan to mojo crash course ?

  • @TraversyMedia

    @TraversyMedia

    7 ай бұрын

    I need to look more into it. There is just so much stuff out there.

  • @subham-raj
    @subham-raj7 ай бұрын

  • @bhanuarora4504
    @bhanuarora45047 ай бұрын

    i used watch mode for bun on wsl and it's not working, any facing similar issues or do you guys have any fix for the same??

  • @randomforest_dev
    @randomforest_dev7 ай бұрын

    Bun looks promising. I am more interested in using it as a blazing fast REST Api, but it looks like most JavaScript people are interested in using it for frontend tooling and show examples around it.

  • @Kimanxo

    @Kimanxo

    7 ай бұрын

    it already has two good frameworks for that, Hono and Elysia

  • @randomforest_dev

    @randomforest_dev

    7 ай бұрын

    Oh thanks for the reply but when I check hono and Elysia docs, I do not see any guide on integration with an ORM apart from sqlite. (Not sure why my first reply got deleted by YT)

  • @Kimanxo

    @Kimanxo

    7 ай бұрын

    @@randomforest_dev you don't need docs, just google how to integrate Prisma with Elysia, prisma allows you to ORM'ly use most of databases, so, writing Prisma code within Elysia project is all you need

  • @bugraotken
    @bugraotken7 ай бұрын

    Hello Brad, thank you for this quick tutorial but it would way better if you have get rid of these type warnings at the code. Everywhere is underlined red =/ I mean, we can not use "document" like you do at coding side. (src/index.tsx)

  • @kasper369
    @kasper3697 ай бұрын

    I am really finding a excuse to stay with Deno, I really love deno

  • @sumitsharma6738
    @sumitsharma67387 ай бұрын

    make a full course on next 13

  • @programacion3694
    @programacion369419 күн бұрын

    buen contenido auidovisual

  • @cbbcbb6803
    @cbbcbb68037 ай бұрын

    Do we need to learn Zig as well?

  • @wobsoriano

    @wobsoriano

    7 ай бұрын

    If you want to contribute to the project, yup. If you're just building stuff like what you do with Node, nah.

  • @MagnoKellyFelipe
    @MagnoKellyFelipe7 ай бұрын

    Nice explained! One question. Do I need to uninstall Node in order to install and run Bun?

  • @TraversyMedia

    @TraversyMedia

    7 ай бұрын

    Not at all. You can use them together

  • @SOLDAT_MENDES

    @SOLDAT_MENDES

    7 ай бұрын

    No, you don't need to uninstall Node to install and run Bun. They can coexist peacefully on your system.

  • @algoexpert
    @algoexpert7 ай бұрын

    I have been trying all these performance benchmarks and seeing if bun really crashes node and node is faster; what am I doing wrong. Node also have --watch option to correct this video a bit. What is the point of bun then installation?

  • @soniablanche5672
    @soniablanche56727 ай бұрын

    Bun seem to have problems with regex, they are really slow compared to node. By the way, you don't need nodemon for node anymore. node has a watch mode too.

  • @dainsleif3122
    @dainsleif31227 ай бұрын

    Question: Why would you use this instead of Next.js ?

  • @TraversyMedia

    @TraversyMedia

    7 ай бұрын

    Everyones answer will be different here, but for me, I would use NextJS for a smaller dynamic website. Something like say a blog site, job listing website or even my website where I sell courses. I would use Bun for a very large scale applications, APIs and microservices. Something where you may have lots of routes that are being hit from multiple clients. Maybe a mobile app and a website, etc. Both are great, and in many cases can be use for the same projects, but I would make my decision based on scale. However, Bun is very new, so I would not use it in a large production projet yet personally. I would stick with Node for now.

  • @dainsleif3122

    @dainsleif3122

    7 ай бұрын

    @@TraversyMedia cool! thanks for the answer!

  • @saifashraf2135
    @saifashraf21357 ай бұрын

    at 26:06 , I don't get any output, the file.text() is not working and it's also stopping any code after it from working..

  • @ishitaagarwal4020

    @ishitaagarwal4020

    7 ай бұрын

    same, did it get fixed for you?

  • @jakobgarde6769
    @jakobgarde67697 ай бұрын

    Thanks for the video! It is probably the best video on Bun as of now 😎 I noticed that you chose to disable Copilot by going into your plugin/extension tab in VS Code. But do you know that you can disable it by simply pressing on the little Copilot icon in the lower right corner of the editor? That is just way easier in my opinion 😅

  • @itzDoraemon
    @itzDoraemon7 ай бұрын

    Even "Hello World" Example Thank you to use Dark Theme Easy for eyes , when switching from editor to web browser to see result , Thank you very much from eye-problem people like me.

  • @TheBlackmanIsGod
    @TheBlackmanIsGod6 ай бұрын

    Why are my Bun files hidden? How do I get the files to my web server?? When I use GUI and navigate to the folder or directory there’s nothing there, I can’t see any files, but when I navigate there in command line then I see all my .tsx, and beginning files… Why can’t I see my files so I can copy them over to my web server or how do I do this??

  • @papa_ethan
    @papa_ethanАй бұрын

    How compatible is compatible with Node JS?

  • @shrimpoffthebarbie
    @shrimpoffthebarbie6 ай бұрын

    How does this help me? I don't work on web.

  • @zb3485
    @zb34857 ай бұрын

    the benchmarks arent lying...im yet to find a case/project where performance wouldnt be improved AT LEAST 2x

  • @serhatzaferulgur4805
    @serhatzaferulgur48057 ай бұрын

    Just for fullstack developers 😇

  • @CoderDmitri
    @CoderDmitri7 ай бұрын

    @TraversyMedia Thank you so much for this Traver, just one small request, if possible. If you are getting sponsored by these companies, would it be possible to declare that in the Video... because all those magical numbers and performance metrics are nice on paper, untill you start working with them... So are you getting sponsored by Bun for this video?

  • @jabiradeniji-bello2140

    @jabiradeniji-bello2140

    7 ай бұрын

    i don't think he is, bun has just been really popular recently so i guess he just wants to talk about it and i think it's open source as well. And about the metrics, they're in most cases for when they are used in the most optimal manner, but even then i already tried bun(just as a package manager though) and it does feel quicker than node.

  • @Sebastian-hg3xc

    @Sebastian-hg3xc

    7 ай бұрын

    KZreadr strager has a video called "do not use bun" with some performance tests he did himself, which paint a very different picture about how good bun really is. i wouldn't trust their own numbers or anyone who just repeats them. ;-)

  • @jabiradeniji-bello2140

    @jabiradeniji-bello2140

    7 ай бұрын

    But like I said, “feels” quicker, it might not actually be, it might just be me making myself think bun is faster🤷‍♂️

  • @UCHIHA587
    @UCHIHA5877 ай бұрын

    We want Ether.js crash course

  • @kevinshibu349
    @kevinshibu3497 ай бұрын

    Make part 2 of javascript cource

  • @imDilip
    @imDilip7 ай бұрын

    Is it hype or future?

  • @gabbeeto

    @gabbeeto

    7 ай бұрын

    I haven't used bun but I hope it's not hype. Bun united almost all the components that you're probably going to use in one tool. I'm still learning things like webpack but I want bun to have all the good features that webpack has without the tool being too complicated. We have to use too many different tools.. Why don't we have one tool that does everything. We should be making our lives easier, not harder

  • @mahfuzhasan7588
    @mahfuzhasan75887 ай бұрын

    Is it really going to be a game changing tool?

  • @TraversyMedia

    @TraversyMedia

    7 ай бұрын

    I really hope so. Having everything in one toolkit is key. The JS ecosystem is too fragmented. You need too many things to create full stack apps. Bun makes it so much easier and adds a bunch of needed features as well.

  • @Sebastian-hg3xc
    @Sebastian-hg3xc7 ай бұрын

    careful not to fall victim to the hype. i've seen a review with performance tests that showed bun being actually slower than pure nodejs. what is fast is mostly their package manager.

  • @wobsoriano

    @wobsoriano

    7 ай бұрын

    doesn't hurt to have knowledge still

  • @furkangonulal1355
    @furkangonulal13557 ай бұрын

    I love how you did say several times " dear windows users, you do need to use the windows subsytem for linux "

  • @BeniLB
    @BeniLB7 ай бұрын

    58 sec ago :)

  • @SohailKhan-tc8uz
    @SohailKhan-tc8uz7 ай бұрын

    1st

  • @zouhairsahtout9682
    @zouhairsahtout96827 ай бұрын

    I learned HTML and CSS JavaScript in the past and now I want to move to the backend but I dunno what should I learn Nodejs or Bunjs, my plan was to start Nodejs. What do you think guys

  • @TraversyMedia

    @TraversyMedia

    7 ай бұрын

    I would stick with Node. Bun is too new and they are compatible in many ways so if you learn Node, you will catch on to Bun later very easily

  • @zouhairsahtout9682

    @zouhairsahtout9682

    7 ай бұрын

    @@TraversyMedia Thank you so much, by the way I am doing your JavaScript course. It's really amazing I like the way you explain things, with documentation.

  • @DotcomL
    @DotcomL7 ай бұрын

    As a C++ dev... I'm pure jealousy

  • @ShayansCodeCommunity
    @ShayansCodeCommunity7 ай бұрын

    Sir please can you make a crash course on Laravel 10 + blade and SPA (without Laravel and Splade) use pure js.

  • @regilearn2138
    @regilearn21387 ай бұрын

    Please do REACT HOOK FORM course.

  • @clintkennedy8387
    @clintkennedy83877 ай бұрын

    Why is using focused tools a bad thing vs a kitchen sink tool? Also to say node is "only" 13req/s ... what sites are you guys building that need more than that?

  • @noherczeg
    @noherczeg7 ай бұрын

    Please don't import React as default export, it's totally unnecessary since version 17.

  • @walnutsandbeastiality866
    @walnutsandbeastiality8667 ай бұрын

    Bun...? 🤔💭 ,,But now I'm done, now I'll get back to making puns about Kim Kardashian and Her two-ton buns of fun. So gargantuan that they block out the sun." 🎶 (The Key of Awesome's Parody of Eminem's song called "Not Afraid")

  • @fabrice9848
    @fabrice98486 ай бұрын

    Who uses Windoze in 2023? And WHY???

Келесі