Web App Development for Beginners
Published: 2024-03-29 21:31:59

The speaker uses a creative analogy of a restaurant to explain the components of a simple web application, aiming to make technical concepts more accessible. He begins by equating the dining area of the restaurant to the user interface of the web app and the kitchen to the API. Each section of the restaurant corresponds to different endpoints in the API, representing various functionalities like serving drinks, desserts, entrees, and appetizers. The presenter discusses the importance of data procurement, likening it to stocking ingredients in the kitchen, and demonstrates how users interact with the web app through requests and responses, ultimately receiving the desired content or food. Throughout, he emphasizes the importance of maintaining both the visible user interface and the backend API to ensure a seamless user experience.

### Summary

**Introduction**
   - Opening remarks about discussing a simple web application and understanding its components.
   - Explaining the intention to use a mind map for visualization.

**Analogy Setup: Restaurant as a Web Application**
   - Setting up the analogy of opening a new restaurant (Snow Pal Restaurant) and drawing parallels to web development.
   - Mapping restaurant components to web application components: dining area (user interface) and kitchen (API).

**Understanding Web Application Components**
   - Discussing the user interface (dining area) and its significance in interacting with customers.
   - Introducing the concept of the kitchen as the API and explaining its role in serving food (data) to customers (users).

**Exploring API Endpoints**
   - Defining API endpoints and their analogy to different types of food items served in a restaurant.
   - Discussing the use of REST and GraphQL endpoints and their differences.

**Ordering and Food Procurement**
   - Illustrating the process of making requests to API endpoints and receiving data (food) from the kitchen (API).
   - Explaining the role of data procurement (database) in storing food items and facilitating orders.

**Conclusion**
   - Summarizing the analogy of a restaurant to a web application, emphasizing the importance of both the user interface and backend components.
   - Reflecting on the process of visualizing the components and interactions within a web application.

### Podcast

Check out on [Spotify](https://open.spotify.com/episode/7zLfN42tRaC6SvJjpI8baB?go=1&sp_cid=03ae2ae7-c61c-4a5f-931b-46bad2d36df1&utm_source=embed_player_p&utm_medium=desktop).

### Transcript

**0:00**

Hey there. In this video, let's discuss a bit about a simple web application. Right, and just understand some of the pieces. If you've been doing this for a while, you would know this. You know most of this, if not all of it. But if you're new to development, some of this hopefully will help you, right?

**0:19**

So let's just draw something up, right? Just to make this discussion a bit more, or this monologue a bit more visual. I'm just going to draw one of my favorite diagrams, which is actually a mind map. I'm going to pick a mind map here and use a template.

**0:35**

OK, let me just delete what I don't need to begin with. So we're going to talk about a few different pieces, and let's take an example. Like, let's take a simple example. Let's say we have built, we are an analogy, right? Let's say we are opening a new restaurant, for instance, right?

**0:53**

So I'm going to call it Snowpal Restaurant, OK? Snowpal Restaurant and you have to, I'm going to give this a shot just try to talk technical stuff but in with the examples that are not so technical right just for fun.

**1:10**

So let's say we are opening a new restaurant and we need to, we want to draw parallels like similes or analogies. Or metaphors? To web development, right? So what? What are some of the pieces? And again, I as always have come unprepared. Sorry so if I make mistakes, which I'm sure I'm.

**1:28**

Going to do, I'm going to retract and then fix it as we go. But I think that hopefully will help because I've seen that if you come prepared and say only the right things, it's at least to me as an audience, I understand less from content that is actually perfect compared to content that's not perfect.

**1:45**

That's sort of impromptu and it fixes itself as the content progresses, right? Anyways, that's just, that's just me. So we have a restaurant, let's say let's call it, let's say user interface. Instead of calling it user interface, let me actually call it a dining area.

**2:05**

Right dining area and we'll make adjustments as we go. Let's call it dining area one, right? So your restaurant. We'll expand on this, but let's say we have a small restaurant. It has a dining area. I called it one, but let's just say it is one dining area.

**2:22**

That is it. There's a single dining area? Let me delete this. So this is where you're going to entertain your guests, right? Your customers. But what? What do they come to the restaurant for? To eat, right? To have breakfast, lunch or dinner?

**2:39**

So they need food. Where does the food come from? It comes from the kitchen, right? And again, I don't have any expertise in this field other than just the eating part. So again, I'm going to take a stab at this. So you have a dining area and you have a kitchen. That's I think a simple enough start, right?

**2:56**

Let's say how do you map this to a web? To a web application. So the dining area is essentially the user interface. So let's say if I could just add. Let's see if it's a note. Call it a user interface, right?

**3:14**

Because this is essentially what folks see, right, when they go to your web application, they're interacting with, with a user interface, so to speak. So similarly, when folks come to your restaurant, they're going to be sitting in a dining area because that's how that's how you're going to interact with your customers.

**3:34**

Right now the food comes from a kitchen. Now what is a kitchen? Let me copy this. Let's say we'll pick maybe a different color that's big pink. So the restaurant is basically your API, right? The application programming interface because you need for the food to come from the kitchen and it goes to the dining area before you can serve it to your end users.

**3:58**

Similarly, in a web application you have a very simple but typical web application. You have an API which actually has a set of endpoints, and we'll just talk about what the difference between API between an API and an endpoint is, But for now you actually need food coming in from the kitchen.

**4:21**

And that food comes in the form of APIs and it's consumed by your customers sitting at the dining area, which is essentially the user interface. Right now, let's say you have a very simple web app. You have one API with N number of endpoints.

**4:37**

We'll talk about them shortly. You have one user interface, maybe you just people for your customers just sign in. Maybe it's A to do app, right. Let's say it's a simple to do app. So let's actually, yeah, maybe I should have been open another window, but it's fine for now.

**4:52**

So there is A to do app and the page where you're creating your to do's is essentially your user interface, which is the dining area in this analogy here. Now you have the kitchen. OK, now let's dig a little bit deeper. Right. Now what is an API? Now, the API is an application programming interface like I just mentioned, but it comprises of a set of endpoints.

**5:15**

Now, what could those endpoints be? Let's expand on this. What does the kitchen prepare? And again, I'm just winging this, so hopefully most of it makes sense, even if not all of it. So different kinds of food come from the kitchen right now. Let's say there's drinks.

**5:33**

There's what is it? Dessert. There's entree, maybe. Maybe appetizer. I think that's that's the fair split for now. So there's different, these are the types of items that you serve your customers, right.

**5:53**

You bring the brings dessert, entree and appetizer. Now how do we map this to essentially the web application, right. You can look at them as essentially endpoints. So let me copy maybe the, maybe the note here is just a little too big, but that's.

**6:10**

Fine. Let's call it an endpoint #1. And we we, we'll add some more details to it shortly, but let's say we call it, we'll just call it endpoint one for instance and the next. One is like an. There's got to be a better way.

**6:26**

Maybe I should have. Maybe I should have clicked here. Not sure. Let's see. Note the note is a little bit too big. I'm wondering whether I should have just created text. The problem with creating text is. Ah, that's fine, OK.

**6:44**

I can make this

 any. Oh, I can, actually. So this is endpoint number two. And then there's going to be endpoint #3 and then there's endpoint #

4. OK, so.

**7:00**

Right now we have 4 endpoints. And let's see what is an endpoint, right. So an API includes the number of endpoints and the endpoints. Again, before you go into further details, let's just make it a little bit descriptive, right. So, but I have to provide a little bit more information here.

**7:18**

So when you're implementing APIs, you can, you know. In the past you you may have used different protocols. Years ago you may have implemented using SOAP and then for many years now REST has been immensely popular and then not.

**7:34**

In the recent years, GraphQL has has become quite popular as well. At Snowpal we use a combination of endpoints. We use GraphQL and REST, a lot of REST endpoints just because we've been in business for a little while. We went live at least about two years ago with mobile app like a year ago.

**7:52**

But yeah, we did start our prep work like at least about 2-3 years back, right, if not more. I've been thinking about the product all my life. Different versions of the product but but that's a digression. So it's built on REST extensively, but we are porting over to GraphQL and we're going to have a combination of REST and GraphQL endpoints right now.

**8:10**

As to what those are, maybe let's just jot it down here and then we. Can come back and revisit that and if. There's a way Let me add. Actually, oops, let me add a. A table maybe with let's say. Let me go here and pick for a table.

**8:31**

Maybe not here. Maybe there's a table somewhere on this side. Let's say I'm going to pick a table. OK, yeah, let's go with that. Right. Let's jot it down. It's actually defaults. Pretty big.

**8:47**

Let me make it smaller. Oops, there's the trying to get to the edge of this table. I want to shrink it. There must be a way to shrink it. Anyways, I OK, I got to it.

**9:05**

Let me undo a couple of times. Get to this arrow here. Or maybe there's a mirror bug. Or I have to be extremely? Careful about where the edge is. Yeah, I don't know. Maybe. It's a maybe it's a mirror bug for all I know. Or a minor bug.

**9:21**

Let me go here. Oh yeah, it sure is that like collapse or make it shrink this to be able. To get to this point here. OK, let me now move this to this side. We don't need like so many columns.

**9:36**

Let me just click here, right click and say I don't want to delete the whole thing. Wow, this is just taking up too much time. Too much time. OK, remove column, remove column and then I'm going to expand this.

**9:54**

OK, so I could have done this maybe differently, but that's fine. OK, REST versus GraphQL we'll. Come back to it and see what the differences are, OK, I just don't want to forget these questions right?

**10:12**

And ideally I want to move this whole thing away to the bottom so it doesn't come in the way. OK. Thanks for bearing with me there. OK, now we have these endpoints, right? We have and I'm just going to write them as REST endpoints because it's just easy to read them that way.

Sure, here are the timestamps bolded:

**10:27**

So I'm going to say slash. Drinks. I can take all of this with a grain of salt desserts. Oh wow, why is it like, OK, hopefully you can see that slash desserts and then this one is going to be slash entrees.

**10:46**

And then the last one, let's just do slash appetizers, right? So this is essentially how the API presents its endpoints, so to speak. Right. I don't actually like the note here at all. I think I have to just come up with something.

**11:03**

That's probably slightly better. I don't know. Maybe. Does this read well? Yeah, I think this reads better than that. I think that's very, very noisy. Let me just make it like this. Yeah, I think that makes it much easier. This is.

**11:21**

Kind of what happens when you're doing this live, but I think it's helpful so you kind of know how I'm approaching the problem, so which I think is is useful in itself. At least I've been told. So that's the user interface. I'm just going to go back and this and now these are.

**11:39**

The endpoints. The first endpoint is slash strings. Let's make it bold and let's copy it so we don't have to type it all over again. OK, all right.

**11:57**

That's strange. Did not copy the style. I made it bold. Then I go back here, I'm copying this, and then I go here. Oh, I wonder if I'm losing that style because I actually have to.

**12:17**

Click to gain focus and then go in there. These are some usability issues. We can talk about them. OK and then? We'll go to appetizers have to do it again here. So now we have like 4 endpoints and and for.

**12:32**

Those of you who are wondering what an endpoint is, it's. It's the way an API presents itself, right? So API is at the higher level and then when you go and.

**12:55**

Within an API, it exposes a number of endpoints, so let's actually even give it a number, right? So you might cross reference this shortly API endpoint #3 and then endpoint #4, right?

**13:13**

So there are 4 endpoints. Now we talked about a dining area and a kitchen and then this is what you serve. So now just to recap quickly, right, imagine a restaurant. I wish I was able to draw it. Like Android? Maybe I should do it on my iPad the next time. So you have a dining area where customers come in.

**13:30**

That's your user interface. You want to keep it prim and proper, spick and span clean. Lovely, Beautiful. Because that's how your customers are going to interact with you. Now your kitchen needs to be clean as well, but The thing is, your customers don't get to see it. So let me see if I can draw a line here, right?

**13:46**

So I'm going to pick a line here. OK, I'm going to draw. Let's make it like 90°. Can I tell that there must be a number that says? How do I know it's like 90°? Let me delete it.

**14:03**

Let me copy it. That's interesting. Do I have to like, eyeball it? There's got to be a better way than that. I don't know. Maybe that's an usability issue as well. OK. So let's give it some color.

**14:20**

Maybe not blue. Maybe. Green. OK, so we'll say that anything to the left is what your end users would see. And let's say if we can add like a human. Like I'm going to search for a human. Nope. Like a glyphicon.

**14:41**

Maybe they have. They support some glyphicons. Oh no, I'm looking for apps. That's not what I want to look for. That must Oh. It says Google Image search. That's not. Oh, that's interesting. If.

**15:04**

OK, stickers and emojis. No, that's not what I want. Mind Map, Kanban. Stickies Capture, Icon, Finder. OK, I need to go there. Now I'm going to say human. OK, let's say, let's say Guy.

**15:24**

Let's pick a guy. Let's pick a girl. OK, I'm just going to pick. People here, So these are our and you, these are our customers.

**15:41**

They come visit our site and then they start using it right? It needs to be more diverse than this, obviously, but I'm just lazy. So I'm picking the first two that showed up there. We want to serve the entire community out there, right? Just everybody.

**15:59**

So that's that's folks showing up at the restaurant now. They are interested in in a number of things. We'll talk about each one of those items, but they only see what's to the left of the screen, right, not what's to the right, essentially. But that doesn't mean we don't keep things pick and span and Immaculate on the right side as well.

**16:19**

And it's actually just as important if not more. And we'll we'll try to, I'll speak to why, right. We'll discuss a little bit about why that is. Also that's not just also that's even more important if you ask me. And then when you talk folks, right and let's say when people mention like a full stack developer, which is a different discussion, it means that somebody's working on both sides of this, right.

**16:41**

So which means you have somebody at the restaurant. A waiter or a waitress who's going to the kitchen bringing food, but they also prepare the food in the kitchen, so they are like a chef or a cook, and then they come. They also are managers. They stand in the front office, They greet the guests and see them and, you know, show them the menu and whatnot, right?

**17:01**

Because if it's a smaller restaurant like a startup, there's only a few people. But if you go to like Zaitanya and Washington, DC, they have, you know, large space and a lot of people, right? Working at the restaurant, so they have a division of labor. Anyway, so let's let's go to the right side.

**16:59**

Now, the kitchen is not what your end users see but, but but that's where your actual food comes from. Now, these have to work well together, right? Because if you have a restaurant that has an exquisite dining area but there's no food to serve, what are your users, customers going to come there for?

**17:17**

They can just come and sit down and they have to go back just as famished, right? They're not able to satiate their appetite. So in the context of a web application, you can sort of extrapol

ate that too. You're coming to an app and you go to a page and you have a static page with some HTML content, but that's about it.

**17:34**

There's no state change and there's no interaction with the user. They can't. It's like going to a dining restaurant and having a dining table. Maybe there's a menu, they can look at it, they can check out the chairs and the desk and the table, but that's that's it. They can't have an interaction with somebody.

**17:50**

They can get food, they can consume. Anything that's like a static web web page essentially, right. So you're not, you don't facilitate any form of interaction, you don't provide any value added services. Now there are those kinds.

**18:06**

There are websites that are static, but that's not a web application. So now we where the API comes into play is you go to the page and now you're actually wanting to sign up and then sign in and then start using the product, right. So if you're at Snowpal, you want to sign up, how do you sign up?

**18:23**

You're actually going to call, you know, the UI essentially calls an API endpoint and then establishes the fact that this let's, let's give them names, right? Let's call this person Raj, and let's call this their person Holly, right?

**18:45**

So they are our customers right now. Now Holly is really hungry and she wants food, so she goes to the restaurant. She's looking to place an order, and that in in the context of a web application you're registering yourself because you're going to be using it.

**19:03**

All the time. Starting at that point, hopefully in a restaurant you don't necessarily register unless you can think about a scenario where you're a frequent not flyer, but a frequent eater. Even if that sounds a little odd, you a frequent that place so they give you a card, you have an ID and whatnot, right?

**19:19**

I guess it's not not a great example because I don't know if that's such a scenario. Maybe in really real high end restaurants, I'm sure. That they exist, but I've not eaten at those places for me to make a comment on. That's the act of registering. But let's skip that.

**19:35**

After you're registered and you signed in, you actually want the one of the first things we do in our product is we show you a dashboard, right. So that's like, you know, you're going to like a Mexican restaurant and they serve chips or nachos with salsa, which you don't pay for, but you still get right, it's at, you know, it's on the House.

**19:54**

Let's pretend that that is the dashboard, right. So let's say we'll add that comes under appetizer. So under appetizer, let's say that's. Not choose. Right. So that's a kind of appetizer. So now it's it's you're going one, we're going one level deeper here.

**20:11**

Now it's basically what we're saying is you're not only asking for appetizers, you're actually saying give me the appetizer. I mean we can, we can do it. I'm just going to call it name equals nachos, right? Just to keep things simple, right?

**20:30**

And maybe I don't even need the parentheses. Seems a little too noisy. OK, and now I'm going to go and highlight it and. Because I removed the parentheses there, you're going to see that I'm going to waste another like 2 minutes doing this. It's because because.

**20:47**

Some of us are born with a personality where we can't live with some of these inconsistencies, even if they don't mean much. So apologies again. So all of them look nice and consistent, right? We go here. Move the parentheses.

**21:03**

Yep. Now we have appetizers. We ask it by name. You can ask it by ID or whatnot. But let's just keep it simple. You're saying, hey, give me the appetizer, give me nachos. Now in, this is a request that you make. So this is called a GET request, right? Because you're essentially saying I want to get nachos.

**21:22**

Oops, yeah, I guess I picked the colour then. Intend to. OK, let me go here. Now I ask for nachos. You're going to you're going to get nachos, right? Again, take the example of the grain of salt. As long as it makes some sense.

**21:38**

And you have the understanding, I think we are in good shape. So that's how you're asking for nachos. And then the waiter goes in. It's like, you know, Holly showed up at the restaurant and the woman, she showed up, right? The restaurant's policies for them to serve nachos without, you know, it's on the House.

**21:58**

So the waiter goes in, makes a request to get nachos. That's what the API does. It says OK, the UI is going to, the request originates in the user interface. It's going to say hey Holly's signed in, now let's serve nachos to her. So you do do a slash appetizers question mark name equals nachos where name is basically a query string param and GET is the http verb.

**22:19**

Where you're getting the you're making a request and then this is going to return a JSON structure. Now I don't know if there's like if Miro supports like a JSON. I wonder if they might have some support, I'm not sure.

**22:37**

Get more apps. OK, let's say let's search for JSON. I'm not. Sure, maybe. Let's search for API. I'm pretty sure it's got.

**22:53**

A lot of this integration we can we can find one that we probably might. Be able to use, but I don't know. Yeah, let's just ignore that for a second. I can open another window and just construct the JSON and show it, but we'll probably just keep it for the next part of the podcast or something, yeah.

**23:12**

So you get the, you get the appetizers, you save it, right? Now let's just step back and see you have a restaurant, user interface, API endpoints, and then you have more specific endpoints where we filtered them. Because you have a lot of appetizers, you're not going to give them all for free, you're just going to get the nachos for free. So when Holly showed up at the table and someone seated her, the request originated to the API for that endpoint, and then the response came back.

**23:35**

The waiter brought the food to the table, and then Holly actually now gets. Let's see, we might have an icon Finder. Let's see nachos that.

**23:53**

Seems a little bit buggy because I thought I had the focus here. I said Icon Finder. Oh, that is strange. Oh, the enter does not work. That's what it is, yeah.

**24:09**

If you go here and do the enter, it actually enters. The focus seems to be elsewhere. So we are discovering A. Reasonable number of bugs already, but let's say this is a pizza. It's not nachos. Maybe they have chips. Let's see if they have chips.

**24:25**

Oh, sorry, I hit the hit enter again. Oh, that's like poker chips. I want to play poker. Yeah, OK. I'm just going to get. I'm going to look. For food, let's find avocado. I think that's because you know nachos.

**24:42**

Go very well with avocado, and if you're like an Uncle Julio's or something, they actually have a nice table side guac. Right. OK. So now we are we're bringing. So let's say this is what even though it says nachos, let's pretend that this isn't and I'm.

**25:02**

Going to copy this and then Holly essentially ends up. Getting this right. So that's a a request right now before we go there, there's there's one thing that's missing here. Now when this end point is, you know, when you make, when this request is made, how does it know where is this appetizer?

**25:18**

Where is this avocado or where is nachos actually coming from? Yeah, it's coming from the kitchen. But it needs to be stocked, right? The kitchen's going to be a place that has equipment and stove and microwave and all the kind of cool stuff, but there needs to be ingredients to prepare the food. There needs to be like raw material, so to speak, right?

**25:35**

Where does that come from? So let's say in our example here, if you go procurement right, I don't know how food procurement works or that even the right. That is even the right word. So you're going to have some suppliers, right, you, you procure your materials.

**25:53**

Let's say you shop at Wegmans. I I don't think a restaurant's going to go to the Wegmans or Harris Teeter to to buy their their groceries. But let's say you go to they have a vendor, they have a supplier, so they procure that food. Now that in our world essentially is is actually a database, right?

**26:10**

So let's just say database. Now, there's many, many, many kinds of databases, many types of databases, lots of vendors. So we'll go into all of those details. But let's say what it's worth at this point, it needs to come from a database.

**26:28**

And of the analogy is perfect here because a database is kind of persistent, right? Where I'm going to store this for for good, I'm going to store the fact that Holly is actually a I want to add. Another piece of text here. So I have to store the fact that Holly is a customer.

**26:48**

Because then first time Holly registers, I need to process the fact that Holly is a customer. But that doesn't go into food procurement, right? That goes into a completely different location. So you know what, let me keep it simple. We'll deal with that at a later point of time. Now we're going to say that database needs to have.

**27:06**

This nachos, right? Because if it doesn't have nachos, we can serve nachos. So let's pretend that nature, the notion of food procurement is identical in some way, hopefully to the notion of a persistent store, which is a database in our example. So it needs to have data nachos, and it'll have other things as well.

**27:25**

It probably it has like samosas, which is like an Indian appetizer. What else can I think of? I'm even forgetting, I don't know, like, pakodas. Pakodas, right.

**27:41**

Yeah. And now you spell it, It's probably pakoras. Yeah, so. These these are the beef fried. All of them are beef fried for that matter. So maybe maybe you want? To order this, maybe you want to order something else. Your choice. But anyway, so that's what is in a database. But now the free.

**27:57**

This is the only thing that is free, the rest of it is is not free. So right, So let's just give it a colour. You come to the restaurant, you're going to get this for free, right? That's that's how we roll at this restaurant. So the the request goes in to a database and this is this information is stored in the database.

**28:16**

That's where. So this is like a complete request, right? Someone comes in, they have a place to to sit down. That's your interaction. And there's no, we didn't discuss security. It's like a public restaurant, right? Anybody can. Restaurant is a public place, so to speak. It's owned by private owners or organizations or companies.

**28:34**

But anyone can go to any restaurant and eat. So it's an open-door policy, right? So which is different from a typical web application. Because you're going to have folks register, sign up, and sign in.

**28:50**

In our case, it's different. So let's say this is public, right? So anybody can come in and place the order, and then they'll be served food. So they come in, they sit down, there's an interface, there's a kitchen, and maybe we can do that.

**29:06**

A little bit of color here, so let's say I'm going to stop now, then enter. Work. So maybe, maybe add the focus there, I'm not sure. I'm pretty sure there's some bug here. Okay, that's the kitchen.

**29:23**

And then let's also add a lovely dining table. It looks pretty fancy, so let's pick that one. Okay. So, all right, we have two customers.

**29:40**

They're sitting at this table and then they, you know, if Holly got avocados, Raj should also get it, right? But let's add another item here. Let's say now they got the free food.

**29:56**

Now Holly's like, hey, she looks at the menu. She's like, "Yep, I like, I want to order like an appetizer or, you know, she feels like indulging." She's going to skip the appetizer and go to a dessert. So let's say I copy this, I go here, paste it and I say get desserts.

**30:16**

I'm going to say Neem equals Rasamalai, which is an Indian dessert. Is it okay? One of my favorite ones. I haven't had that in years. But that's a different story. And then this is a food procurement. Now again, this also needs to be procured.

**30:32**

You might have different vendors, but it will be stored in the same place. So now if I place that arrow here, like the line with the database, it will give you the impression that all of them sit in different databases. That's not how it works, right?

**30:48**

So let me delete this and then let me actually draw an arrow from here to not chosen and I will change the color to and then make it thinner. I don't think I picked the right color.

**31:10**

Yeah, I don't know what this color is. Let's see, it's the default color, so I'm just going to leave it this way. Add something along these lines we can. I don't think you should have a color palette, but maybe, maybe not, right? So this is there.

**31:26**

There are some lines also lives in the same database. Now you can have multiple databases. We'll expand on this and add more complexity as we go. Now Holly ordered this, and she's going to get what she asked for because she deserves it. So I'm going to say let me take let me see if Miro has Indian desserts.

**31:46**

I doubt it. Yep. But it's. I'm sure it has a cake. OK, let's go get and let's get this cake. Alright. It's not a rasamalai, but but we know we'll pretend that this is a rasamalai. Looks like a chocolate.

**32:02**

Cake. OK, I go there, the order is placed and then Holly's going to get it right. Now she has more. Food. But of course, she's paying for that extra food. So that's so she made the request from the user interface to the API to endpoints to more specific filtered requests and this is a GET as well.

**32:24**

And then the content, the data, the sorry, the food come from from your procurement from procurement that's happened in the past. So let's let's just zoom out and see how this looks. I don't think that looks too bad. It's it's very tiny because I'm not on my Mac, so that was a smaller.

**32:44**

Window, but you get the idea. So it's half hour and I think this is all right. Let me actually give it a name. Let's call it restaurant. Web app, right?

**33:02**

OK, and Yep, I'm going to just start it so I can find it the next. Time let's. So this is a start, right? And then we can. I can even make this. I don't know if I can make it public actually let me see, share anyone with the link and access can view what if I want?

**33:23**

Oh, upgrade. Enable commenting. OK, we will upgrade. Copy the board link, I can share it. You can comment on it right now, but maybe maybe. Oops. OK. Yep, that's fine.

**33:40**

We will. We will. Find the plan here. I use another mind map service, but this this one's actually become quite popular and it's not too bad. So let's just use. This. So let's go. Let's start here as a foundation, and then we'll build on this, right?

**33:55**

We build on this, make it more complex, introduce a lot more tiers. Just, you know, just by looking at food and the color, it makes it a little less technical and I think it's a bit more fun maybe. Maybe right. And let me know what you think. Hopefully, hopefully, hopefully you'll you've.

**34:13**

Learned something that you didn't know. Already, before I end this video, remember to go to I'm going to create a huge. I'm just kidding. So let's make it really, really big. Remember to go to snowpal.com to manage your projects.

**34:32**

Whether you're in college and school and at work traveling, you're a YouTuber. A restaurateur, or a business owner. It doesn't matter what you do, you need. You could use structure I'm pretty sure. And then if you're not looking for a complex tool that takes you a long time to learn if you wanted something quick.

**34:52**

And convenient and actually pretty cool. Check us out on the web and also go to the App Store and Play Store. We have our mobile app as well and that's basically it. I hope you have a good day. Have a Good Friday. Thank you.