🚀 Add to Chrome – It’s Free - YouTube Summarizer
Category: App Development Tutorial
Tags: AI ToolsNo-Code DevelopmentPlant IdentificationStripe IntegrationUI/UX Design
00:00
this app from the App Store is making $2 million a month and I with you will build this exact app from scratch without having to write a single line of code I'll also connect stripe to my app
00:15
so that you and I can start making money right away step by step I'll be guiding you on how to copy this $2 million a month app with only one AI tool and I've been using this viral app for quite a while now and I totally see why it's
00:30
making crazy money for people just take a photo of any plant for example and identify it instantly but that's not all the app also gives detailed plant care recommendations so it's no surprise why this app is making millions and millions
00:46
every month and if you've watched my previous videos you pretty much already know I've been building different kinds of apps using AI app Builders this time around I'm taking on another challenge and to copy this exact IOS app and build
01:03
the core features using only one tool repet the good news is repet already has a code chatbot that works as an AI agent so we don't need to build one and that means we can just jump right into building the app right away so let's go
01:20
ahead and start by going to the repet homepage and once you have signed up and you subscribe to repet you will gain access to the repet AI agent now start with this prompt and actually I got this prompt straight from chat GPT and it
01:36
perfectly outlines the idea I need for this app that we're making right now so it's develop a mobile application that enables users to quickly identify plants by simply uploading an image the app should provide immediate and informative
01:52
feedback including the plant's name and essential care information and that's it so since rep can't create create native mobile apps it should have adapted to the concept to a responsive web
02:07
application that will actually work pretty well on both desktop and for mobile browsers then right from here I can add some features for the app but in this case I kind of want to start with building the initial prototype first so
02:25
let's approve this plan and start all right wow I was n expecting this actually because the initial UI design of the app looks pretty dang good already and the current interface is clear and it is accessible making it
02:41
easy for users to upload their own plant image right from the main screen so I'm going to try uploading a plant image and let's see how this app works click identify plant and then let's see how repet responds all right now it shows
02:57
the plant's name and a few details about it but as you notice the results isn't accurate it gives us different results so I need to fix the plant identification and in this case I'm going to be using Google Gemini for
03:13
plant identification to analyze the uploaded image for more accurate results the Gemini API is actually the best tool to identify plants you can use chat GPT but Gemini is more accurate when it comes to plant identification so well
03:29
type use the Google Gemini API for planed identification and now here we need to enter the Google Gemini API key I'm going to visit the Google AI Studio create an API key if you haven't already
03:45
and then we'll go ahead and copy the API key and paste it here click on get API key and click create API key then copy and paste it here all right so let's try to upload the same image and see what will happen when we click on identify
04:01
plant okay so now I received an error so again I'm going to go back to the replic agent and type use the recommended Gemini D 1.5 flash model instead now let's try uploading a plant image again and see if the identification works this
04:18
time Yik I got another error so I will copy the error message this time and I'll paste it here and if you're running into the same kinds of Errors repeatedly I really recommend typing out the exact text prompt you entered earlier so now
04:35
I'm successfully fixed the error thanks to the repet agent and now I need to refine the next interface when an image is uploaded so I'll type when the user uploads an image at the bottom of the description show a table containing some
04:50
information about the plant then add more elements to the page Tex Styles and to make it more attractive so let's try to upload okay so I got a negative result so I need to fix this and I type the prompt I
05:05
just entered again an error shows up saying unable to identify plan so I'm going to copy the error and then I'm going to paste it here and I'll let the AI agent fix the issue all right pretty good result this time after identifying
05:22
the plan the page now shows the enhanced card layout care instructions have icons the information table is visible and The Styling the gradients and hover effects all work perfectly fine and it looks pretty smooth too so now I'm going to
05:39
want to focus a little bit more on the UI design so I'm going back to the replic agent and I'm going to type this prompt ensure the interface is visually appealing and enhances user experience
05:55
okay so let's open it in a browser and let's try to upload an image all right it looks pretty amazing to me as you can see the page now has a clean background smoother animations proper spacing and nice hover effects too repet
06:11
really did a good job here so to make this app even more visually appealing yeah let's keep going I'm going to refine the design just a little bit further so I'm going to go back to the repet agent and I'm going to type add a navigation bar at the top of the page
06:26
including home about contact and add a footer section with additional website information so let's see how repet responds open up in a new browser and then try to upload an image again pretty amazing result now the recent changes
06:44
enhance the website structure and navigation the navigation bar is now visible on all of the pages featuring home about and contact tabs along with a logo of course plus we now have a footer
06:59
for additional site details one great feature of repet is its ability to analyze and replicate designs you can upload a screenshot of an existing web page or layout that you like yourself and then the AI agent will copy and
07:16
implement the design into your project so let's try this one I'm going to use this image here and then now I'll go back to the replate agent and click this icon to attach the image and then I'm going to type type below the upload
07:31
section add a section where it explains how to use the ab take the inspiration from the image attached and include icons in each card okay so let's wait a little bit and see what will happen let's refresh the page and Bam pretty
07:47
cool it added a how it works section to the homepage and featuring Illustrated cards with icons explaining the functionality of this app now I want to add another button so I'm going to go ahead and go back to the repet agent and
08:03
I'm going to type add a take photo button beside the upload button to take a photo from their device's camera as well okay so this time I want to change the color and size of the take photo button and make it the same as the
08:20
upload button again going back to the repet agent to change the size and match the style of the upload button all right I'm going to try and upload a plant image and it shows the identify plant button and it works really well now I'll
08:37
try the take photo button okay so now instead of using the device camera the app wants to upload an image so I'm going to go back to the repet agent and I'm going to type Implement camera access for plant image capture when
08:54
trying to click the take photo button then add a capture photo button visible and when clicking on capture photo button it should start analyzing the plant image so let's go ahead and wait and see refresh the page and then I'm
09:11
going to go ahead and try it again all right so now the app is requesting permission to use our devic's camera next we have the capture photo button which the app will then analyze and there you go so all the buttons are
09:26
fixed and we're going to proceed to another feature I want to add to this app now I want to enhance the app's functionality by displaying all relevant information and related sources about the plant after
09:43
identification so I want to add this feature going back to the repet agent and I'll type out this prompt after the plant identification the app will also provide options to learn more through in-depth articles or related resources
09:59
okay so let's try to upload a plant image again and there you go you can see here at the bottom we have additional references and we also have related sources so our users can learn more about whatever plant they upload or take
10:15
a photo of okay so now the app is completed and the app is now fully functional with a super clean design it has accurate plant identification using Google Gemini and some helpful features like image upload camera capture and a
10:31
section of learning resources so let's try this app in a mobile view the interface is userfriendly and everything works pretty smoothly to me so users can now easily identify plants and get care
10:46
tips in just a few clicks and Taps and this time I want to add this prompt to make an engaging visual experience add a background design a moving green gradient effect throughout the entire website and that one looks pretty good
11:02
we have just updated the visual experience as for stripe integration now for the final step I want to monetize this app of course by integrating my stripe account and setting up a subscription service now the free plan offers unlimited plant identification
11:20
for 7 days then the next level up a Premium plan priced at 9 cents a month will provide users with unlimited plant identification ations for one month so first up head over to your stripe account then enable this test mode go to
11:37
product catalog then add a product name this to Premium plan and set this price to 9 cents a month go to developers here at the bottom left then copy this publishable key and the stripe key now
11:52
we'll go back to repet and we'll ask the AI agent to add a user identification and inter integrate strip payment so the new users can get the 7-Day free plan then a Premium plan priced at 99 cents a
12:08
month will provide users with unlimited plant identifications for one month okay now so we need to enter the price ID and the secret key so we'll have to go back to stripe then navigate to product catalog then click the three dots and
12:24
copy ID then get the stripe key from here and paste it into replic then we're going to click continue now I want users to register an account before they can access the 7day free trial so I'm going to go back to repet and type
12:40
out users cannot use the plant identification if they are not registered yet okay so let's see how replit will respond and there it is now the app displays start identifying plants sign up now to get started with
12:57
your 7-Day free trial all right now from here you can register your email and password to create an account and once our users are logged in the app displays their trial status along with the end dates of their 7-Day free trial and
13:14
there is an upgrade to premium button so this one will allow users to switch up to the Premium plan so if I'm going to click on the upgrade to premium button then the Subscribe Now button and error shows up so so I'll have to copy the
13:30
error message and then write back out to the repet agent please fix this error and then we'll paste it in there again the error shows up repeatedly so now I'm going to type when trying to click on subscribe Now button the app will proceed to stripe checkout now let's
13:48
test the entire workflow I'll register a new account then I'm going to upgrade to the Premium plan and then click on subscribe now I'll enter the payment detail and the payment is successful next I'll log back in and there you go there it is
14:04
everything is now working perfectly finally the stripe integration is complete and now the app is fully built it's AI powered it's beautifully designed and it's also monetized with stripe so our users can get a 7-Day free
14:20
trial for unlimited plant identifications for firsttime users and then they can't subscribe for just 99 cents a month to keep using those premium features honestly there's still so much more we could do here on this app we could add more features we can
14:37
make the UI a little bit better and we can even add an even smoother user experience but for now we've built this $2 million a month IOS app and this just goes to show how powerful the repet AI agent is now next time I'm going to go
14:53
ahead and take on another bigger Challenge and I'm hoping you're going to go ahead and join me so we can learn together for now thank thank you so much for watching and I'll catch you in the next one