You. That. Was a really you, know turning. It on is always helpful so, um. My, name is Tiffany I'll be the room host for this morning um. Before. Lunch and, we. Just have a few announcements to, start out with before we introduce the speakers oh the. First thing is um if everyone could please silence their cell phones and anything else that might make noise during the presentations, and, also. If you, can move to the center or. Make. Room for people to come in who are coming in late even, just raise your hand if there's an empty space right now we have plenty of space. If, anyone has any accessibility, needs that, they need help with please approach, any of us as volunteers, and we'll be happy to help, after. The session, there will after, each session we'll have a Q&A, and. Microphones. Will be passed around, so. If you can speak into the mic it will help for recordings. And. If you could hold the questions until the end of the session there will be time to. Answer. Those. Also, just a reminder that there is a contributor. Day on Sunday and we'd love to have all of you come. And. And. Then. I think we'll just go ahead and introduce our first speaker, Naomi, Bush she's. Presenting. On working, with WordPress and external, api's. Naomi's. Been working with WordPress as a professional, developer, since 2005. And you, can currently find her over at gravity plus Pro where she specializes, in using WordPress form builders to quickly deliver custom, business functionality. At, a fraction of the cost she, contributes, back to the WordPress project, through the core code documentation, free. Plugins, organizing. The WordPress. Developer. Meetup, organising. WordCamp america atlanta and speaking. At work camps we're, very happy to have her here. Good. Morning. Good. Morning. There. We go all right I think. We need to turn this off. There. We go all. Right. Okay. So. I. See. We still have some some, feedback, here. All. Right. Excuse. Me. Okay. Thank, you all. Right. All. Right so I am indeed. Naomi. C Bush and I will be your facilitator for. This morning's, story, time all. Right. So as I, mentioned I do work, with with. External api's. Basically. Connecting, WordPress with the outside, world helping. Businesses, make sure that their data can get to and from their systems, and that they don't have any. Silos. Specifically. My company gravity, plus I. Build. External. Integrations, for a little. Form, builder you may have heard of called gravity, forms all. Right, all. Right so since the connection, is always coming, from WordPress. That's, how I like to think about it the connection comes from, WordPress, then, the first thing that I always do is I make, sure that I am. Making. My H I'm, sorry making my API calls, through, the WordPress HTTP.
API, Is there, anyone here that is not familiar with the HTTP. API. Anyone. Okay. Don't. Be afraid you can raise your hand I really can't see much okay, there we go all right so basically. The. WordPress HTTP. API is a, way for you to make X, ternal api calls what, it does is it takes your data, it does a little validation. Some. Formatting, and it will send the request it will choose the, correct. Transport. Method, based on the server that the code resides, on so there. Are multiple ways to send a request and HTH. Excuse. Me there are multiple ways to send, a request in PHP, the. Wordpress api will, choose the correct method and then when, it gets the response back it will do it. Will do some light formatting, ok so that's that's basically it it's, a wrapper, around sending. API. Calls so, I make sure that all, of my API. Calls use, that API a lot, of people when they're working with external API, is they, will go and just, grab you. Know if the API. Has a PHP, library, they'll go and grab that and make. The calls directly through that but I'll get into a little bit about why I don't, do that ok. Alright, ok. And, also if you are building integrations. For public consumption that is absolutely. The best way to go, again because that code, is going to be residing, on, many. Different servers that you do not have control over ok. All. Right so. Stripe. Stripe. Was, my very first teacher, alright, almost eight years ago that, is where I cut. My teeth that, is where I learned a lot of my lessons, and I am still learning lessons. Through, strike and it's. Almost like who would have thunk it because stripe was just so simple alright. If anyone here has worked for stripe you, remember stripe from the from, the very beginning, beautiful. Beautiful, beautiful API, alright. That's how it started out I mean it was it was a developer's, dream, that, particular API. Caused. Me to say you know what life, is too short to, work, with difficult api's. Ok. So. Back when I was doing client work there, was an organization that. Used. WordPress and that's, how they process their membership dues every year ok so we were using PayPal, at that, time and, we. Were looking for something a little less error-prone. Ok at that time. And. So I'd heard about this new payment solution called stripe, I checked, it out it. Was for developers, I said wow this is great we're, gonna use this it looks great, so. We. Were using gravity forms and I contacted, the makers of gravity forms rocket. Genius you might be familiar with them and I said hey will you build this integration for us and their, response was oh. Yeah. Maybe. At. Some point not, at this time, and. So I'm like well I kind of need this so what did I do and. Anybody guess what did I do there. You go I wrote it myself you, know I just said ok. And so. The. Stripe API like I said at that time was, beautiful, life, was, good right I mean the documentation. It was just simple. Beautiful. Easy to read. For. One they, also use their own API, and, what, you find is that when a developer uses, their own stuff it, tends to be a little bit better ok, so everything, that they had built was built on top of their own API. They. Had a PHP, library, right which was perfect, API, documentation. Very. Clear very easy to read alright so those are kind of hitting some of those spots that you're looking for, they. Also and this was the plus right they who, here remembers campfire. He. Might hear you so they had a developer, campfire, where all of their developers, would hang out all, right and answer questions, and that's how I got it got, the chance to to. Meet some of them and I ended up actually working for stripe for, a little bit and, so life was good all. Right life was good and then, right.
Of. Course. I ran into my first issue. Excuse. Me you guys are not seeing any slides. There. We go. All. Right all. Right so ran. Into my first issue so. What happened was they became popular all right and as more and more people started, building, integrations. For WordPress. What. Do you think happened, let's. See can anybody anybody guess what happened. Okay. So if, we're, all using the same PHP. Library, alright we're just pulling it in from stripe using that PHP library, then. We're. Gonna have collisions, right because it wasn't namespaced, at that time all, right so my plugin here it is it's been sailing, it's been working for so long and then all of a sudden I get these supporting. Emails saying that your, plug-in is causing, my site to a fatal error and, I'm like what, and. I'm looking, and I'm like okay and so. That's when you start you, know looking at the environment and what do I see I see other stripe plugins and we're all just pulling in the same library all. Right and so whoever gets there first all. Right they get priority, and then if my plugin, is being loaded second, well there it is, fatal, error because, of Naomi's. Plugin all, right and it's the other way around if if theirs is loaded after mine all, right and so you may, say okay that is very simple to fix all. Right you'll, just check and see if the library already exists. Right. Can. Anybody tell me why that did not work. There. You go versioning. All, right so a lot of people at that time they. Weren't updating. They. Weren't updating, the stripe library, right they weren't even up it was just an add-on you know to whatever other product that they had so they weren't keeping it updated so, if I, simply, checked for. You. Know to see whether that library, already existed, well if they were on an older version of the library and the, features in my plugin we're using a newer version well, then we would get in error all, right so I simply, namespaced. It okay, and so that's something that I I still do with. A lot of the API. Libraries, that I work with I. Have. To go in and namespace, them and sometimes I'll do it even, you. Know just to, make sure that in the future if someone else is building something you. Know that there are no no. Collisions, there. Okay. So. The next issue that, that. I ran into was stripe, actually, stopped, updating their. PHP, library, right. So they had all these newer features, in their API and, then, I. Wasn't. Able to use them in their, library, right so I would have to create you, know my own custom. Functions there of course using, the, HTTP. API alright. And this is actually something that you will run into frequently, enough okay. In, my next case study I'm, going to show you exactly. Exactly. How I ran into that again all, right so there's. Nothing like beating yourself, in the, head over an error you know when you're like what what is going on here and you come, to find out that the library just hasn't been updated okay.
All. Right so now whenever I'm working with an API I always, check to make sure that. You. Know it covers the latest API calls, you, know I'm looking at the commit history seeing. If it's updated, looking at the bugs the. Issues on github to see you, know our people reporting, bugs and, they're not being merged. In, things. Like that all. Right. So. The good news is just. To clear their name after. About a couple of years they, did put a dedicated, resource, on that and they do keep that that. Library updated, okay, so as I started building more and more. Stripe. Integrations, for other platforms. I found, myself writing the same code over, and over and over again all, right so I wanted a way to standardize that, and so I ended, up building my first middleware, okay, anybody, here not familiar, with, that terminology. Middleware. Okay, it's, basically just a wrapper around, around. The API calls and again, I'm basically. Taking their API, calls and I'm running them through the WordPress HTTP. API but. Something actually happened, is, that. It this was actually a surprisingly. Educational, exercise. That. I learned help deepen, my, understanding, of the API, alright, so I kind of stumbled, upon that and now, it's something that I do for every API that I encounter the, first thing I do is I start out by writing middleware, why, because, it, makes. Me intimately, familiar with the calls the. Parameters, and the responses. Ok, so then when. You, know when I'm writing the integration, between WordPress. Or gravity forms then I already understand. What. What my calls and my responses, will be ok. It's kind of like in computer science school anybody, here, had to exercise to write a compiler in, order to understand, you, know how things. Work anybody know. Nobody else where the compiler okay yeah. All. Right. So. Here was the next thing that I learned I also, learned, that. These. Api's, guess what they. Can have bugs I mean, to think. Developers. Make, mistakes, you. Know so. Ran. Into a bug with the API alright. And once, I found that out that. Was actually a little bit dangerous for me all, right because then I stopped testing my points of failure and I'm like oh this isn't working you're right you must be a bug with the API and I report a bug and they're like no it's working fine for us so. That was a good reminder for me to, always, test your points of failure okay. With your API and so, the first thing that I normally do because in WordPress there are going to be multiple, points, of failure all, right so, the first thing I normally do, is test just. The API call and the parameters, no WordPress, nothing, else just the API calling the parameters, the way that I started. Out doing that was just you know basic, curl call on the command line just, to make sure that the API does what it says that it does ok because that's another thing you'll run into is that sometimes. The documentation. Is just it's not correct okay. And. So I used to just use curl on now I use postman it's pretty you know why. Not and. So once I know that I've got the API, call correct, and what type of response I'm looking for that's. When I, move to, WordPress. Okay. And. It's funny because that's, actually the biggest weakness, that I see and a lot of the API documentation is. Responses. Okay, I'll, tell you this do not trust the responses, and the API documentation, many. Times they, are just. Wrong apparently, it's very difficult, to keep up with and. To keep updated, in the documentation. Responses. I don't know why but, all. Right so then I said I'm. Sorry so then I test the API call in in. WordPress, so, remember I said that I use the HTTP, API and the, HTTP. API will do some, validation, and some, formatting, okay, and that. Is another instance, where I have, beat, myself, in the head all. Right over what is going on I know this API, call is correct, what is happening, and it, will be something. You. Know it will be something that WordPress is doing some formatting, that I need to that. I need to adjust for okay, something, that they're that, they're formatting, there I, actually. Recently had an issue with stripe where. One. Of my API calls, specific. API calls for a stripe, connect was, being rejected and a customer, actually found this it was only that API call for, stripe connect and we're like what is going on and it, was because of the WordPress header, all. Right so the default header that the, HTTP, API sends, I think it says like WordPress, slash. You, know whatever the version is, something. That stripe was doing on their side they were rejecting. The call and the. Error. Message was, you know unintuitive, you. Know didn't explain that so, that. Is something to look out for and that's why I always test the API call first.
Outside, Of WordPress, and then, and. Then I test in WordPress with with, the API. Okay. Another. Thing that I learned with stripe is that services, that use their own API. Going. Through their dashboard, all, right with the inspector, on can actually be a great, way to find, undocumented. Features, okay. A lot of times you'll find with these, guys is that searching, is one. Thing that. You. Know they're they're vague, on if you look at their documentation, they won't tell you all of the search parameters and, you'll, be looking to search on one specific thing and you're, like gosh you have to be able to search by email, you know just simple things and. So if you look, at their dashboard, and you look at the inspector, you'll actually find a lot of undocumented. Things in there and there. Are some that I still use years. Years, later and. You. Know I love it okay. So. If, you notice in the beginning I said that strike. Was simple. All. Right well over. The years that. Has changed we. Are in, the, dark ages. All, right of stripe basically. You. Know they've added so many more features things. Are, not. As simple the. Payments. The. Payments industry, has, changed basically. Europe, has GDP, ardh payments. Okay, and so things are, things. Are a lot more difficult, and message. All, right that no longer exists, if you're good enough you can build it yourself but. A simple way is just a set a reminder. Set. A reminder to look for changes in the API documentation. Another. Thing that you can do is. Sign. Up for their email lists, okay if they don't have one ask for one, years. Ago I was famous for that if I went to an API they didn't have any kind of email list they weren't you know letting developers, know what was going on I would ask okay. It doesn't mean you'll get it it, might take some years to get it but eventually. You. Know if there's enough traction they will come around okay. And another thing that I want to say when, it comes to changes, if there is anything that is. You. Know backwards, incompatible. Migrate. Okay, migrate. Your customers, and this will be people you. Know who are building, these things for public consumption, you know if it's just your internal, company you know you may be able to get away with that but if you're working with customers make sure that you migrate, them okay, it's not that hard. It's, that difficult. Honestly. Migration. Routines are probably one of my favorite. Things to build, okay. So. Migration. Migration migration, okay. That, is one, thing that will. Engender. You much goodwill all, right with those that are that are using your products. Okay. Alright. So this. Next one alright, podio anybody, here familiar with PO do anybody, here heard of podium okay, so, PO do is. It's. Significant, for me because I spent, a lot of my time banging. My head with, this particular API. Okay. You, know from the outside the documentation. Is deceptively. Simple. And you're, like oh yeah this will just work perfectly, and then you get in there and you realize that the. API, is incorrect. The. Documentation. I'll say the documentation. Is incorrect, and you're making these calls and you're like what is going on and then, you just start you know you get into that phase where you just start throwing things against the wall to. See what will work and you happen, upon something, and you're like okay like. What what is going on. So. With. PO do PO. Do is the one where. They're. Documentation. As. Well as their PHP. Library, was out of date, okay, so I had just pulled it into my project all. Right oh this is easy just pull in you know their their PHP. Library I pulled it in we're using it and then we're getting bugs and I'm like okay. What, is going on here and so. I go I look at the github and, I see that some people have. Reported some issues something, like okay so I go in and I you know pull in the pulling. The changes myself and, we're going good and then. Lo, and behold, let. Me tell you what happened. They. Discontinued. Their, PHP. Library, how. Did you do that who, does that, you. Know it'd be different if it was some you know arcane, language but, PHP. I mean come on now they, discontinued. Their PHP. I mean it had a no it has a notice, on there on github and everything that it is discontinued. And they, are going to keep. Updating. Their other libraries, but they are no longer servicing. PHP. So. That. Is one. Of the reasons why when, I was talking about middleware, that I always recommend that, you just go ahead and, build your own wrappers. Okay. Not, only are you. Are. You using the internal WordPress. API. But. You're, also insured, against. People doing things like discontinuing. Their PHP, library, oh gosh. All right. All. Right so. Salesforce. All, right so Salesforce is an incredibly, popular CRM. Who here has not heard, of Salesforce. No. Okay. Maybe just one or two okay all right so Salesforce, is an incredibly, popular CRM.
They Are huge, I like. To think of them as Medusa. You. Cut off one head. I mean others. Spawn. Okay. I-i've counted at least ten, of what they call clouds. Which. Are, their. Product, divisions, and I know that there are more and. I'll just tell you that I found this out after I, got, into Salesforce. So. Basically they grow by acquiring, other companies, and then they figure out later how they're gonna graft them in so. When, someone asks you you, know do you work with Salesforce I, say well which one right. Because there there are just there's, so many of them and then. You. Have for. Some of them you have to API, so you have an older SOAP API you. Have the newer REST API that. You that they want you to transition to however, their kicker is is that their soap API isn't, completely transitioned. To rest and so you have some calls and soap and some, calls and rest right. Boy. All, right and then. Sometimes, when you go in the REST API Doc's, will point you back to the soap, API, Docs for figuring things out so it, sounds like fun right. All. Right and so I would say that after this experience I, came, to the conclusion that most API. Doc's are simply mediocre, okay, live with it that's, what it is most, API Doc's are just going to be mediocre all, right so you're, going to learn to. Bang. Your head a little bit all, right we'll, try to do it as little. As possible but, you're, going to learn to bang your head a little bit and, I'll. Get to my. Last case study we'll talk about some other ways to to mitigate that all. Right so, a Salesforce, I've worked with four different, four, different API, so, far and I expect, that number to rise all right and each API. Has a different, method of authentication. Has. A different, way of even getting access, to the API because some products, they just will not provide you access to okay. So, if you know Salesforce. Can get, to be very pricey okay. We're talking about thousands, of dollars per month and so. And. Then, even with that sometimes, they will not provide you with access to the, API unless, you pay even more okay, so, let's talk a little bit about. About. This so, I found all of this out after. I, took, over the gravity. Forum Salesforce add-on alright. So here it had been sitting there for about two years. Unmaintained. And, I. Came. In I took it it was still using the old soap. API I mean it was really. Out of date so. I cleaned that up gave it a little love and. Now. I'm a Salesforce person. So, the first API that I work with is their simple, web to lead okay. And. Basically, that's just where they give you a form that you can embed on your site and so what I did is I just took the endpoint, and, we. Post the, data from gravity forms to that particular endpoint, however. Since. It's not, you. Know not any kind of you know official, API. What. They have is they, have a feature where something, goes wrong you, can get. Debugging, emails okay. Which, is great which is awesome. Except. It's not because. Those debugging, emails provides, you know useful information. I mean, I have gotten back emails, that simply say this. This. Lead could not be created and you know what it says in there for the reason no. No. So. You. Know I try to steer people away, from that API as much as possible from, web to lead because I'm. Like I there's just no way for me to help you if anything goes wrong all right because I gave no no, information, you know you can try to contact. Your Salesforce, support person, but. You. Know they. You. Know sometimes they're just not not. That helpful okay. So, then the next one which, I found out is their main products. Okay, this is after years you know when you get into Salesforce, we're talking years. Of commitment, to learning all. Right and then you still will never ever learn everything. That there is to know because, they acquire, these companies, at such a rapid, pace all. Right and. So the next one is the their.
Sales Cloud okay. And so we're using their REST API for, that one, all. Right and one of the things that I found with Salesforce, integrations, and. Other integrations, is that, some, people like to use usernames. And passwords for, authentication. Okay. I will. Recommend, as much as possible do not use usernames. And passwords, okay. If, they have it available always, use OAuth, okay, always. Use OAuth it's much. More secure, all right because they are connecting, directly, to to. An application, on their account they can revoke, those. Things there are tokens and keys that will refresh okay. So. You. Know so that you're not storing usernames, and passwords in, WordPress, okay. All. Right and so then the third product, that, I work with for Salesforce, is, marketing. Cloud and how, I found out about this one was through a customer, so, a customer came in and said hey you know does this integrate, with marketing cloud and I'm like, well. Does it have a REST, API yeah. I think so and so I go and look it up and I find out that the marketing. Cloud API, is different, than the sales cloud. API. So no. We. Did not integrate with marketing cloud at that time it, was completely, different and, that. Was one of the solutions, that they are really really tight on giving. People access to there are no sand boxes. You, know so you can only test. With the actual, data, okay. And then the fourth one is. The Salesforce, part. Dot. If. Anybody remembers par dot it, was, another. Acquisition of, Salesforce, it was just part out and so now it's Salesforce, par, dot and, you. Know their, API is completely. Different, alright completely, different website completely, different set of documentation. Completely. Different way of authenticating. Ok. So. That's. What we've done with Salesforce, Salesforce, has taught me a lot a lot, a lot a lot. Alright, so. The. Next one is, I. Had. The bright idea you. Know I came across this. System. Here it's an open source marketing, automation system, called modoch and I, said oh ok. Open source I love open source let's integrate the two alright very bright idea. Except. It wasn't ok. And here's why, ok. And by the way mark just, got bought by Drupal's. Parent company I mean if anyone is its familiar with that all, right so open source - open source PHP. - PHP, what could go wrong, well. Open. Source - open source that's. What could go wrong, PHP. - PHP, that's, what could go wrong, and. So what, happens is when you have two open source systems, that, means that you basically have, control of, nothing. Okay. And when you have control of nothing, the. Number, of errors and things that can go wrong just it's. Just exponentially, through the roof and then when you're trying to support that that. Is an even bigger nightmare, because you have to determine okay is, it on the the, WordPress side all demotic side because people install, their own WordPress, people. Also install, their own modoch. As a matter of fact more people are going to install their own modak. Software, than they are WordPress. And, mark. Mark, is not the. Most intuitive, and the easiest thing to, get installed and up and running okay, and so, if they have an issue with, modoch. Is built on Symphony, and, the. Errors, that you receive, from there a lot of it is caching. That's. Probably the biggest issue that I see with Manik is caching. Alright and so they're like it doesn't work your plugin sucks it's broke you, know go. Away, and. Then I'm, like well and, so. Moderate used to have a free. Tier for. Their hosting and so I would go on to host it and I would put the plug-in on there and I would say ok look it's, working here, on. The host it so it must be something with, your with your moderate install, so, that's, something to look out for when you are integrating to open-source systems, ok, now, here is the. Here. Was I'll, say the the bright lining in that and that was because. It was another open source system it allowed me the opportunity to. Contribute, alright, to another, open source system outside of WordPress, so the, things that I found wrong I was, able to actually fix all right so I was able to go in and fix the API Doc's I was able to go in and, contribute. To to. Any bugs that I found and so that's what that's. What made it that's what made it good ok. Ok. And so, then finally after, working, with enough, of these API is you know after you work with enough you know there's only you know two or three authentication. Methods that you're going to run into everything. Else is pretty much standard for, using the HTTP, API. You, know there's just a standard. You. Know standard, calls that you're going to make with that the only thing that differs really is, the responses, and so.
I Started. Writing the same code over, and over again I. Said you know what I can kind of standardize, this Here. I am I'm using the gravity, forms API. Their, UI for. This and as, you can see people can go in choose. Their method their API URL so, basically, I just you know built in a. UI around the WordPress, HTTP. Calls ok. And. So, basically it's just so that people, you no longer have to wait for a developer, right to, build them an integration, just. About any API, they, can connect through here if, they don't want to they don't have to pay for zapier, right. So here. It is right here and so that's another one of my recommendations. I. Get. To use a, lot of a, lot, of integrations, I try, not to fall into the developer, trap you know that if I didn't build it you know it's no good so I try to use other people's solutions. And. Some. Of them and I run into the UI is probably, one, of the biggest issues okay, so I, always, recommend use. Use. The built in WordPress UI as much as possible if you're, integrating with something, like, a form builder or gravity forms that also provides, a UI. You. Know use that use. That as well and so with this particular one. So. You can add your URL your. Authentication. Method, any of, your headers, and. Then you can use a standard, format or, you can you. Can choose your own right, so there's a raw format so it's kind of like kind. Of like a postman, if. You think about it a postman, for gravity forms. Yeah. Okay. All. Right and so one of the things that we did with this is if anybody remembers, before modern. Tribe integrated, with the WordPress REST API. You, know a lot of people wanted to be. Able to submit. Posts, and things from gravity, forms and, so that's what we use there in, order to do that all. Right, well thank you very much I. Appreciate. Your. Time and you, coming to my story time I hope that was helpful. And that you got some good information and. Some things to watch out for when, you are working with with. External API so I think now is question, time. Okay. Any questions. Hi. Excellent. Talk right here, I'm. Surprising. Me oh there, you are okay so. Explain. The. Value of directly. Addressing. An API as opposed, to a plug-in. Um. Through. WordPress yes, okay, so if you're, addressing, an API through WordPress it's, gonna be in the context, of a plugin, okay. So. So. You're talking about api's, to plugin not other open, available, API, yes so I mean if you're integrating with WordPress it's going to be in the context, of you, know some type of plug-in. Or theme. But. Probably plug-in so you. Know any external, integration for. WordPress is always a plug-in. Right. So are you saying can. You clarify, that a little bit can you address other api's, that aren't plugins I guess another way to ask the question okay, so, if. We define API. Basically.
I'm Talking about these external, systems, so like I mentioned Salesforce. Modoch. Podio. Marketo. A lot of these other systems so they all have api's, that allow you to pull the data or you know send to. Interact, with the data in their system inside of WordPress now. In order to do that you're going to build a plugin okay. So you, build your, plug-in to make, the calls to that API, and. You. Build. A plug-in to make the calls to the API and, you can, interact with any any. Service, that has that, has an API, okay. So. You talked about kind, of brute forcing your way through. An. API an undocumented, API. It's. By inspecting, and kind of looking at the UI of, an app do. You run into any situations, where you're you're using those. Those. Things that you've discovered but then they disappear, because that's that's why they weren't documented, they weren't intended to be used that way yes. Yes. I have. Now. Some of them most. Of them that i that. I use i did, get directly, from from. The developers, but. What you'll find is that if they're using it you know for example in their dashboard, then it will still be there if it disappears, i would just write in and let them, know hey we were using this and, sometimes. They will put it back or they will tell you a different way to do it so. So. Yeah that, is one of the one, of the things that you run into if it's undocumented, then that gives them, that. Gives them leeway to to, pull it right, but i try to try. To use it as much as possible so. That when they see that i'm using it then. They think, twice about pulling, it. Over. Here yes sir first thank you for this talk as an integration developer, it was incredibly. Refreshing to, hear about the, mmm. Aspirational. Documentation. And. Responses. That can come back i was. Curious, to ask for, how, exactly. You, go about using, the wordpress. HTTP. Libraries. To use, a, as. An OAuth, client. Last, time I was doing an OAuth, integration. I found, that most, of the available, libraries. And frameworks out, there were. Oriented. More towards authorization. Rather. Than, connecting. Into an, API and handling the Refresh tokens, and all that so. I actually wound up not wanting, to use the, the, WordPress API directly, and having, to implement all that from scratch. I'm just curious if you have some, middle. Infrastructure, library that handles that heavy lifting sure, yeah, so. You. Know I think I'm a little bit different than what, I've seen I don't know if there are others out there but when it comes to OAuth I do not use a library, I. Don't. Really understand, why people think that Oh auth is so difficult to to, implement and they, always look for a library to. Use with that but you. Know it's I find, it fairly simple after working with it so. Much now. In terms of the WordPress HTTP. API there. Really isn't anything. In. That particular API for for. OAuth so. With that I'm just using it to make to. Make the calls so instead of curl or. Something else I'll use you know WP, Remote get WP, Remote post or WP, Remote request. And that's, that's. That's basically it and then when it comes back you know you can do your WP, Remote retrieve, body. You, know retrieve, response. But. But yeah so so off yeah, I you. Know I I, have, one that I've that I've built that I use now and it mostly, works you'll find some. Api's that. Some. Of the OAuth implementations. Are slightly, different alright so when the response comes back the parameters, will be a little bit different and I actually found that with Salesforce, so. I started out with sales cloud I built you, know the OAuth, library in, the middle that like you said handle the refresh tokens, and all of that handled. Getting the. You. Know getting the the.
Authentication. Keys back and, I said oh great you know when, it came time to plug it into marketing cloud yeah I'll just plug it into marketing cloud but it was actually slightly, different, there was a parameter. Or two that. Were different and so what I did was I ended up. Kind. Of extracting, that just a little, bit more so that I could pass in. Exactly. What I needed so that I could still use the same thing but then account, for, some. Of the differences. More. Questions. For you as. One who writes API, documentation and. You expressed certain amount of frustration with that yes. Setting. Aside that accurate, and up to date is, assumed. But. What would you like to see and technical. Documentation on, API is that maybe. Isn't missing or something that you. Found that an, idea of you've had that you haven't seen out there already, sure, so a clear. And updated, list of parameters, that's. One of that's one of the big things and then. Errors. Right, that's, a big thing for. Me is is. Errors, when you get an error back and you don't quite understand, when something is very clear if you get this error this is what this means, that. That's very, very, helpful and eliminates. The amount of head-banging time. Another. Thing is like I mentioned responses. You. Know clear. Responses. You know I. Don't. Know it just seems to be difficult, for. You. Know for people to to, give clear responses, these are the responses, that you can, expect this is the format, of the, response I've seen things and this is why I always have to do the calls outside of WordPress first. Because. You. Know the parameters will be slightly, different like somebody changed, something and then didn't didn't, update the documentation. So. Those, are those are the big things you know I think if you have those then you, know it's it's smooth sailing you, know what the call is, you. Know what. You. Know what method, to you so whether it's a git or a post. And. Even standardized excuse. Me standardized. Standardization. Around, that would be great you know some calls or gates some calls or posts, and it just doesn't make sense. Yeah. So. Thank. You. Yes, good. Morning good morning great talk thank you thank you my. Question is a little bit higher level but um I just wanted to get your opinion on your, thoughts regarding a. Downloadable. Plugin versus a hosted, plugin and whether you've had experienced. Opportunity to actually host plugins, as well and maybe. It's resolved. Some of the you, know pains, associated with migrations, or or versioning. And things of that nature sure. So. So. I have to say I've never really heard, the. Hosted, plug-in on. Terminology, so. If. If I can clarify do you just mean a sass, where. You're hosting the functionality, on your server okay, so, that was actually. As. A developer, you definitely, prefer that you know you prefer as much control as possible but. Then the customer, prefers as, much control as possible and so, when you're talking, about things like Salesforce. Where, we're in the enterprise, you. Know they want control over their data a lot of things are sensitive, so the, original, Salesforce. Ad on the first versions. The. Original gravity form Salesforce, ad on the, first versions, of that actually, sent all of the OAuth calls, to, to. The author's server, alright, so all of the OAuth calls went to the author's server and then from. There. You. Know he took and he, went, and got all of the authentication, information well. What, happened was he was no longer maintaining, the plugin and there was failure at that, server and so people that were connected to Salesforce, they weren't able to they. Weren't able to authenticate properly, so. You. Know I think where it makes where, it makes sense and you can get away with it. You. Know a sass, is definitely, preferable you know hosting, you know some of the difficult, functionality. For. You but I always try to protect, the customer, as well so that they know that. They. Know that they own this they own their data I'm not going to be looking at their data I don't have access to their data ok. Yes. Sorry. When. You're, working with an SDK, that. They. Eventually just abandoned, and do, you find it better to, shim. The pieces, that you need or, to just go ahead and write your own library, for the parts that you need to. Interact with their their service yeah I just go ahead and I look at the I look at the API calls directly, and then I just just.
Mapped Those in WordPress rather. Than trying to take from theirs because, yeah. That's. Just for me me personally, Thanks. I think, you were a very. Interesting talk, my. Question is a little bit more philosophical. From. Your experience, with working, with so, many different api's, like. Salesforce. Drive and all. Other others. Which. One of those were. Most, pleasant, to work with and and, why, what. Developers, behind that API did differently, than developers, behind other. Guys this. Is the first part of the question and the. Second part is how. Do we. As, developers, avoid, building, things. That. Like. So hard to maintain and, then age like for example that, you mentioned Salesforce. That had has, two api's, and, it's. Basically. A nightmare to work with if you need some portions, of one. And some portions of the other. Okay. So I. Would. Say stripe, will always forever be my, shining example, stripe, in the early days and there were several things that they did right so. The simplicity and, I, think a lot of that came from because they were very hands-on in the beginning so when they were trying to gain traction for their service, tax. Rate they would hunt people down and say hey meet me in a coffee shop all. Right and I'll, and, get stripe installed for you right there so it had to be very simple. The. Documentation. Was was, very clear. There's. Some documentation that, looks like it was written by developers and so I would recommend always. Getting, another eye on, it, always having someone from outside of your company tried, to use. Try. To use your API try, to use your user. Documentation. So, getting you, know an outside, look at it and then the third thing that I believe. That they did very very well was, the developer, experience, and that was with that chat room, the. Chat room was was awesome and I have seen some other companies, do that so for example Marketo they, host a. They, host an API developer. Where. They call it webinar, or something Q&A. Session every week alright so every week you have some place where you can go and ask questions, I think that is that's, one of the biggest things that a lot of people miss. Because. You can get really, good feedback and see where people are confused, and then be able to address that in, your documentation, so, in, terms of developer, experience, you know I think those are the things that were done very. Well. What. Was the second part of your question I'm sorry. Okay. All right so, that you you think that covers that okay great, I. Have a question, on the flip side so, you don't have to name names but. How, have you developed a threshold for when - nope out and back away if you have that option to say you've, done a great job when to get creative but when to say no this isn't gonna happen, do you have any reflections on that sure, so I, mean one very clear thing is if they don't have a REST API I. I, back, away so I'm not really, not going to work with anything else and. I. Think. There. Is one one particular API, that eyes just simply refused to work with. Sandboxes. Is a big thing if. You can, get a sandbox, and I would say the complexity, of how to get. A sandbox. And how how. To log, in to, those. Sand, boxes. But. Yeah you know you you. Can kind of look at the documentation, if they don't have documentation. You, know that's kind of a red flag sometimes. They'll keep it you know behind lock and key you'll have to ask and they'll send it out, you. Know so but it's just you, know something to to consider. But. But, yeah the, rest really, rest is kind of the. You. Know kind of my my, threshold there. That's. It okay thank you so much. All. Right. Shannon. Get started. If. You could just make sure all of your cell phones are turned off and. Possibly. Move to the middle of the room or just make sure that there's room for people who are coming in a little bit late and. If. Anyone, needs, any, accessibility. That. They if you need, anything at all just let us know just, contact someone in a red shirt. There. Will be a QA after, the session so, if you could hold your questions until then we'll have someone come around with a mic and. Also. Just a reminders. That there's a contributor, day on Sunday, and we'd love to have you come to that and, also. If. You haven't picked up your t-shirt yet they will be at the swag table in the sponsor room downstairs on the first floor so. And. It's. A quick introduction, for. Shannon, Shannon. Smith is speaking, on just enough react for WordPress, she. Is a platform, services, specialist, with wordpress.com. VIP, she. Delivers content solutions.
To Some of the biggest names in media marketing, and enterprise, Shannon, has over 15 years experience in open source web development, she's. A longtime supporter, of diversity, accessibility. And internal. Internalization. And. Internationalization. Sorry. And, was, a wordpress, montreal. Community, organizer, for seven years, Shannon, is also a hiker poet, and a mom of four. Hi. Everyone um welcome. To just enough word react for WordPress. I'm. Really excited to be here and thank you for coming this is. Me like Mike was just mentioned I work at. Wordpress.com. VIP, and my job is to health support. Developers. And. How they're using WordPress. Generally, and the new block editor as well, and just. Help them use it better um, but. I also have a background doing a lot of freelance work which is what I did before so. And. I've been involved in the WordPress community for a really long time and one, of the things I really like about WordPress. Is that it has a really nice on-ramp. You. Can get started with just a little bit of knowledge and ramp it up really easily and. So. One of the things. About. WordPress. And I just started out is you didn't really need to know a lot of PHP, although of course it helps you. Just needed to know enough and that. Would help you. Start. Off maybe just getting your theme started, and then maybe you would write a couple, of functions in, a theme and then maybe you'd write a simple plugin and, then maybe a, more complicated one and, then that could be an on-ramp to. Contributing. To the core part the, code part of WordPress, core and. And. So it was really nice, strategy. To get started with something really easy and so, what I wanted to do with this talk is do the same thing with reaction, because I think when. Gutenberg. Or what we call the blog header now was first announced a. Lot. Of developers were worried that they'd have to learn a lot of new technology. And they might be behind. And. Really, it's not quite some tire and so, this talk is intended. For people who haven't used the blog header too that much but, really want to get started right away. Without. Doing a whole bunch of course work and. And. Get. Their hands wet you know get started and.
So, This is the beginning of the on-ramp for react. That's what this talk is intended, to be um. A. Couple notes about this presentation I will make all the slides available. So, you can you don't have to take too many notes and on, each one I've. Put little references, and links out, so, that when these slides are available you can use this as a learning resource and. You. Know in the spirit of good attribution, but also as, a way to learn more so, if anything really appeals to you. You'll. Have all that information at, your fingertips so. The. New block editor. It. Was originally. Presented as Gutenberg, but now that. Gutenberg has just been, added. Into WordPress core we're just talking about it the, block editor because. It's just right there and, it's. A new post and page editing experience that, makes it easy to create rich posted, layouts and using, blocks and it's. Sort of like the newest evolution, of WordPress because it's not, such. A big difference but especially from the user point of view and, it just makes everything really a lot easier. And. I. Like, it it's a lot of fun I use it on my own blog of course as well as that work. And. So. Just, a couple of, really. Nice features is that you, can use it to guide content, creation and you, can use it sort of in the place of or, in, addition to some. Of the features that we've, all used. In WordPress up until now so a, custom, post type shortcodes. Meta, boxes. Sometimes. Widgets, as well all. These little features, that have allowed you to add content in special. Ways for special sites you, can now use the block editor to do that and it gives the user a lot of control but it still allows you to have a really uniform. Professional, experience. So. It, helps me WordPress, like. A really vibrant easy. To use really. Performant, tool, and. I. Mean, I hope you've all seen the block editor but, just to illustrate the. Concept, I just have a couple of slides of how. Pretty it looks because. What it's allowing, people to do now is do a really, beautiful. Magazine. Style layout without. A lot of code so the user really has a lot of control. They can really produce something really beautiful, and. They don't need to know a lot to be able to do that so, we get nice images. We. Get beautiful galleries. One, of my pet peeves before, was, pull. Quotes full, coats were always hard to sort of organize they always looked a little bit, off. In certain conditions and now you can just sort of move them around in, editor and just have a really seamless experience. Which. I love. But. How does it all work and. How. It all works is with react so. I'm just gonna give you sort of a basic, introduction to act for. Pianist. React. Is that very, core, a JavaScript. Library so it's just a bunch of files that allow. You to do. Things with JavaScript, but, also, it's a tool for building user interfaces. So. It's what powers the. Back. End editing, experience and. React. Is an open, source product. It's built by the people at Facebook originally. But of course it's a community. Project now so anyone, can contribute to it and. What, it does is it creates. An in an in-memory. Data, cache, and. Computes. The differences, and. Then. Puts them into the Dom for easy, access and it uses JavaScript, or maybe, uses a JSX and. So. That's sort of a very. Simple, overview, and. I. Think it was 2015. At the state of the world that matt said everyone. Should learn JavaScript, deeply but. Sometimes, it's hard to get started so I think when when, I look at all that online courses sometimes it's hard to see. You. Know what is less, than number 15, gonna bring me because, it's hard to see the final product but, when you look at blocks and you want to use them right now you, can see the finished product right away so. One, of the examples I like to use is if you're using blocks. For example for a recipe, site you. Can see each block is a different type of content, you could have a block or say ingredients, another. One for directions, one, for the main photo and, then. Another one, um you. Know just a description of your. Experience, cooking for example and, all of these pieces of content can be different blocks. So. You, can use. You. Can get, started. Building blocks, to do each of those components a little, bit easier than you can learning, how to use. React use in one of these online courses because you can fin that see the finished product, you. Know what, an ingredients, block. Is supposed to look like on your finished blog and that makes it easier to build it it makes it easier to design all the steps that you can use to get there in the first place. So. Blocks can be seen sort of like plugins. You. Can put core behavior into blocks or you can put sort. Of custom, behavior plugins. Into blocks and what. It does is it separates, all, of what you're doing into two layers an editorial layer and a data layer and the.
Way It's done is that what. The, block. Editor is is, effectively. An, abstraction. Layer between, react and the, WordPress we all know and love so that's what we, built as the community, when we built Gutenberg or the block editor we. Built an abstraction layer that, makes it easy to use. The. Block editor with what we already know and. I was really impressed when I first started playing around with it because it's it's, pretty intuitive, it, uses the same sort of coding, I. Don't. Know um, strategies. That, I'm, used to as a wordpress, developer and. It's. Very, intuitive, so I think it was really well done and. What. It does is it divides these and sort of two components, so this is just sort of a diagram that illustrates that, in. One sort, of column, is all. The processing, involved in react, but. The front-end is completely separate so you don't have a performance, hit when. You're using the block editor it's completely independent it's, really in the backend but. Also even, if you're using, Gutenberg. With really large teams. On WordPress VIP we work with people who are using. A, Guttenberg, in an editorial environment, for example and they might have hundreds or thousands of editors editing. Content on a single site at any given time, and. They're still able to use this a still performance, system. So. I'm going to show you some code bits and but I'm not gonna go through it line by line the. The point of this is just to illustrate that it doesn't take a lot to get. Started so, this is how you would declare a block type and this is a really simple one this is just a hello, world block type and it's just to show you the different components. In it and. It's. Only really a few lines of code so it's, possible to to, create this I would. Point you to the Gutenberg Handbook, which has some sort, of prototypical. Block. Models. That you can work, with copy, and also download other people's blocks and see what they're doing just. To get an idea of what's out there but, basically it's just these few layers. And. Once. You have this sort, of. Model. Set up and there's, also an entire talk on this also at this event so I encourage you to attend that as well you. Can do some really cool stuff so these are some of my favorite, things about, being. Able to make your own blocks and use them my. Top favorite is reusable, blocks because, if you've ever had to copy, and paste from I. Don't. Know maybe in your work environments, from some ancient. Outdated. Version of word, and you have to copy this one sniffing of text, multiple times over, and over again you, don't have to do that anymore you, can just make any block reusable, and. Then use it over and over again I think. The best example is, if you're doing something like, like. Say you're doing some self promotion. If. You wrote a book for example you could have a snippet. Illustrating. The concepts that you're that. You're illustrating, your book and you can use it over and over again in multiple pages and. It's just ready for you already, there, another. Thing that's really cool is. Which. Is coming soon to, only workflows, so if you can with a team, you. Can have for example an editorial checklist, you know check my spelling, and make. Sure everything's properly attributed. Is, there a featured image for this post that sort of thing so that's something that's coming and that's, gonna make it really helpful. To have a really professional smooth, looking, website. As well, another. Thing you can do is have at an ad aware editorial, experience, so the people who are adding the content you can see where ads will go where. There's a mismatch where. That could be improved and, that sort of thing and you can also do block level locking so I like this feature because if you're doing something like a recipe. Site. And you want to for example always, have ingredients, always have directions, always have a title you, can make sure that those blocks show up all the time but maybe, you don't need a pull, quote in that situation, so you don't have to include that so, you can have a lot of control. As a theme develop, over over. What is shown to, the user and. Encourage, them to fill out all the fields that are necessary but take away all the stuff that just adds clutter. And. I. Think, Gutenberg. Is really large so when it first came out as a plugin I. Like. Ran it through clock which is a little open-source power. Application. That lets you see how many lines of code is, in something and it's kind of giant it's.
A Lot. Of lines of code but the, good, thing about using it right away is you don't need to really look at all the code you don't really need to start you just need to start with playing. Around with the blocks themselves. So. Even. Though this can seem intimidating, it's, not really. So. React, itself. Like I said react, is a JavaScript. Library for, building user interfaces there's, a lot using a lot of open, source projects. How. It works is that, use, Jason, literals, and. These. Are really simple because they're declarative, and they're, human readable so they really give you, like. Sort of a something. That you can understand, right away even, if you're not quite sure how to put it together yourself so. What I've done here is I've I've, written, a jason, literal for a t-shirt. So. It would be a this, would be for my company t-shirt so it would have my logo on it yep your logo it would be navy blue, and. It would be size large and, long. Sleeves false boolean, so. You can have a, series. Of attributes, and, boolean. Features, and this is like the most simple. Idea. Of a literal and it doesn't do anything but, it just gives you the idea of how its comprehensible. To human beings right off the bat and the example before is a real, one and. Basically. It. Takes, your Jason literal what what with. The people, who are developing the block editor did is they needed a place to store these Jason literals that made sense but that was also backwards compatible so what they did was something sort of unique. They. Put the Jason literals inside, of HTML comments. And one of the reasons that was done is because comments. Are really flexible there, aren't a lot of rules around, what, you can put in a comment but, it still maintains valid. Code throughout, which is which is very important. And. Allows. A lot of flexibility, but still, allows you to use. Prefer. To be backward compatible with all the different. Versions. Of WordPress out there in the different plugins that aren't used in all sorts of different use cases. React. Organizes, its data inside, an object tree, so. It's sort of in groupings, that, identify. Different. Parts, of the code so. You can isolate each grouping, and each grouping is readable, a home. So you can sort of identify what's happening. Okay, and um. So. Gutenberg isn't, HTML, but it's inside the HTML which. Is sort of like the clever, way of. Making. It accessible without, damaging. The, the. Validity of the code. And. Templates. So. Templates. Can be arranged. As a series, of block types so like I mentioned before a, perfect, example would be a cooking, blog where, you have. Ingredients. Directions. Photo etc, but another example that you might, see more often is, an. E-commerce, site where you always want to have a product image you always want to have a price you. Always want to have a description and so, you can organize these things into templates so that the. People using, the system have all the right information right at their hands but they don't have a super. Busy interface, and. Of, course you could always add things in when you need to if you're, the user, so. The template log property allows you to do that allows you to force. For, example a product price to always be available or, in, the case of my recipe blog the. Ingredient, list and. It allows you to sign specific, templates to existing, post types so if you're using custom, post types like you might for, cooking. Cooking. Site you might have one for. Specific. Recipes, but you might also want, to have book reviews on that website and you might also want, to have, some. Sort of guest interviews, for a for example and those can each be a custom post type and that will allow you more flexibility, later on to, sort them out into different types of of content. Presentation, on the website but. Still keep the, interface. Really manageable. For the user. And the, whole point is to make sure that it's compatible with what existed in the past, so. It, allows you to keep using short codes it allows you to keep using custom post types and of course it allows you to keep using meta boxes and, I think meta, boxes are really, interesting. Instance, to discuss I'm just gonna get to that in a second, so short codes you can still use them there's also a short code block so if you have a short code that exists you can just put it in and. There's. Plan, mechanisms. For previewing, them in place they're, actually plugins that already exist that let you do this now. They're. Not necessarily. All. Very, stable right now but you can still get, an idea of how this is gonna work. I'm. Custom post types you could use blocks with custom post types right now so. If you have a site that relies on this you could just build these box right in right away. So. They're supported, but, the block editor, rest. Api and, you can opt out of this entirely, if you don't want to use, the. Block editor for specific, custom post types and.
Meta. Boxes so i hear a lot of people, worried. That they've invested a lot of time into for example a plug-in that uses a lot of metal boxes and they're not quite sure how. To get all of that content. Into. A site, that uses a block editor and. It's. Actually, not as tricky as you, might think I've. Just given you a little snippet of code that shows you how easy it could be of. Course meta. Boxes can be complex, some. Plugins plugins use a lot of them but. I like to point to the example of Yost Yost, has Yost, is a really complex. Plug-in, but, it relies heavily on, meta boxes and. Yoast, right now works with a new block editor very. Seamlessly, so. I think if, if. The Yoast plugin can use it properly then you can - and. It's not, as tricky or as, intimidating. As, it could be and, this. Is definitely one of my favorite. Things. About the new block editing experience especially if you're a designer. Rather than a developer, I'm. Sure you've all seen that one website where. You. Know somebody's using a certain color palette and then when, user comes in and adds maybe, a heading and it's just a slightly off color of red and it's so jarring, and. So this way you can set a specific color, palette for. A theme. Right. Into the code and you. Can see the code just down below and it's just you know two, lines of code plus a list of hex. Color codes and then. You can set up your themes so that the color choices that are available to, users are the on-brand, themes that you want to use and, of course you're not limiting choice because you still have the you, know the color wheel option where you can choose anything you like but, the. Chances of that you know join a friend red, being used are much less. And you, still give the, user a lot of, ability. To customize. And I think the the, main advantage is you can have a really professional look because, that consists, of seeing color consistency, and fonts. Professional. Layout that. All contributes, to having a website that that, is easy to visit easy to use for, the visitor as well as for the user. And. I just want to talk about building, blocks so you can see what's. Involved as well so. This is the basic. Code. For, a block. There's, basically, a. Block. Type registration. And then, there's the related functions. And. So. Just I'm gonna just. Skip ahead just a little bit and. This is like the the block style so blocks, have classes, applied to them just like many other WordPress components. So if you're a theme. Designer in particular you, can latch. On to those classes and, do. Exactly the same things you've already already, been doing and, add. You know the colors you want the fonts you want etcetera so in, the example of a pull quote for example you can you know make that larger make that use an italic, make these a different font and, that's really easy to do. And. Then, what you need to do is put your your, block code and your theme code together. Then it works really well. So. You. Can have editable, fields, you can have toolbars and inspectors.
You Can have dynamic blocks and you, can if your once. You've leveled up past. The really basic block pass the hello world block then you can add in all these different inputs, to, make your block, really interesting. And. To add some of the features that you would see and in. For example of hope quote, so. Color choices things like
2019-11-07