1
00:00:00,260 --> 00:00:03,420
In this section, we'll be developing the text-based

2
00:00:03,420 --> 00:00:05,960
search feature for our Travel Companion

3
00:00:05,960 --> 00:00:07,200
application.

4
00:00:07,200 --> 00:00:09,900
And in this video, we'll be discussing exactly

5
00:00:09,900 --> 00:00:12,220
how we plan to achieve that.

6
00:00:12,220 --> 00:00:14,800
Let's start with the user interface.

7
00:00:14,800 --> 00:00:16,780
Here we'll need a text field for our search

8
00:00:16,780 --> 00:00:19,740
box for the user to type in a city or country

9
00:00:19,740 --> 00:00:21,640
that they want to visit.

10
00:00:21,640 --> 00:00:24,360
Next, we'll have a set of checkboxes for the

11
00:00:24,360 --> 00:00:26,080
user's preferences.

12
00:00:26,080 --> 00:00:29,880
This will include items such as beaches, cuisine,

13
00:00:29,880 --> 00:00:32,180
historical sites, and so on.

14
00:00:32,180 --> 00:00:34,680
The user will only be able to select 3 of

15
00:00:34,680 --> 00:00:36,080
these.

16
00:00:36,080 --> 00:00:38,440
After that, just below the form, is where

17
00:00:38,440 --> 00:00:41,000
we'll be displaying all the suggested destinations

18
00:00:41,000 --> 00:00:43,320
returned by the Gemini API.

19
00:00:43,320 --> 00:00:45,060
As we have seen in the walkthrough of the

20
00:00:45,060 --> 00:00:47,560
application, these will be displayed in column

21
00:00:47,560 --> 00:00:51,000
cards each displaying the following information.

22
00:00:51,000 --> 00:00:53,600
The city or place suggested.

23
00:00:53,600 --> 00:00:56,280
The price range to visit the spot, that is,

24
00:00:56,280 --> 00:00:59,660
budget, moderate and luxury, the description

25
00:00:59,660 --> 00:01:02,900
of the place, the best time to visit based

26
00:01:02,900 --> 00:01:06,500
on weather conditions and area, and top attractions

27
00:01:06,500 --> 00:01:08,880
in the suggested destination.

28
00:01:08,880 --> 00:01:11,420
Each destination card will also contain a

29
00:01:11,420 --> 00:01:13,620
check weather button that will retrieve and

30
00:01:13,620 --> 00:01:16,160
display weather information for the selected

31
00:01:16,160 --> 00:01:17,400
destination.

32
00:01:17,400 --> 00:01:19,680
So that's the structure for the front end

33
00:01:19,680 --> 00:01:21,340
of this feature.

34
00:01:21,340 --> 00:01:23,520
Now let's discuss the back end.

35
00:01:23,520 --> 00:01:26,040
At the back-end, our front-end form will be

36
00:01:26,040 --> 00:01:28,660
calling an endpoint to request the destination

37
00:01:28,660 --> 00:01:30,060
suggestions.

38
00:01:30,060 --> 00:01:32,220
This will be a POST back-end that we will

39
00:01:32,220 --> 00:01:36,620
name api-slash-suggest-by-location.

40
00:01:36,620 --> 00:01:39,740
And this will take two parameters, location,

41
00:01:39,740 --> 00:01:42,100
which is a string name of where the user wishes

42
00:01:42,100 --> 00:01:45,120
to visit sent from the search field in the

43
00:01:45,120 --> 00:01:48,600
front-end, and an optional list of preferences

44
00:01:48,600 --> 00:01:50,540
sent as strings.

45
00:01:50,540 --> 00:01:53,380
This endpoint will take this data, prepare

46
00:01:53,380 --> 00:01:56,200
it into a prompt, and send it over to the

47
00:01:56,200 --> 00:01:57,660
Gemini API.

48
00:01:57,660 --> 00:02:00,000
The API will then return a structured JSON

49
00:02:00,000 --> 00:02:03,340
output with all the data we need for the front-end

50
00:02:03,340 --> 00:02:04,760
to display the results.

51
00:02:04,760 --> 00:02:06,700
And that's the plan.

52
00:02:06,700 --> 00:02:08,960
In the next video, we'll start developing

53
00:02:08,960 --> 00:02:13,000
this feature by building the back-end endpoint.