← The Digital Marketing Podcast
The Digital Marketing Podcast
Vibe Coding - How AI is Revolutionising App Development and Empowering Non-Coders
00:26:03
Loading summary
Transcript23 lines
- [00:01]
A
Welcome back to the Digital Marketing Podcast brought to you by targetinternet.com My name is Daniel Rolls and in this episode we're going to be talking Vibe coding.
- [00:18]
So if you're not familiar, Vibe coding is a kind of new approach to software development using AI. But one of the things, it's made software development accessible to everyone. So if we just look at the definition, so it says Vibe coding is a software development approach where developers use natural language prompts to have an AI generate code, shifting the focus from manual coding to guiding and refining the AI's output. Now, I have to say I'm really excited about this because I think it's really important we're not just using AI to do things quicker, but also that we're doing things better. But really importantly, and Kieran's raised this point in previous podcast, that we're actually doing something new with this, that it opens up lots of new possibilities and opportunities. And I think the ability to create interactive content is new for most people, or at least the ability to do it easily and iteratively is going to be huge. So the idea that, you know, anyone can write an article, but not everyone can do a podcast, not everyone can go on to do a video. But what about interactive apps? Well, not everyone could do that. The barrier to entry was huge. Well, that barrier to entry has come down, but I don't think that as many people are taking advantage of it as they possibly can. So what I've got is a bit of an introduction. The different kind of levels of it hopefully make it accessible for everyone. We've compiled a load of guidance in the show notes, so targetinternet.com forward/podcast. As ever, we're also for members of Target Internet, we are doing a Vibe coping master class. So if you're not familiar, Target Internet members get these master classes half day every month. We've got one coming up on Vibe coding as well. So look at that. If you're a member, if you're not a member, we've also got one of our one hour update sessions. So if you sign up to the newsletter, targetinternet.com forward/newsletter, you'll get the newsletter, which has got three tips, tools or techniques every time. No ads, no sales. But newsletter subscribers and members get these one hour update sessions as well. So to get signed up to the newsletter, if you're not, at the very least, if you want the master of class, obviously get signed up to Target Internet, but I like to think really there's kind of three Levels of vibe coding. And it took me a while to get my head around this. Now level one, super excited about because this is kind of accessible to everyone. And suddenly chatgpt5 and therefore co pilot, because Co pilot is now using chat GPT5. Claude is very good. This Gemini is good, and so on as well. But what they're really good at creating is one page apps. So if you start your prompt with create a one page app, that they will then go off and use a combination of HTML, hypertext, markup language, the stuff that websites are written in, css, cascading, style sheets, the kind of styling elements of our websites, and then frameworks like React that are used for creating much nicer, smoother user interfaces. And they'll create code that will run on any website without any need for backend stuff like databases or special libraries to be installed or anything like that as well. So then what you do is it generates the code for you. You can preview that code within ChatGPT or Copilot or anywhere else. But generally speaking, what you're going to then do is copy and paste that code or just download the files and then you can upload those or embed those into your website. So for a system like Wix or WordPress, this is relatively easy to do. You do need to consider security, as you don't want to make your website kind of vulnerable in any way by adding code to it. And style sheets have a bit of a hierarchy, so sometimes it can cause you some kind of layout issues, depending on how things are set up. Basically it's not complicated to work around these. One tip is that you can use one AI to critique the code of another AI to check it for any security flaws. So I found that to be really good. Claude is great for that. So is ChatGPT, Google Gemini as well. I've added guidance to both of these issues about Cassandra style sheets and about embedding code in your own website into the Show Notes as ever. So target Internet.com forward/podcast. So that's kind of level one. It creates the code, you can preview it, you can then copy and paste that or embed that into your website. And there are some security things to think about, but we put some guidance into the show Notes for doing that.
- [04:42]
This just at this level allows you to do amazing things. So we have created interactive timelines, we have created interactive maps, we have used tools to help you generate ideas. So there's lots of exciting things you can do with that. Level two is interactive, but with a backend Like a login or memory of previous content interactions. But also at this level, you can actually use AI within what you're creating. So imagine you wanted to embed something into your website that allowed people to do some keyword research or some content planning. Well, you could use AI interactively within your own app embedded into a website. Now to do that, you need to have a connection to the back end of ChatGPT or something like that. It's relatively easy to set up. You just set up an API account and then you pay for credit. So bear in mind, with some of these things, there might be an ongoing cost, because if you've got hundreds or thousands of people using this new thing you embed into your website and it's using ChatGPT in the background, there will be a low level of cost associated with that. Now, it's got a lot cheaper, so it used to be quite an expensive thing to do, it's got an awful lot cheaper. But there are some other tools like Manus that I'm going to talk about that have got that cost kind of baked into it. Now, the brand new version of Manus, and Manus is an amazing AI platform that uses a number of different kind of AI large language models in the background. But not only can it create code, it can deploy it and it can host it. So just to put that in context, it can create some code and it will put it online and host it for you, and it will give you basically a little subdomain of the Manus website that you can link through to. But it can also do things like create backends that have security and databases in them and so on as well, and analytics. Now currently that's then hosted on a mana subdomain. They are looking in the future of allowing you to then point your own domain at this. But that's a feature that's coming. So if you think about this, suddenly you can create something that people can log into, it can remember what they've done previously, but really interestingly, it can use AI, so it can do AI kind of interactions and you can embed that into your website, because the way you then share it is either by linking through to that subdomain, so it's like a little standalone website, or what we've done is embedding it into your own web page using an iframe. So you create a page in your website, you put an iframe into that. WordPress Wix will allow you to do those kind of things, and then you can put the little Link to the iframe to your code where it's hosted on manuscript, and there are other platforms that do this as well, and it will show up. Now, my worry was that iframes, any content is like within a window within your web page. I was worried that it'd be a problem from both an accessibility and an SEO point of view. And actually they're not, if you set them up right. So again, I've added links into the show notes just with a bit of a guide in terms of how you set these iframes up so that they are fully accessible, but also so that Google can see the content of the iframe. Because the risk is that Google sees your web page, it sees there's a window in it, but it doesn't see what's through the window, but you can actually add some code to tell Google to look at what's inside the iframe. Now, this works so well. We tested this out. So we created an interactive Google algorithm timeline and we embedded that into our website using an iframe. And actually it ranks number one in Google for the target phrase that we set it up for. So it can work really well from an SEO point of view as well. Now, level three is where it gets more complex, and I've got an interview to help you deep dive into this as well. So you can see the art of the possible, even if you're not going to do this yourself, but if you are going to do it yourself, just to learn from somebody that's already gone through, which is quite a painful process, because I interviewed Christo that I'll introduce in just a moment. And Christo has kind of gone through this learning curve as all of these AI tools were evolving and changing as well. But at this level, you can create and deploy fully attractive websites and apps with full functionality as a standalone thing. So you could create anything. You could create a CRM system, you could create, you know, fully interactive digital strategy creation tool, anything you can think of. Now, these require things like authentication, security, databases, staging, servers, and lots of stuff that only normally full stack developers could really deal with. Generally what this is going to involve is using some external tools, so setting up some hosting space, setting up something to store your code, those kind of things, and then using AI to help you manage, but generally generate your code across these platforms. And I really wanted to speak to someone that kind of been through this process. And I was very lucky that Christo Steiman, who is a podcast listener. So Christo reached out and said, look, I've been building and launching a business using Vibe coding at this more advanced level. And he was very kind and generous enough to kind of share his journey and amazingly his process and his tech stack that went with it, because that's what no one else had really shared. So the second part of this podcast, let's go over to an interview I did with Christo and we can see how he worked on his business TradeLead AI and how that progressed.
- [10:06]
It's a great interview because it really talks through the pain that he went through and actually what he's learned along the way. And he's very generously shared this list of tools that he's used to help him get set up and how he did that in a cost effective way. So again, Targetinternet.com podcast you'll get access to that full tech stack. But don't forget we have a masterclass for members coming up on Vibe coding and an update session for newsletter subscribers. So get over, subscribe targetinternet.com newsletter and over to the interview.
- [10:40]
Okay, let's get straight into it and talk to us about what Vibe coding is and you know, what it really meant for you.
- [10:46]
B
Okay, so a funny thing is I only really heard the phrase Vibe coding maybe two months ago or so, like after.
- [10:53]
A
And you've been doing it for a long time before that?
- [10:55]
B
Right. After spending quite a few months, like more than a year on building certain prototypes. But for me, it's basically coding without the fear of coding. Like I said, I didn't really know the term, but now after the fact, it makes total sense. It's that putting into practice what my thoughts are, you know, I've got an idea and I can very quickly prototype it or at least test something. It might not be a full MVP or anything like that, but I can really quickly go and try something out. It's that experimenting, you know, copy, paste, test, break, fix, and then slowly kind of make it my own. And it's like building Lego when you don't have the instructions. That's kind of how it feels to me. Yeah, so you kind of put the pieces together and not always knowing what these pieces are. And then until something works, you know, and then refine it. I suppose if any experienced programmer would look at my code, it would. They might be appalled by it. But for me, it's less about like syntax mastering and more about that, like momentum and intuition and iteration. I think over time, the way that I've been building, things have definitely gotten better, like splitting the code up into Modules and things like that. Like you should have seen the first bit of my code. It was really bad, it was really messy. Even like me looking back at it, I'm like, geez, I can't believe that I actually did that. But I think that's, that's something that also with learning this whole vibe coding thing, I've also learned a lot more about programming, like how it should be structured, you know, what you actually should do. So it was learning the syntax, but also learning like development practices. Probably not at the level that, you know, experienced programmer would be, or definitely not at that level, but I definitely improved.
- [12:36]
A
Yeah, I'm really interested in that because one of the things I've noticed is that lots of people are getting slightly better at prompting and the way they've got better at prompting just generally is that iteration. You try it, you learn, you test out what's kind of working and what's not. But what differentiates that, because I could go in and I can use ChatGPT now to do like a one page app that creates something for my website, that's fine. But the difference between that is actually understanding the structured approach to programming, the tech stack that you might be using, deployment, all those kind of things as well. So we'll get into that because I think it's really interesting. So how did you kind of start off in the space? What got you into it?
- [13:11]
B
So I do come from an IT background, but purely infrastructure, servers, networks, you know, cloud and things like that. Not coding at all. I've done some basic scripting and batch files and stuff. Just growing up with, you know, DOS from back in the day where it was like a requirement. So I do have an, I do have an IT background and it was a real big shortcoming for me not being able to program and not being able to actually put any ideas into practice. And it's been quite a big stumbling block for me because I've had multiple businesses in the past or business ideas and you know, entrepreneurial tests or experiments that I've done. And I've never been able at the moment, like there's a software component that needs to be written or developed, that's kind of where my idea fell short. So obviously when I started seeing people on the Internet doing basic things, I mean, looking at maybe ChatGPT 3.5 and like the beginnings of 4, it was much more basic than it is now and. But when I saw what people were doing and how quickly they were doing it, even though a lot of people were using make.com and you know, these like no code, low code tools that really piqued my interest because I could suddenly very quickly execute basic things. Even just looking at infrastructure, like giving me the code to deploy infrastructure on Azure for example, that was kind of the first things that I saw. Like Azure or ChatGPT will just pump out a big script to deploy a server, configure the network. And I was like, this is really good. There's a business idea right there. I'm always the schema, how can I make people's lives easier? Basically what problem can I solve? I just totally became hooked because I just suddenly found problems everywhere that I usually would have maybe steered away from because it had this development component and now you know, that barrier has been removed. So I just started doing like a whole lot of different things, mostly with like booking agents trying to solve business problems. What can the AI do to solve a real business problem? Because I've come from a corporate environment and there's, you know, there's a lot of business problems, there's a lot of repetition or processes that we can make faster. I've seen Sal people really struggling with reports and then I saw some people doing, you know, speeds to SQL queries basically and had a few tests and they were actually successful. They weren't enterprise ready or production ready, but my initial tests were really successful. And that's really what hooked me. I was like, okay, this can go a long way. And yeah, I started exploring from there.
- [15:38]
A
Yeah, I think it's amazing to me because actually there's, there's never been such an opportunity for entrepreneurs to actually launch something and get it out into the real world or at least get a minimal viable product up like you described as well, which is brilliant because it means that we can take those projects further. I mean the downside is that you can build something today and then tomorrow somebody can come with something out there's even better. So there's that it increases that competitive environment as well. I mean, tell us about the idea that you've been working on.
- [16:03]
B
My project's called Tradely AI and it basically comes from real business problems. I think all my entrepreneurial exploration is all based on speaking to people and they've got an actual problem. I started getting in touch with solar operators, people in the service industry and their problem was, you know, being on the tools or being in therapy and not being able to answer their, or reply to their clients. There was a specific massage therapist, I actually, I was actually busy having a massage and she complained about Instagram messages Just coming through the whole time and her not being able to respond to it. And when she does respond to it, at the end of the day these people have already found another therapist. You know, they've already booked something else in. And I was like, this is a real business problem. You know, this is something that I've already before that actually started playing around with booking, like calendar bookings. And I tested, I had like a prototype of, you know, putting something in a calendar based on a chat. So I told her, well, let me, let me try and do something for you. The initial idea was just to write something bespoke just for her, just to integrate her Instagram with her calendar basically and then with ChatGPT, just, you know, give, you give her that like natural language to the clients. But as I started building it, I started speaking to a few other people also and I realized the problem is much bigger than just this one person. So why not, why not go all the way down the rabbit hole and build this multi tenant SaaS platform that can deal with multiple businesses that all have the same problem. And that's basically what Tradily became. It's, it connects to the channels where customers engaging with these businesses. So at the moment, Instagram, Facebook, I am integrating WhatsApp. But it's not a very big market in Australia so it's not a, it's not a high priority. And then obviously voice also, which is also on the roadmap at the moment, it's an AI assistant, it can answer questions on your business. So you know, how much is hot stone therapy? You know what is hot stone therapy? What is Reiki, how much is your quotation to come and do offense or whatever and you know, what is the duration? And then it will answer this and answer questions based on your business and also take bookings. So that's pretty much in a nutshell what it's about. And yeah, it's working, it's, it's live.
- [18:17]
A
It's amazing because when we first spoke you kind of were talking a bit about oh this is what I'm working towards. And then by the time we'd actually spoken, it was kind of live. And I know you've been developing it since then as well. What does the kind of tech stack look like for that to cause you talk about a bit multi tenant and all those kind of things. So what does that, what does it mean in practice and for those people among aren't that technical? What's the kind of levels involved?
- [18:37]
B
Okay, so I started off and also I knew Nothing about front end development. I Basically just asked ChatGPT what is the easiest, fastest way to go to front end and it said you can use React, you can use Angular and gave a couple of other things and I asked a few questions and it basically became React is the lowest learning curve with the fastest implementation time for someone that knows absolutely nothing. So front end is React Invite, which I think is like a proxying type service. Don't ask me. Just shows you like how you can build something without really understanding it. Because that was probably my worst was the front end. I really struggled with that. And then for authentication I'm using Google Firebase so I don't have to, didn't have to write any of this authentication mechanisms. Google takes care of that for me. The backend is all Azure serverless functions, Azure app functions and that's basically just, you know, it just has a whole bunch of functions doing interacting with the back end or with the front end or interacting with Meta's API and then the database is PostgreSQL psql so I was already familiar with SQL coming from an infrastructure background, so that was quite an easy transition for me. I did a lot of MySQL stuff back in the day, so bsql but different, but mostly the same as relational database. Interesting enough, I actually started on Cosmos DB because there was a very generous free tier and it worked very quickly, really well. But the moment I started the application started becoming more complicated. It fell apart because I didn't know how that worked and so I migrated everything over to PSQL and that was a good step for me. And then I'm using Azure Front Door for the website, which is a content delivery network basically just to get the website to load really quickly. Using Azure Key Vault to store all the client keys and my personal keys. So I've got two different key vaults and then we've got VNET integration on and then yeah, OpenAI for obviously for the LLM I'm using multiple versions depending on what query is being sent. So if it's just a quick formatting like taking something that's been retrieved from the database and formatting it into human readable format, then I've just used like a very cheap model. If there's more reasoning involved or function calling that might be ambiguous based on what's being returned, then I'm using more the more advanced models. And then for the my Website I'm using WordPress with Divi. Divi was quite easy way to develop WordPress and yeah, Google Analytics Meta and then I've also got a Dynamics 365 CRM. And I also just like to say this to anyone listening that is starting their own business. I was enabled for a lot of this because of the Microsoft Startups program where I got $5,000 in credit. And so it enabled me to spin up all these servers and you know, all this infrastructure without spending a dime. Otherwise you're going to, you know, these SQL is going to cost you like $19 a month. You know, the function app's going to cost you maybe $25 a month or what, whatever that price is. And it quickly adds up. So this was a very big enabler for me. Is that Microsoft program.
- [21:41]
A
Yeah. And that's still available. So people, what we'll do in the show notes, so targetinternet.com podcast, we'll put some links through to all of these different parts of the tech stack that you've spoken about and then we'll put through to the Microsoft program as well so people can take a look at that as well. So kind of lessons learned along the way. What kind of. Obviously there's a lot going on in this process.
- [21:59]
B
Okay. So one of the first things, and ironically something that I've learned or read in probably every single entrepreneur book or you know, entrepreneurial podcast is don't over engineer too early. And it's exactly what I did. Yeah, don't spend all that time fixing things that no customer has seen. You know, build the smallest thing, get real world feedback, you know, focus on that problem and just get that problem to customers and get their feedback. So that's probably one of the biggest things and, but also ties into that like your infrastructure is invisible to customers. They, you know, you can spend weeks on getting your certificates right and getting your networking right and you know, getting it all like enterprise grade. But the customers only care about their problem. And then another thing that, and I've also seen this and heard this in podcasts and entrepreneur books and talks and stuff is expect to throw things out. You know, expect that it's not maybe going to the application that you super involved in and sensitive about it and so close to it might not be the one that the customers want. So be prepared to pivot, you know, be prepared to throw big portions of this away if there's no product market fit for that or if you don't see a product market fit happening. And I think that was also a big thing for me. Like I had to let go of things that I thought, whoa, this was so Great. But no one wants it, you know, So I think those are the biggest lessons for me.
- [23:21]
A
So anybody wants to start off in this place, what kind of practical takeaways do you think you would give someone that wants to kind of start off?
- [23:28]
B
So I think, again, get really close to the problem. I think that's a very. That was a very important lesson for me. Make sure the problem exists. Make sure you know exactly what this problem is. Because if you have a solution for it, you're going to have clients, you know, and you can test your solution without actually building anything. And I think maybe I should have done that a bit more. I think I enjoyed the whole building part of it as an, as a techie, you know, it's. It was a fun experience for me. But for. If you really just want to build a business, understand that problem really quickly. And then when you start building, I think iteration is your friend, you know, like just, just go over the same thing over. And it will. You'll definitely get there. Don't be disheartened if it doesn't work early on. ChatGPT will learn what you're trying to do. You know, eventually you'll get to a point and if that doesn't work, I've often just taken the exact specific or the JGPT chat and I've popped it into Claude or I've popped it into Deep seq. You know, if you're not. If you're not too sensitive about the data that's in there and you just want to get an answer. And I've often, you know, played the LLMs up against each other almost. And I found the solution basically by putting this one's answering to that one's prompt and then eventually, like, they all understand what I'm really trying to do and then get an answer on it.
- [24:42]
A
Yeah, I think that's great advice. We find that as well, that if you are getting stuck in a loop, sometimes you take out and kind of start again, try a different LLM and to see where it kind of takes you from that point of view as well. So. So that's the kind of journey. But where's the project now and what are the kind of next steps?
- [24:56]
B
So, yeah, the project's live. I'm already looking at pivoting into other markets, but I'm thinking I probably won't. Right now I'm looking at possibly real estate because someone contacted me and they have an actual problem that I can solve with 80% of the product. But at the moment, I'm looking for investment so that I can really launch and scale. But my next step is looking for investment, securing something small for, you know, some seed funding during the first like 18 or 24 months and then see where it goes from there.
- [25:24]
A
Fantastic. Well, it's a brilliant journey going from an email that you sent over to me saying, oh, you managed to do this, then you kind of explaining out your tech stack for me and then us getting to this point as well. So thank you so much for coming on the podcast. All of that tech stack and everything else will be on the show. Notes Targetinter.com podcast Take a look at that and we would love to hear what you do with this technology and where you take it and we will keep you up to date with the journey and how the investment goes and how the platform grows. So thank you for being with us.
- [25:51]
B
Perfect. Thanks Daniel. Appreciate it mate.
- [25:55]
A
For more episodes resources to leave a review or to get in contact, go to targetinternet. Com Podcast.