GenAI Essentials – Full Course for Beginners - Ep131

sure if there's a gradio plugin butthere is journeys to marsit'd be interesting to see thatwe have gradio syntax highlighterum no that's not really that useful tome but we'll go back over to here andlet's start working with gradio so thefirst thing is we're going to need toinstall gradio so I'm going to make anew filehere um yeah I'll make a new file we'llcall itrequirements.txt and I'm just going todrop ingradio I would expect that python wouldalready be pre-installed on here so I'mjust typ in Python hyen hyen version andwe have a decent version here so I'mgoing to CD into that we're going totype in PIP install hyphen Rrequirements.txt and so that's going toget us set up with gradio here and weshould start working through theseexamples as they say it's really easy touse um so I'm going to pull this offscreen and I'm just going to write itout and you write it with me as we workthrough this um but I think this mightbe a better way to to learn gradio as wego through it um again not a superexpert but I'm very good at coding sothis should be very easy so let's goahead and start with our hello world andso I'm going to say hello world. pi andso the first thing we're going to needtodo and sure we'll install the pythonextension whynot um we'll go back over to ourhello.py and so we're going to need toimport gradio that'll be the first thingthat we do okay and so the second thingwe'll want todo is we'll need to create an interfaceso let's go ahead and type in demoequalsgr interfaceum and you know I mean we have theseexamples here but I would be kind ofinterested in looking at thedocumentation so let me see if I canfind the gradiodocumentation okay we'll pull this uphere this might be a better way to learnso it says build and share Machinelearning demos and web apps using thecore gradio python Library so we haveinterface blocks chat chat interfacetext box image audio data frame so let'sgo take a first look at interface sointer is gradio main highle class andallows you to create web based goysdemos around a machine learning model umthe function is to create a guey thedesired input components desired outputcomponents so we did this and so here wehave the interface so maybe we'll justgrab a bit of thiscode okay which we were already kind ofdoing here and so we havehere afunction an input and an output I don'tlike like four spaces I like two spacesand even the Creator python regrets notmaking uh making enforcing that so we'lljust switch over to two spaces here butlet's try to understand what we have sohere we have the gradio interface andthese are the options we have we have afunction that can be called we havepossible inputs we have possible outputswe have examples we have cache examplescach mode and a bunch of other flags Ididn't realize how much was in herethat's a lot okay so if we go up to herewhat do we have we haveour first interface and it's taking aclass called image classifier whichshows two things here it's literally afunction we have an inputs called imageand and an outputs called label allright so let's go run that and see whatwe get I feel like we wouldn't get awhole lot but we'll type in python app.or or hello world here we'll see if thatrunsit okay so that started up on Port7860 we'll open this in thebrowser we'll give it a moment here toconnect should not take toolong and so we have an interface what'sreally interesting is we have the inputis an image so I guess when we saidinputs is an image then we get an imageright that's really interesting and theoutputs is alabel which is over here does thisactually already work and do somethingthat'd be really interesting if it doesso I'm going to see if I can find animage to upload here really quickly so Ihave a like a green screen photo of meso I do this I say submitoh wow we actually got something and I'ma dog I'm not a cat but I'm a dog Uthat's really interesting that thatactually does something I really didn'texpect that but you know what it lookslike this is a hard-coded value so it'salways going to be0703right okay so here I bet if I changethis to like 1.7 it almost looked likethat was a functional app but it's notit's it's all it's complete nonsenseright but we go here and we feed it animage which does absolutely nothing andnow notice the value is 7 % I thought Ichanged itright 1.7 maybe we have to stop it andrestart it for this to workright okay because maybe that it didn'tpick up that data again this is all justnonsense but we're going to go ahead andsubmit it so now look it's 170% right sothat's really interesting another thingthat's interesting here is it says uhrunning your url so you could share trueto launch it and then it'll be publiclyavailable I'm not sure if this wouldactually work with this but we could trythat and see what happens if we do thatso we'll go ahead and stop it becausethis is running in a a a a a git pod andso it wouldn't necessarily have it butnotice that it now has this URL sogradio is basically setting up a tunnelso you can go over here and access itsomewhere else oh wow it does work sothere you go that is like a super easyway that you could share this withanybody and that's one of the powers ofgradio but so far this doesn't make awhole lot of sense what we're doing solet's go back to the docs and see if wecan learn a little bit more of what isgoing on here because we have clearlyhave different kinds of inputs and thereare different kinds of components so Imean we put a string in called image buthow do we know what kind of inputs wehave that's what I want to know here soI'm kind of looking at this

(Editor: cs)