Use WordPress to Simplify Your Blog Without Losing Control
WordPress. As a web-developer that word use to make me cringe… I studied Computer Science and I always looked down on WordPress developers. I thought they didn’t understand or respect coding and gave ‘real’ web developers a bad name.
Background
Like most biases, my judgement was based on a lack of knowledge and understanding. WordPress powers over 25% of all the websites on the internet and is used by some of the largest brands in the world to convey their message to their customers. These include; Tech Crunch, BBC America, Sony Music, MTV News, Microsoft News, The Walt Disney Company, Time Inc, Facebook Newsroom and Mercedes Benz, just to name a few. The team that is developing WordPress is just 449 people!
Okay so you get the point, WordPress is ‘HUGE’ and solves a very important problem for business owners, bloggers, entrepreneurs and companies. With WordPress it’s super easy to set up a powerful and flexible blog and website.
Building a CMS with a Business
As a developer, I’ve built a blog with a custom CMS 3 or 4 times using varying technologies. Every time I build a site from scratch it takes me a few weeks to design, a few weeks to code, and constant ongoing maintenance for upkeep and bug fixes.
Now that I have my own business, time is money. I use to view building these custom blogs as good coding practice, but today they just take up a lot of my time and prevent me from focusing on value-added work for my clients.
With all that being said, I love having complete control over the look and feel of my site. I want to show off my abilities using the newest web technologies possible, React.js for example, while keeping database code and logic to a minimum. Do you see what I’m getting at? If only it were possible to use the amazing CMS of WordPress while using the latest and greatest web front-end technologies. If only WordPress had an API that any client side framework could consume!…
The WordPress API
Say what! WordPress recently added a REST API into their platform so developers like myself can use the amazing CMS that is WordPress, while building out a completely custom front-end app. Thats how this site is built!
Having this architecture is cool because of a few reasons:
- Able to use the simplicity of WordPress as a Content Management System
- Use the power and flexibility of React.js or any other client-side framework.
- Completely modular and minimal: Back end on one server and front end on another.
- The backend can be swapped out with one line of code and can be hooked into any modern WordPress sit.
The WordPress API gives you almost complete control over anything you can do through WP-Admin.
I’m really happy with how the site has turned out. This architecture does have a few challenges:
- A bit more expensive as it requires 2 servers.
- Adding comments requires a bit more work, but isn’t too difficult.
- The loading time for a post is now dependent on two servers in two different places.
To get this architecture setup, first run create-react-app to get a basic React app setup. Then go and install any WordPress instance with a reliable (or cheap) host. I’m using DreamHost, but I’ve heard good things about NameCheap and BlueHost. Next hook up your React app to an Express server. Integrate the React app with the WordPress API, checkout the WordPress docs if you get stuck. Finally push the app up to a simple Heroku instance to have a production ready site.
Ongoing
I’m going to continue to use this architecture for future personal and client sites. I’m working on creating a base React and Express project, with the full WordPress API hooked up and ready to go. Now I can build a frontend for WordPress sites for my clients without using PHP or manipulating themes, etc.
Have you had a chance to play around with the WordPress API? What are your thoughts?
Are you interested in getting a web app built for your business? Checkout Apollo Studios for all your web and mobile app needs. We help with roadmaps, designs, business validation and of course, code. Contact us today for a no obligation chat about your app, completely free.
If you enjoyed this post, subscribe to my blog below! I put out an article each week on Business, Code and Design.
Tomer S
I’ve always wanted to play around with WordPress but never got too deep into it (though I have used their API to be able to display a ‘check out the latest post’ on my site before). Just a thought: does the React site need Express? If you can keep it static and it would simply call the WordPress API asynchronously, you could host it on something like S3 or even Github pages and reduce your server cost.
Wesley Vance
Thats a great point! Although I would love to do that… I’m using the MailChimp API which requires a server to call it’s endpoints. On each page I have a form to join my mailing list and it says “Join # Awesome People”. That number is dynamically being fetched from the MailChimp API. Similarly, that form is a custom form and uses the MailChimp API to submit the email (Along with some other pieces of data). So my frontend hits my Express server, which makes all the needed API calls (Both to/from MailChimp and WordPress). For my needs, I don’t mind paying the extra few bucks a month for these features, but for others- I defiantly recommend compiling your React down to a static javascript file and serving that up with S3 or GH pages!