I just launched a new course on ES6! Use the code WESBOS for $10 off.

Strengthen your core JavaScript skills and master all that ES6 has to offer. Start Now β†’

Clearing the air: Is WordPress being rewritten in Node.js and React?

What’s up with WordPress and JavaScript? Are they ditching PHP and moving to JavaScript?

Yesterday Automattic (the company behind WordPress) announced Calypso, a new admin interface for anyone using a WordPress website.

As a JavaScript developer, I was excited to hear that it was built entirely in JavaScript. I was even more excited to hear that it was built in React, because I’m a huge WordPress fan and I just launched React For Beginners β€” my two worlds are colliding!

It seems like there is a lot of misinformation in the community. Let’s clear this up and understand what it means for us as Web Developers.

WordPress is not being rewritten in Node.js

Relax. WordPress is written in PHP, but the Calypso admin interface for WordPress is written with popular front end tools like React and Lodash.

This is part of a popular trend – use your server to just give us raw JSON data, and then build your application entirely in JavaScript to consume that JSON data. WordPress essentially becomes an API which you can pull and push data from. This decoupling of the view and the backend logic has let the developers of WordPress move much faster because they don’t have 12 years of PHP view logic dragging them down.

What about WordPress is Node.js?

So, why are we seeing tweets about Node.js? Well, almost all front-end tooling is built in Node.js. Calypso is built with popular node tools like WebPack, Babel, Jade, Uglify, Hot Loader, Marked and over 100 other modules.

This is how the front end space is evolving and frankly I’m glad to see WordPress start using them because its one space we don’t see a lot of people using these tools.

Isn’t it just for WordPress.com accounts? What about self hosted? Plugins? Custom post types?

Calypso is an editor and an RSS reader for WordPress.com sites. You can, however, use it to manage your self-hosted WordPress account. Once you enable Automattic’s JetPack plugin, you can manage your content with Calypso.

I went ahead and built a copy locally to try it out.

WordPress Calypso React App

Right now, you can only manage, Pages, Posts, Themes, Menus, Plugins and a few settings. Everything you need to manage a blog.

What is missing is an interface for custom fields, custom post types and any custom interface that a plugin would expose. This is a deal killer for most devs as we aren’t using WordPress just as a blog, but I can only assume this will be coming.

What does this mean for me as a WordPress Dev?

Right now? Nothing. But this is thunder in the distance as to what is to come in the WordPress.

Much of a theme writing I do is already in JavaScript – I often use WordPress as just an API to get data out of, and then use frameworks like Angular, React, Google Maps or jQuery to display that data. I’m not building an entire website in a JavaScript framework, but much of the interactive view layer of these sites is moving into JavaScript frameworks.

Our trusty PHP template files aren’t going anywhere anytime soon, but I’ll bet you dollars to donuts you’ll be writing a lot more JavaScript in your WordPress sites in the years to come.

It’s all about the experience

Since Calypso is open source, I’m curious to see what will come next. I can imagine developers like Elliot Condon from Advanced Custom Fields and the folks at Web Dev Studios are excited about this. This means we can build much more flexible plugin and admin interfaces which will in turn make clients extremely happy.

There is a reason why things like Squarespace are becoming popular β€” the interface for creating a beautiful website is a breeze and WordPress is now _react_ing in a huge way.

Start learning JavaScript

So as a WordPress builder, don’t rush to this, but don’t write it off – keep an eye on it.

For many this is going to be the last straw with JavaScript. Plugins and STack Overflow questions can get you pretty far, but the front end dev landscape is changing, it’s hard to ignore all that has happened with JavaScript in the last few years.

If you aren’t super comfortable with JavaScript, it would be a great time to start learning. It’s a little hard at first, but you can do it, no problem. I’ve seen hundreds of my students at HackerYou do it, and I know you can too.

This entry was posted in JavaScript, WordPress. Bookmark the permalink.

26 Responses to Clearing the air: Is WordPress being rewritten in Node.js and React?

  1. Bishoy A. says:

    Nice article! I saw this news lately but didn’t really get all the details until now πŸ™‚

  2. Rob Bazinet says:

    If you read the details from Matt, http://ma.tt/2015/11/dance-to-calypso/, it’s a bit misleading if you’re correct. It reads like React and Node.js are replacing the current code base. If you look at the Github repo, https://github.com/Automattic/wp-calypso, it has a pretty large Node component with and API built out.

    I think this is the beginning of the end for WP and PHP and we know it today.

    Did I mess specifics that said PHP is staying? I was under the assumption it was not but I’d like to see what I missed.

    • wesbos says:

      I don’t think the PHP is going anywhere. The PHP is the API. Calypso just consumes the JSON that comes from the API. Without PHP, there is no WordPress to serve up the JSON for React to consume.

      • Matt Graham says:

        I have to agree with Wes. PHP isn’t going anywhere. It feels like a similar situation to WordPress going object oriented. A good chunk of WP is object oriented, but a lot still isn’t (and I have my doubts that it will go completely).

        That being said, I can’t wait until the JSON API is completely baked-in. Which is next point release (please correct me if I’m wrong).

        • Drew Jaynes says:

          REST API infrastructure will ship with 4.4 in a couple of weeks. Endpoints are coming in 4.5, but can be enabled sooner by installing the official plugin.

    • I agree Rob, Looking at the wp-calypso repo on GitHub it is evident that they are using Express which is a back end framework for Node.js. (https://github.com/Automattic/wp-calypso/tree/master/server/build) This is not client side JS but server side js for sure. I think that the PHP world needs to wake up. We are becoming the Cobol of the internet. PHP7 is a move in the right direction but not nearly enough. Time to wake up folks; WP is moving away from PHP.

  3. Topandi says:

    I will try this, many thanks for your article sir

  4. I’m a longtime WordPress developer (10+ years) who just signed up for your React for Beginners course. With the release of Calypso and keeping an eye on industry trends in general, it’s clear that the writing is on the wall (or, as you say, “thunder in the distance”) for PHP-based templates, and front-end development in the WordPress world is going to drastically change in the coming years.

    I’m enjoying your React course so far, although it feels quite new and a lot to wrap my head around. What I’m missing is the connection between a React front end and something like the WordPress API. I’m hoping you continue to push this series forward, I think a React + WordPress series could be huge. And then, of course, theres React Native, which I can’t wait to get started with as soon as I finish the beginners course.

  5. Sba7elfol says:

    Thanks for putting things into perspective for me wesbos

  6. Brian Hogg says:

    Certainly great for really basic websites (like WordPress.com powered ones), but without a framework for WP plugin interfaces or even a framework for Calypso plugins, and the need to fall back to wp-admin for accessibility concerns, wide spread for .org sites is still a long while off.

    And even once they add support for having custom WP plugin interfaces, it means plugin devs now need to add support for both wp-admin and Calypso for regular users to be able to manage their sites effectively.

    I do hope this project helps to avoid a million different but almost the same custom WordPress admin UIs being created against either the Jetpack API or the WP REST API πŸ™‚

  7. Confidential says:

    Just a hint: if you are coding in JS, you should try coding in Typescript. It’s more than great…it’s brilliant.

  8. Seegatesite says:

    Thank you this article. WordPress trying to spread the wings from the biggest rival blogger.

  9. Francis Kim says:

    Thanks for this write up – I just had to leave a comment on another post that was misinforming. It’s just the admin that’s going to be Node.js based, leveraging the PHP APIs.

  10. Stefanos says:

    1. PHP still makes a lot of sense for the server side of WordPress, to power the API.

    2. Themes and front-end display of a blog are also still PHP, and there are no plans to change that currently. But plugins will need to evolve to be API-driven.

    3. Today you can manage and publish to your standalone WP sites from Calypso, including auto-upgrading plugins. If Calypso is successful, I could see the core wp-admin interface taking a similar technical direction in the future.

    Even though point 1 and 2 sound reassuring by Matt himself, I have my fears and my insecurities about what it’s about to come.

    Here’s the original reply by Matt: http://ma.tt/2015/11/dance-to-calypso/#comment-585110

  11. hasan says:

    “any application that can be written in JavaScript, will eventually be written in JavaScript.”

  12. Pingback: WCEU 2016 - I'm attending! - Paulino Michelazzo

  13. Spencer says:

    How does writing an angular SPA or React SPA thats powered by wordpress backend do with SEO? Since they are all rendered client-side and not server-side? Does google know how to crawl the JS and render the html to read?

  14. shakti says:

    great information about topic

  15. d says:

    how to build a simple reactjs frontend website powered by wordpress would be a cool video tutorial

  16. I’m a wordpress developer since 2008 and I bet there is something good ahead of this. Why not combine these 2 languages wordpress and node to lessen some load of the server and make good functional apps through the web.

    I bet there are many millions of WP users would be happy about this.

  17. Olly says:

    Could Calypso be configured to interface with alternative CMS’s?

  18. Erica says:

    Infi nich,thank

  19. vishal shah says:

    Nice Blog! Thanks for sharing very useful post. keep it up.

  20. This website will really help everyone in providing the tools and information necessary for the people to develop and improve their website.

Leave a Reply to Dalton Rooney Cancel reply

Your email address will not be published. Required fields are marked *