 Hello everyone. Welcome to WorldCamp Kathmandu 2023. This is the first speaking session in the hall filter. So I hope it will be a fun learning and a good start for everyone. AI has taken over the world with a storm and everybody is talking about it. And as a WordPress community and WordPress developers are also not different from it. So the topic of my session today is WordPress AI evolution. The AI evolution that is going on around the world and how WordPress developers can adapt to that to better produce their like quality of work and how they can optimize and save time in terms of like WordPress development. So this is going to be the topic for the session. A little bit about myself. I am Abhishek Rizal has introduced by our beautiful host over there. Thank you for the fun fact. I didn't know you get that way. Where did you get that from? I didn't know. Okay, talking a little bit about myself. I am a WordPress active WordPresser primarily involved in WordPress plugin development. I have been professionally working as a plugin developer in different companies of Nepal and offshore also and since 2015 and I have worked in multiple WordPress plugins primarily and other kind of teams and services as well. Currently I am working at brainstorm force as a senior software developer and you can reach out to me through social media handles by searching my name also. Okay, let's talk about a little bit of a history. So AI is actually not a very new thing. It has been used by millions of people around the world in form of different type of popular services, products like voice assistants and chat ports that has been helping businesses throughout the years and recently there's AI code assistants also available like GitHub Copilot and Amazon code whisperer tab 9. They are also available there and I think actual boom of AI in terms of WordPress and web also began after open AI and charge activity was made public. So people can actually see the power of AI through the prompt and they can actually feel like what they can do with their power of AI. So a lot of people have found it very, very much helpful not just in development but in like content marketing, SEO, all of the other things and for many fields AI has been helping out and the WordPress in the WordPress industry as a community we can also see that a lot of products nowadays are using AI. So the actual boom of AI was started after the open AI and charge activity was introduced to us. Okay, let's talk about the burning question in the internet actually. Will AI take my job? This is a question by casually worried developer I believe. Everyone is saying that AI is going to take the developer's job but I believe that you can read the statement I think there like in the history also computers when it was first available it did not replace the accountants right but it was replaced by the accountants who did not use computers were replaced by them who used it right. So definitely I believe it is the same case with AI as well like if you are a developer and you are not adapting to new technologies the tools and facilities that AI provides us with then definitely you might be replaced by someone who uses it because of the efficiency because of the time saving all of the things is there. So let's I believe that everyone should be adapting to new technologies and as a WordPress developer or as a developer itself also you should be taking use of these tools so that it will be helpful for your own career. So rather than worrying about will AI take my job let's adapt using AI in your job itself. Okay, so how do we start using AI in our day-to-day task? The very basic thing is AI can create content right we know that now because we have been seeing previews of chat GPT other kind of tools open AI services generative text and everything and it can create good content we know that as a developer I think you can make use of AI to write the website copy for your clients for example you are taking some kind project and you need to write some copy to show a demo or some sort of thing so you can definitely use that use it for that another use case would be I normally like in day-to-day task also I we use agile in our like daily workflow and I hate to write the user stories in Zira because that is not what I am like very not not very good content writer so with AI if you provide proper context and all of the things you can create great Zira user story comments get a PR comment and all sort of things so I believe content can be helpful for a developer and you can use the tools to write better and communicate better in some cases also like when I am trying to communicate something in Slack also like where while day-to-day communication in some cases if I have to answer it through little difficult thing then I take help of AI and it keeps me really elaborated and good content so that can be definitely one use case content creation the popular tools that are available right now is definitely Chargivity it also has some official and unofficial like Chrome extension kind thing and find.com I I am going to use find.com in some of the examples that I am going to show in my demo sites other because it is a free tool and it allows you to test Chargivity for model as well so this is also a good option it also has a VS Code extension that you can install and try out and this Google bar being AI and other tools as well so these can be used for content creation yeah another popular tools that can be used to generate images is is like website placeholder images if you are using like developing site for your client and in that case what happens is that if you place the proper images and everything then it like saves up a lot of time to go back and forth rather than the this placeholder images so in these kind of cases also you can use AI based tools to generate images and provide like a decent demo to your clients as well I just kept this comparison between the placeholder content and real content that can be created by AI and it looks different right so this is the way in this way how like you can make use of these tools and get better results in your day to day work so for image management there are popular tools they are both free and pro so some of the tools are open AI, dali, mid-journey, add up for five fly, magic copy, segment anything so you can take a look into these tools in your day to day like development work also and use it for your development tasks okay so coming further like you can use AI in different kind of development work itself as well right so for actual development tasks also you can actually help you find things faster debug faster and optimize your code so some of the examples I would like to show how you can boost your productivity using the AI in your development cycle the first one is code solutions so let's look into this one first see I hope this is visible I'm using fine as a tool for demo for this one but definitely this can be anything anything of your choice like you can be using GitHub co-pilot or other kind of things or chargivity itself right so what I'm doing right now is I have sent a prompt write a code to generator of basic fsc theme so there's a full side rating theme the new trend in WordPress going on like if you are new to fsc itself and if you want to learn something about it then you can make use of AI like better than looking into the dots what you can do is just add some prompt to write a code to generate a basic fsc theme and what the AI tool is doing is right now it is giving me clear cut instruction along with the code itself also with the proper header with description authors and everything as for your prompt right so and it is also explaining the steps to you so this way how you can make use of it as any new topic anything that you want to know about anything that you hear in the word camp itself like talking like people are talking about you can definitely go and ask to AI about it right and it is going to give you an proper explanation just make sure that you check it properly the code like AI generator code you cannot directly copy and use it I would suggest that you can analyze it to get a better idea of it but definitely it gets a lot of thing that you don't have previously information about so this is going to be really helpful so for example this is creating this also demonstrated a blog template demo also in index dot html so up to this level for to get this information I think you'll have to look into web a lot like you need to have a correct terms and find out different terminology what does what and everything but you can have all of the source of information in one place so this is going to be definitely helpful in your day-to-day task and this is just an example of creating a fg theme that can be anything like a react project or whatever you are like blogs or the new like buzzwords of WordPress whatever you want to listen from you can definitely get it from the AI tools okay moving further AI tools can also help you in debugging errors right so if you are a developer you are definitely going to have a tons of errors in your code whether it is like developing some feature or anything like that and we actually spend a lot of time debugging a lot of errors but with the AI tools debugging errors has been also very very easy and in terms of time it is really time saving also so just a very basic example I have written here so how chat gpt or the AI based tools is handling these kind of error this can be anything like javascript error php error file path error or whatever right so you can just face the error this is a very generic kind of thing on code type error this we get a lot in javascript and react list project so this is the example that I am sending and with that prompt only this is this AI based tool is giving me some suggestions on how to debug it so steps are also there right so all of the possibilities and it can be helpful in reducing a lot of things something that you might have missed right so you can get there faster so debugging is also very very helpful with the AI based tools like fine and this is just an example for javascript but this will definitely work for any kind of error or in any program like most of them actually okay other than that custom development so uh how many of you here actually use like acf or plugins like meta box for custom development and yes okay a few people yeah so uh you have must have noticed that while creating like different kind of content boxes in meta box acf you have to go through a like generative process either you go with the uh writing the json for for your fields or you just create it add it manually through the visual builder they provide and you get the fields and everything I believe that there is really like time consuming for a developer to actually work on the development stuff right so in using AI now you can actually tell the AI based tool to write the acf json file for example right just an example you can do it anything like that but what I am writing right now is uh this is the problem that I'm using right now create a acf json file for all of the fields required for uh okay there's a type of a team section that consists of a repeater fail for multiple team member and takes employees name designation email and LinkedIn URL as data so this is the requirement for example this is what you got from your client as a user story right so you can actually use that prompt to create a json and what I am writing here is I am using pro version of asia plugin right so with that information you can actually like suggest you some thing in your code and how you can sync everything up and it is also giving me some json file for the uh fields right so quick modifications there and your fields are ready this you can put into your theme dot json file and sync it with and the lot of like creating field and whatever it is going to be reduced the time you'll save is actually very good and yeah I'm tooling using this free tool so it is like restricting to some characters and I can also actually can make it continue writing all of the data so it is all about prompt so if you are providing correct prompt then you can definitely use this kind of thing and this is not just for acf you can use it for meta box or any kind of custom plugin that you might have that is popular out there and that AI is like have some knowledge about so this way also you can save a lot of time in terms of development for custom products okay another use case I would like to talk about is uh writing test cases and code optimization I believe a lot of developers out there do not prefer to write test cases like psv unit tests and other things because of the time consuming and the deadlines there let's admit it like writing test cases is as much as time consuming sometimes even more than writing the actual functionality right so now we have the AI based tools what we can do is simply ask it about like right now it is not perfect right but at least it gives you the proper idea and the framework of and a good starting point for someone who is just starting to write the test cases and everything right so for example if I want to write a test cases for function then I can simply go with the AI based tools I add a demo for this one but okay some of my find extension is not working in the vs code so this was a live demo but you can check out the find extension and this similarly works with the github copilot as well actually it works better in the github copilot but that is the premium one for sure but if you select any function in here and for example like for I am using this source find for selection right now so you can select any code this is similar to what we do in the browser and if I write that writer test cases for this function then it is going to suggest me some of the basic structure and the point for starting for writing test cases for psv unit or other kind of thing so this is also going to help you boost up the process right okay this is actually what I tried earlier to create a prompt and everything for our test cases of this one and for this it is giving me basic kind of framework for psv unit framework test case and it is like extending this function and right now it is just instructing me how we can do that but with correct prompt and everything and with continuation from this prompt I can actually get the test codes also test cases code that I can use in my product project okay another thing is code optimization okay a lot of times we actually write some code for the functionality but there's always some better way that it can be optimized right in terms of memory performance and a lot of things most of the time we don't care a lot about that those kind of thing but when our product like in plugins also if they scale up and we are looking into minute detail like the problems start to arise right and we need to take a look on all of the functionalities that is taking up the resources and whatever it is like to debug it further so if we find the cause of it we can actually use AI based tools now to get the optimized version better optimized version of the code that you have written right so this we use sometimes in our daily like projects also if I feel like something I have written is not optimal enough and that can be better even if I don't know how to optimize it better I can ask it to the AI based tools right so what I can do is this in this example I am writing this small javascript function to look through the FAQ content in one of my plugins right so I have just pasted it down and I told the AI based tool to optimize it further so it is like giving me step by step options on how I can optimize it so this is a great way of learning also I believe because it is going to give me an explanation of my current code and what can be done to optimize it further right so this way you can learn it like it is saying that uh reduce the amount of flu code and I can handle it better batch dome changes like taking up a lot of dom memory and casting the variables building browsing feature performance monitoring tools a lot of suggestions are there for just a simple snippet of code right so there's always some better way to do it and if you find it you can make your own decision that if it is something helpful for me and my project then I can take that up so basically the optimization task can also be very very helpful with the AI based tools I have shown a lot of demos recently in my three of the slides and in every slide actually everything was initiated with a prompt right so while using AI based tools prompt engineering is very very crucial task and this is something that you have to like get yourself better at also because if you are not putting a good enough prompt then you will not be getting better results from AI itself also because AI works in patterns on you right so whatever data we feed it the whatever sources whatever questions we are asking the series and everything it works based on that also so you need to be careful about the prompt engineering and what prompt engineering is it involves that you need to consider that it is just a machine the AI is a machine and you need to feed it proper patterns to get better output so that you need to keep in a mind right so for every kind of content not just for development prompt engineering is very very important and we need to understand it better while using the AI based tools okay right now a lot of businesses has been using AI based integrations in their existing product also so just an example of how WordPress businesses are shifting to the AI paradigm we can look at the example of Elementors AI they are providing the text generation feature right on their editor the image editing features are there and some of the SEO plugins like RankMath all in one SEO are using generate like content generation for better titles meta description and all of the things there are new plugins like WP van that actually lets you generate content on the fly in the WordPress editor itself right and AI image generators are there new site generators like zipwp, shortwriters, chatpots, jetpacks, AI assistant is there, AI power plugin is there all of these big industries are adapting to AI so I think in a product also AI based tools like integration is must right now because a lot of businesses are going into that direction okay so what are the development ideas that we can take away from there I think the day to day task we can use definitely AI for the development of our different kind of like ease of our development process and everything like I explained earlier but as a developer I think we can integrate AI to existing product like WooCommerce, LMS as for your clients need or your own product if you have your own product then you can definitely add AI integration to it for users to have a better experience into it right or create a completely different AI based product that is the further ideas that we can get through okay so for a quick demo of our development idea that's the small thing I have developed a tool that I can show a demo of right now okay so this is a basic from type of thing like right now I am using Lang chain and like my custom data source for this one but this is just to give an idea on how we can start developing our own plugins integrated with AI itself right so what I am doing right now is I have created a small prompt this is a local application right now it uses a Lang chain integration and the application has been written in JavaScript itself so I am writing a prompt for this one that create a call to action for a travel website I have fed some data to it I will show that later but if I click on generate this is a recorded video because let's face it like AI is quite expensive right now to send requests and responses so what it is doing is it is giving me a WordPress core blocks markup that I can copy and paste into my browser and get the sections ready right so by default OpenAI also does not do that we just need to tweak it a little bit with prompt engineering right so this is a section that I got I can easily anyone who contributed yesterday in patterns I think you can use this tool to create new patterns also because AI is going to generate content and it is going to give it a different kind of layout for that one okay this is a quick demo on that part so this session is not like a bit more technical to go through all of the processes I have set but see this is a cta banner that I got with the prompt right but I will go through the quick demo of what prompt I use for that code so I think we don't have much time left but I'll try to wrap that up okay this is a tool that I created actually and this is the prompt data that I'm using right now so that this is what I'm talking about like yeah it's still idiot in some time like you until we feed it proper data it is not going to give some kind of proper output to it so this is the prompt that I'm using right now to generate the code for the WordPress page builder like blocks so what I've written is act as a Gutenberg code writer and expert copywriter you'll be creating website pages with Gutenberg blogs I'll instruct you to create one section at a time for all of the blogs and I have also given given some examples for it like what are the content available right here right this is the WordPress core blocks content and I've strictly given an instruction that I just need the code only and no explanation for this one right so these kind of content we can use it so by this example what we can learn is that this is just an example for WordPress based product but if you have any kind of custom product that is based on blocks also you can use your pattern like instructed properly and feeding your data you can actually get the output based on your data itself right so these kind of development ideas can be done by integrating AI into your product and it is going to be really really helpful to add some additional user interaction in your web in your products like users with going to be really benefited by these kind of tools so this is all about the development ideas see possibilities with AI in WordPress are endless and it is dependent upon your imagination I believe that and a lot of companies have already started going to that direction as a developer we should also so finally having said that let's talk about some talk about some of the drawbacks also there are like some drawbacks of using excessive AI as well so there might be issues of plagiarism because it is feeding on our data and giving solution in it and like I told earlier if you copy everything up you might be actually copying some parts of a code of some other products also so you need to be very very careful about that quality and coherence we need to be everything AI suggests might not be the optimal quality right so we need to make our judgment also regarding that lack of creativity and originality obviously if you depend on AI on everything you lost you'll be losing your creative ideas so making use of it is one thing for boosting your productivity but you cannot be dependent on it completely and obviously the over over dependence can also be reduced a lot there are also some kind of thing like data privacy is also in concern like we are feeding some data to a company so there's definitely some concerns about the data privacy also but all in all if we handle it properly if we take like responsible actions with AI then definitely as a developer as a product owner as a marketer and content creator also we can definitely make most use out of AI and get our productivity boosted up to a lot so that is all from my presentation actually I don't know if we have time for questions