I figured we could have a place where we share new things that we come across since there’s always a new project, tool, or an update to something in our world.
This week a new front-end framework from Dropbox called Scooter was released.
When browsing the scss folder I noticed that each subfolder had an __all.scss file that handled the imports for the other files in the directory. Hadn’t seen this before and thought it was pretty cool!
There’s also this update to Bootstrap 4 that’s going to require the Sage theme to go back to a custom jQuery enqueue in order to use jQuery 2.x.x. See this PR: https://github.com/twbs/bootstrap/pull/17494
Ustwo made their website available as open source. It’ a wp-backend, react frontend, similar to calypso type website/app. Something nice to check how these things work under the hood. The architecture diagram seems nice and informative.
As a side note, did a Pingdom speedtest and the result says their site loads in 1.8s /2.1MB.
This one’s a bit in the “Spirit of WordPress community”
Zac Gordon who helped a lot of people learn WordPress at TreeHouse ( he was fired as they won’t be supporting WP courses anymore) will be having a Kickstarter for his JS for WP master class. - http://javascriptforwp.com/
I think it will be a great way to really learn step by step the ins and outs of JS for WordPress without having a breakdown with all those frameworks/libraries etc.
For those that have/are building a saas or a huge news site or are just speed/performance geeks.
Pantheon launched a resource for scaling wordpress. It’s known that WP can handle a lot, but those things don’t just come out of the box. -> https://www.scalewp.io/ It’s managed on GitHub so anyone can contribute and it may be a really nice resource once it gets bigger.
On that topic there is also a nice site called: https://www.scalescale.com which has some WP related scaling articles.
I tweeted this the other day, but in case you missed it… Sage 9 is going to be using Webpack. This post does a great job at explaining why it’s awesome:
In respect to Webpack’s arrival to Sage, I found some prep JS articles on modules, loaders and bundlers that made really good prep for the Unpacking Webpack article above. It’s quite easy to read and understand and gives a good high level overview.
Webpack from a far away looks awesome! But closer look tells me it’s another step curve. Especially since I finally got the hang of gulp and since I do 99.9% of my work on “shared hosting” environment (so no way to have node.js running on server)… Any resources for learning webpack that are less js centered, but more php side of things?
Webpack is being used in conjunction with gulp. They are not mutually exclusive. Gulp is the task runner, webpack is the module loader. All webpack is doing here is allowing you to organize your javascript easier. Just like you would have a main.scss and import _variables.scss and _layout.scss and such: webpack makes is such that you can require javascript files from your main.js.
Node is not running on the server. It’s running on your development machine to compile your assets locally. After compilation they are uploaded to a target server on deploy.
I’m guessing a lot of it hinges on the availability of Bootstrap 4 too, that’s still in alpha ATM.
Not sure if you’re aware but you can currently play around with the bleeding edge build of Sage 9 here: https://github.com/roots/sage/tree/sage-9 Probably not production-ready I’d say, but I’m sure another tester would be appreciated
Yay. Hmmm… Since I’m now comfortable with the way main.js is organized with body-class related events firing only on related pages… Is there similar automagic in webpack that would pretty much allow dynamic organisation of js with muliple js files, just like composer does for PHP?
