Modern web apps without JavaScript bundling or transpiling: world.hey.com/dhh/modern-web-... Rails 7 minus Webpack plus importmap PR: github.com/rails/rails/pull/4...
Пікірлер: 132
@portlime2 жыл бұрын
The time of endlessly waiting for webpack re-compiling is over. This is great.
@adriantomole10192 жыл бұрын
I only used that feature only when I continued the work of other ppl. Glad I can get rid of it.
@lulakales2 жыл бұрын
Try vite ruby, you don't need to wait!
@anthonypetruzzi1582 жыл бұрын
i might not do rails anymore day to day, but i still always love watching DHH videos and him demonstrating the new hottest that will be shipped. it reminds me of the first video he ever did when he was introducing rails way back in 2004 or something. Keep up with the videos DHH... only thing I can recommend for them, is you need more "whoops" in them 🤣
@aftakitani2 жыл бұрын
This is awesome! Cant wait to put my hands on it and do an rm -rf node_modules
@bjornforsberg12 жыл бұрын
One of the beautiful thing things about this approach is that it works REALLY well with rails engines and gem assets.. which has been a nightmare (near impossible) with Webpack 👏
@jamescattanach11292 жыл бұрын
Does it? I can't get importma-rails to work in a rails 7 alpha 2 engine. How did you achieve this?
@wotok72 жыл бұрын
@@jamescattanach1129 hmmm, just sneak peeked rails 7 alpha 2 right now and it works
@jamescattanach11292 жыл бұрын
@@wotok7 not in rails engines it doesn't
@abidiqbal61222 жыл бұрын
You are a true gem David!!! Keep up the good work 👏
@KonstantinSkobeltsyn2 жыл бұрын
Great stuff. Great thinking! Working with Rails since 2012, thank you very much for your work!
@sadiqmmm2 жыл бұрын
Unbelievable. Rails has become the best framework.
@EmanueleTozzato2 жыл бұрын
Always has been!
@terryhenyo92162 жыл бұрын
Laravel: Hold my beer...
@yeco2 жыл бұрын
Laughs in Spring. But seriously though, rails is such a beauty.
@bravenetmarketing2 жыл бұрын
(looks at my Grails app ... looks at my work's Rails app) ... yeah, no, not so much, actually.
@TheJackTheLion2 жыл бұрын
@@bravenetmarketing 🤣😂🤣😂🤣Right...
@henrymendez67992 жыл бұрын
Thanks! I see that you solve things that are a bit complicated when it comes to javascript and that's very good.
@baseddepartment13062 жыл бұрын
Exiting news... I'm really looking forward to Rails 7
@pioztube2 жыл бұрын
Amazing, good job David!
@misbehavens2 жыл бұрын
Very cool. Webpack has been a pain in my side. Looking forward to moving to something simpler, especially in regards to Rails engines/gems providing their own javascript.
@een_schildpad2 жыл бұрын
Exciting stuff, thanks for the alpha preview!! Seems like some really awesome possibilities here; I'm starting to catch the vision 🚀 I'm still trying to wrap my head around using CDNs for dependencies, it feels a little uncomfortable at the moment but it might just be because I haven't thought that way before. It's certainly given me something to think about! Also, I'm definitely going to steal that bash alias of "r" for the "bin/rails" command that it looks like you have 🔥
@asadali84462 жыл бұрын
I also feel same......being in Europe most projects are very strict about using external service providers (including CDNs). I am also confused what are the options if someone is bound to provide a self compiled/hosted js libraries.
@_unknown_guy2 жыл бұрын
@@asadali8446 guess we stick to webpack in that case.
@pcorral2 жыл бұрын
This is great. Looking forward to start to use Rails 7 without webpack.
@nitrosnowbs2 жыл бұрын
Awesome! Great to see that there is now an easy way to use vueJS with rails! Hype!!
@sukotu232 жыл бұрын
How does this change adding Vue to Rails? Are there any examples of Rails 7 with Vue?
@repoles Жыл бұрын
Amazing! Simplicity is everything! 👏
@desireco2 жыл бұрын
Always wonderful Dev experience with Rails
@TheGrandWhiteFox2 жыл бұрын
Can't wait to try it!
@americosavinon2 жыл бұрын
This is great stuff David
@ppavelcars2 жыл бұрын
This is great news! Thanks!
@foobar12692 жыл бұрын
Wow love this video. Thanks for the information
@kwhandy2 жыл бұрын
that fighting image is really interesting for me. you guys fight apple but even use apple products to make this intros. I am cracked😂
@vinogradova822 жыл бұрын
This is really cool! Love Rails ;)
@JarmamStuff Жыл бұрын
I've only just started working in Rails 7 with Hotwire a few weeks back, but I must say that this Rails version + the amazing speed of Ruby 3 for esp tests - it has done wonders for the joy of developing. I did Vue on Rails for years, and it is perfectly functional, but this just feels so much smoother. Config Hell is barely a thing. Im delighted for what Webpack was able to do for so long, but I would be lying if I said I'd miss it in the light of importmaps
@AndrewOgryzek2 жыл бұрын
Very nice video! Great explanations, and I love the overall style of it. I'm curious as to why you've mentioned that you might have difficulty using JSX, when you could just source Babel, and let it know to transpile whatever you wanted it to.
@christianmartinez21792 жыл бұрын
"Modern JavaScript in rails..." You had my curiosity "...without webpack" but now, now you have my attention
@ahmad_hamza2 жыл бұрын
This is very neat!
@kannans60262 жыл бұрын
This is so awesome... Great news..
@RaFiStudiozOfficial2 жыл бұрын
Love the React Ideas
@embuscadafe28042 жыл бұрын
Tão incrível que quase chorei!
@Lucas-bh3et2 жыл бұрын
pprt
@tomasvalent38762 жыл бұрын
New hairstyle & new Rails style :) I like it. Just one question. What will you recommend for CSS (custom & lib css)? Sprockets?
@dra11y2 жыл бұрын
This is so awesome! Can the ESM/importmap gems be backported to work with Rails 6 as well?
@pyetrobr2 жыл бұрын
I luv Rails, The best framework, just missing, automatic server restart.
@rainerborene2 жыл бұрын
This is amazing! I'm looking forward to see Basecamp and HEY running on this new architecture. One question though.. Sprockets still takes care of minification?
@lubomirherko73312 жыл бұрын
I'd guess that CDN will serve already minified dependencies, if needed.
@tomasvalent38762 жыл бұрын
@@lubomirherko7331 I wonder if sprockets would be preferred to write custom css (I'm guessing yes, it works well) Then the question would be what if you need to change sass variables (e.g. Bootstrap button colors) Then you cannot load css from CDN but from your sprockets (which is absolutely fine)
@airtonbrunobr Жыл бұрын
I knowing that not going use the Webpack, I already stay happy 😁. Simply amazing. I really liked a lot. Bye Webpack!
@faizan20062 жыл бұрын
This is Awesome..
@IgorKasyanchuk2 жыл бұрын
Please make more videos like this. They are very informative and could help the community. Show more videos how you developing new things, best practices, refactoring.
@jaynews94952 жыл бұрын
i'd like my gravestone to read: "goodbye world. sad"
@muratustuntas68092 жыл бұрын
Finally. bye bye webpack, welcome importmap. I am so glad...
@Mixesha0012 жыл бұрын
Sold on leaving Webpack which was just a nightmare in certain cases. Not sold about the CDN for the librairies.
@gradientO2 жыл бұрын
Knew about this earlier via yo newsletter lol
@donGiulio2 жыл бұрын
thanks for this video, It's been released and I'm trying it now. a question is this just for js or does it affects also css?
@foxtail32962 жыл бұрын
OMG. Amazing !!!
@davosonic602 жыл бұрын
Hahahaha, loved the David vs Goliath picture
@koenhandekyn2 жыл бұрын
Very nice , but as heroku is still pending HTTP2 support - this seems key in the decision to make it a default?
@martijnlafeber10082 жыл бұрын
This is the way.
@estuardohernandez423010 ай бұрын
Pretty good video.
@jaojao69552 жыл бұрын
legendary
@dlvl862 жыл бұрын
Awesome
@l0rdxar2 жыл бұрын
it is a great video :)
@syritsyn2 жыл бұрын
HOLY SMOKES CANT BELIEVE MY EYES
@whyimustusemyrealname38012 жыл бұрын
what a tasty omakase thanks dhh
@okoni.alesre2 жыл бұрын
Goodbye Webpack!!!🔥🔥🔥🔥👍
@Spharian2 жыл бұрын
Neat! What about working on the app with no internet connection (or issues)? CDN will make it impossible, no?
@martijnlafeber10082 жыл бұрын
Put them in vendor I suppose.
@torvic992 жыл бұрын
YAY!!!
@mohamadnorouzi32782 жыл бұрын
that david and goliath picture :)
@yesyesyay84522 жыл бұрын
Leaving my job to pursue Master of Rails Development :)
@AbhimanyuAryan2 жыл бұрын
Lol
@TheJackTheLion2 жыл бұрын
I love that you see hundreds of devs using crazy IDE's or VSCode, etc all crazy looking and flashy. And then you see DHH just using TextMate 😂 This says volumes about his view on simplicity.
@chrisr2362 жыл бұрын
I didn't know browsers were ready for this
@user-od9du2wx7r2 жыл бұрын
Nice to see modern approach! But is that true that development is possible only online because of CDNs usage? Or I missed something?
@dghimsami90682 жыл бұрын
you can always download dependencies with "--download " option for example: ./bin/importmap pin react --download packages are downloaded to "vendor/javascript"
@xiaohuizhang70042 жыл бұрын
Finally, goodbye Webpack 👏👏👏
@remove_top2 жыл бұрын
wow
@terryhenyo92162 жыл бұрын
It's nice that Rails is catching up to Laravel already. Laravel is like Rails' once nerdy younger sister who grew up to be a beauty queen.
@Pau1danelli2 жыл бұрын
It’s still PHP though, which means that beauty queen sister is actually a really high maintenance diva.
@phanhaiquang2 жыл бұрын
If we change a js lib version, and few other libs depend on previous version, then we might need to manage these stuff manually ?
@jaynews94952 жыл бұрын
+ 1
@wbjxfkwsklejfde34d Жыл бұрын
🥳
@CharlesDv2 жыл бұрын
Dear Webpack: "get the f**k outta you here!".
@kickedoutonthestreets2 жыл бұрын
With CDNs, how do we customize how much lib we want to include? For example what if I only want to import just Bootstrap's dropdown from Bootstrap's CDN.
@kohlerm1132 жыл бұрын
Some CDNs (skypack does) allow you to specify an internal path of a file to load within the package. That being said, I would expect that it might be necessary to load more than one file in one request, which isn't supported in skypack
@phanhaiquang2 жыл бұрын
What if we wrapped html body with a turbo and consider html/css content as a special model? Then, do we have a “hot reload” feature? It means that what we change on server html/css code will be push to local and re-render ???
@haroldpepete2 жыл бұрын
you don't have to use npm or any javascript package manager, that part like me a lot, and app are ready to go easily
@MrKeliv2 жыл бұрын
How to add TailwindCSS in rails 7 ? I still cannot find any tutorial how to add it
@alhafoudh2 жыл бұрын
But what about TypeScript? Our rails stack has all JS done via TypeScript.
@blargh1231231232 жыл бұрын
Is it safe to assume we'd still need webpack to use something like React that presumably still needs to be transpiled?
@blargh1231231232 жыл бұрын
Got to the end of the video and apparently it does work, just without JSX.
@Frexuz2 жыл бұрын
@@blargh123123123 not really, you have to re-write all components to use React.createElement..
@sunsampicesg2 жыл бұрын
awsome cool feature, How to fit PWA application for rails application? Mobile android app TWA rails application how this technology are fit Rails application
@dmitriyobidin60492 жыл бұрын
The only thing i don't get: how hotwire will work with vue? Or we should only use one of them?
@arpysemlac6 ай бұрын
Do you ever unit test the javascript code? If yes could you provide an example how you do it with this approach?
@lulakales2 жыл бұрын
Does it save js libraries locally? Sometimes there are corporate rules, that everything must be served locally and I would consider it to be painful to save it all manually. I may be in the opposition, but I actually like to work with node modules, I find it much easier to install and use packages. The only problem with webpack might be its configuration and time consuming bundling process for development. Speaking of this, I recently started to use Vite Ruby and I consider it superb. If I understand it correctly, it uses modules as in the video for development, but bundles the code for production and is easy to configure and so all the unpleasant things gone away with it. I actually don't even use Sprockets for styles or images and am using all assets under /assets dir with Vite.
@kosnk2 жыл бұрын
Didn't know about Vite Ruby, thanks for sharing!
@pabloalejandrotapia88132 жыл бұрын
Great video, but the example doesn't work. Trix can't show the image in the show action, it only show the image in the edit action...
@foobar12692 жыл бұрын
Yesss ES6 finally Microsoft
@BrettCoffin2 жыл бұрын
Typescript ?
@jeremyward93632 жыл бұрын
Soooooo now we are removing webpacker? Just as I recommended moving from the asset pipeline bc rails 6 moved from the asset pipeline to webpacker. :sigh:
@et_matrix Жыл бұрын
I dunno I am not new to Rails but i can't able to use Vue in my Rails 7 project.
@al-mokhtar_2 жыл бұрын
but why not ruby 3 ?
@vicpra2 жыл бұрын
Just need run the app without install the packages after pull.
@udonwadon20452 жыл бұрын
This is such a positive experience from the webpacker hell this whole fucking frontend industry is going towards. I'm so tired of having to COMPILE/TRANSPILE JS!
@JustBCWi2 жыл бұрын
CDNs? What if we are 100% on premise?
@davidheinemeierhansson99892 жыл бұрын
Download the files from the CDNs, place them in vendor/assets/javascripts/, pin that.
@JustBCWi2 жыл бұрын
@@davidheinemeierhansson9989 You, sir, are awesome. Thank you for the answer, and all the passion funneled into Ruby & Rails. :)
@jajejijoju78742 жыл бұрын
Downloading the latest random JS library from a CDNs sounds like a huge security nightmare waiting to happen
@kohlerm1132 жыл бұрын
You can pin versions. You just have to make sure to use a known good version
@lordsharshabeel2 жыл бұрын
No more bundling, except of course that random third party CDN you're relying on to perform your bundling. Meanwhile, you have no insight or control over your production app's dependency graph that would otherwise be generated from an npm lockfile. Why not just throw out your Gemfile while you're at it?
@StruC2 жыл бұрын
Using CDNs for JS libraries exclusively sounds like a GDPR and security nightmare waiting to happen.
@NotVersace2 жыл бұрын
How so? These assets were already rendered to FE so nothing is accessible that shouldn't be and we can just host libraries on our own CDNs so we control the domains.
@SebastienSaunier2 жыл бұрын
I think you still can vendor the JS dependencies if you don’t want to rely on an third-party CDN.
@KasperGrubbe2 жыл бұрын
You can just vendor them and self-host.
@bjornforsberg12 жыл бұрын
You certainly can :) The stimulus-rails gem repo is a good example of how that is done.
@phanhaiquang2 жыл бұрын
I think we could add a signature or checksum hash to make browser realizes the unofficial JS lib. Just the same way if we import a JS purely into a html.
@TheaWorld Жыл бұрын
CDN for libraries .... hmmm...
@collimarco2 жыл бұрын
Great, I really hate the messy Javascript ecosystem and Webpack in particular... It goes against the principles of Rails. If other communities jump from the bridge, we don't have to follow them.
@nickm40642 жыл бұрын
Can we pretty please fast-forward to Rails 9 so all that hotwire/stimulus/reflex gunk gets spit out too.
@desireco2 жыл бұрын
ERB color scheme is jarring
@1jcc2 жыл бұрын
I'm not certain that this is the correct approach. Javascript and its ecosystem are becoming more dominant in development. Much more so than Ruby/Rails. So is the right strategy to try to avoid it as much as possible? I think the correct approach is to do the opposite. Rails needs to integrate Node and Webpack even more so that Rails won't become obsolete. Make React the default when scaffolding for example.
@kohlerm1132 жыл бұрын
Webpack shows it's age and there are much faster alternatives (such as esbuild) which skipped some old features. I think using Urls and map them to simple imports is the way to go. Just check golangs approach for modules. That being said I still think a dependency description is needed (similar to go.mod)
@lordsharshabeel2 жыл бұрын
Rails has always carried the bias of having no respect for Javascript, or anything that might sully its perfectly crafted Ruby castle.