A breakdown of the most useful new features for web developers using HTML, CSS, and JavaScript. Learn about native dialog windows, WebGPU, CSS container queries, and more.

Check out https://clerk.com to build a beautiful user authentication system.

#webdevelopment #javascript #top10

💬 Chat with Me on Discord

https://discord.gg/fireship

🔗 Resources

– Web Baseline https://web.dev/baseline/
– WebDev 101 https://youtu.be/erEgovG9WBs
– JavaScript 101 https://youtu.be/lkIFF4maKMU
– Web Performance https://youtu.be/0fONene3OIA

🔥 Get More Content – Upgrade to PRO

Upgrade at https://fireship.io/pro
Use code YT25 for 25% off PRO access

🎨 My Editor Settings

– Atom One Dark
– vscode-icons
– Fira Code Font

🔖 Topics Covered

– Beginner web development tutorial
– What is WebGPU?
– Web development best practices
– New CSS features in 2023
– New JS features in 2023
– Measuring performance on the web
– How to build websites from scratch

source

37 Comments

  1. that first one hit hard, i once wanted to make something because i barely ever do any web stuff, and thought "okay, so first I need a modal dialog, can't be hard right?"

  2. structuredClone – wow! Only 15 years after lodash implemented it and liberated EVERY project on Earth from implementing its own version of the deep cloning algorithm. BTW, structuredClone also handsomely transfers objects to a worker thread. Native dialogs – cool, but will take another 20 years to natively support a stateful dialog – a modal with its own bookmarkable URL. Some of us may still be eaten by AI alive!

  3. It is absolutely mind boggling to me that the web is built on such garbage tier language. Even VBA has more sensible syntax and basic functionality.

    Oh well, maybe it won't suck by the time I retire.

  4. This is great and all, but it's starting to feel like HTML+CSS+JS is becoming the new C++. There will be 342 ways of doing the same thing, with a gazillion units, CSS rules, tag attributes and top-level functions. Oh, and all of them with their little quirks and subtle incompatibilities between browsers. Something to look forward to. :/

  5. The dialog feature works well when I use it in an html file I created from scratch. But when I tried to use it in my existing .NET MVC 4 app, I'm getting an error "uncaught typeerror d.showModal is not a function". Anyone here knows why? Thanks!

  6. That's how I feel about state drop-down menus. You can't type in MA for Massachusetts or type in Massachusetts a lot of the time because it defaults to Maine. How much time have people wasted on state drop-down menus?

  7. Just flagging that the nesting example at 4:42 is invalid. Nested selectors must be prefixed with a symbol, which is fine for classes, ids etc, but element selectors that start with letters need to be prefixed with `&` e.g. `& h1 { color: goldenrod; }`

Leave A Reply

Please enter your comment!
Please enter your name here