{"id":1748,"date":"2015-07-14T10:54:45","date_gmt":"2015-07-14T09:54:45","guid":{"rendered":"http:\/\/www.jurecuhalev.com\/blog\/?p=1748"},"modified":"2015-07-14T10:54:45","modified_gmt":"2015-07-14T09:54:45","slug":"how-to-super-charge-your-wordpress-with-microservices","status":"publish","type":"post","link":"https:\/\/www.jurecuhalev.com\/blog\/how-to-super-charge-your-wordpress-with-microservices\/","title":{"rendered":"How to Super Charge your WordPress with Microservices"},"content":{"rendered":"<p>Confession: I\u2019m amazed at the authoring experience that WordPress provides. Users are productive from the first hour and UI doesn\u2019t get in their way. The story is similar for developers, if you stay inside the world of theme development. Try to do anymore complex and with tests, and it gets complicated. That is where (micro)service oriented architecture can help us.<\/p>\n<p>At the Open Education Consortium, we use a mix of all the different approaches.<\/p>\n<h2>1. Let the WordPress call external API\u2019s<\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-large wp-image-1749\" src=\"https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp1-1024x268.png\" alt=\"wp1\" width=\"604\" height=\"158\" srcset=\"https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp1-1024x268.png 1024w, https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp1-550x144.png 550w, https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp1.png 1060w\" sizes=\"auto, (max-width: 604px) 100vw, 604px\" \/><\/p>\n<p>At OEC, we provide functionality of Course search. While I could build it inside WordPress, it wouldn&#8217;t be optimal. I&#8217;ve developed it in Django with REST Framework. We get API Documentation for free and our Main WordPress site is using the same calls as everyone else.<\/p>\n<p>To call an external API, you\u2019ll need to extend <a href=\"https:\/\/codex.wordpress.org\/Plugin_API\/Action_Reference\/template_redirect\">template_redirect<\/a>, <a href=\"https:\/\/codex.wordpress.org\/Plugin_API\/Action_Reference\/init\">init<\/a>,<br \/>\nand <a href=\"https:\/\/codex.wordpress.org\/Plugin_API\/Filter_Reference\/query_vars\">query_vars<\/a> actions and filters.<\/p>\n<div class=\"oembed-gist\"><script src=\"https:\/\/gist.github.com\/gandalfar\/977af9953b9834697d7d.js\"><\/script><noscript>View the code on <a href=\"https:\/\/gist.github.com\/gandalfar\/977af9953b9834697d7d\">Gist<\/a>.<\/noscript><\/div>\n<p>This way, you can format output inside your WordPress theme.<\/p>\n<h2>2. Let the Javascript call external API\u2019s<\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-large wp-image-1750\" src=\"https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp2-1024x199.png\" alt=\"wp2\" width=\"604\" height=\"117\" srcset=\"https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp2-1024x199.png 1024w, https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp2-550x107.png 550w, https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp2.png 1151w\" sizes=\"auto, (max-width: 604px) 100vw, 604px\" \/><\/p>\n<p>This is not strictly WordPress, but it solves the other half of the problems you might have. If you don\u2019t need to have output visible to Search Engines, you can render it with JavaScript. In one example, we\u2019re showing a map of where our members are. We have a separate portal, where members can edit their contact information.<\/p>\n<p>On WordPress side, Leaflet library calls the GeoJSON endpoint and displays it on the map. The data is always up to date and we&#8217;re using the best tool for the job.<br \/>\nThis portal then exposes GeoJSON API, that Leaflet then displays.<\/p>\n<h2>3. Embed your WordPress output<\/h2>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-large wp-image-1751\" src=\"https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp3-1024x337.png\" alt=\"wp3\" width=\"604\" height=\"199\" srcset=\"https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp3-1024x337.png 1024w, https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp3-550x181.png 550w, https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/wp3.png 1562w\" sizes=\"auto, (max-width: 604px) 100vw, 604px\" \/><\/p>\n<p>For our Directory feature, I needed a flexible membership system. I ended writing it in Django with Solr. Django provides powerful form editing, that I didn&#8217;t want to replicate inside WordPress.<\/p>\n<p>What I ended doing, is that I exposed API from WordPress with header and footer HTML. That way Django can just include 3rd party content. It also simplifies keeping the themes in sync.<\/p>\n<p>I could do it using iframes, but then I would have problems with urls and the size of iframe content.<\/p>\n<p>There is also a possibility for a future upgrade. Because we&#8217;re running on the same domain, we can read cookies from WordPress. This would allow us to check if user is logged into WP Dashboard and elevate their privilages inside Django app.<\/p>\n<h2>Conclusion<\/h2>\n<p>Modern Web applications are moving away from monolithic, one size fits all, solutions. While it\u2019s common to see such infrastructure in the backend, it\u2019s time that we start embracing it also on user facing sites. I wish some of the infrastructure inside WordPress, would make it easier, but I guess that\u2019s an opportunity for a new library.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Confession: I\u2019m amazed at the authoring experience that WordPress provides. Users are productive from the first hour and UI doesn\u2019t get in their way. The story is similar for developers, if you stay inside the world of theme development. Try to do anymore complex and with tests, and it gets complicated. That is where (micro)service [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1752,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[14,924],"tags":[],"class_list":["post-1748","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tech","category-wordpress-tutorial"],"acf":[],"jetpack_featured_media_url":"https:\/\/www.jurecuhalev.com\/blog\/wp-content\/uploads\/2015\/07\/153871892_4738cd8628_b.jpg","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/posts\/1748","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/comments?post=1748"}],"version-history":[{"count":1,"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/posts\/1748\/revisions"}],"predecessor-version":[{"id":1753,"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/posts\/1748\/revisions\/1753"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/media\/1752"}],"wp:attachment":[{"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/media?parent=1748"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/categories?post=1748"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jurecuhalev.com\/blog\/wp-json\/wp\/v2\/tags?post=1748"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}