Hey, welcome back.
At this point, we have come up with this app.
So we have two columns and we have some content here outside of those columns.
Now we're going to have to add two more columns.
So if we look at that PDF, the sketch we did.
Which is here.
I've added it to my project directory to have it here handy for convenience.
And so this is what we're going to add.
One app here.
Three for answer one.
And for each app, we're going to have the title, the description of the app, the image thumbnail,
and also the link to the source code, which is going to be the link to the GitHub repository for each
app.
We don't have those links currently, so we're just going to have one simple link for every page at
the same link.
And so these data are stored in CSV.
So we have the title, the description of the app, the URL and the image file path.
For example, we have the two two app, the portfolio website app, the PDF templates app and so on.
Images are stored in here.
And with that let's go to Main SPI and under this aren't indented, we will add two columns.
So first let's say call three and call for create them as objects dot sd dot columns.
So this columns method will create two columns, store each column object in these two variables.
And then we say call three.
So what do we put in column three?
Which is this one in here?
So that here is column three and that one there will be column four.
So let's add the title first.
Before accessing the title.
We need to access the actual data, the complete data from data CSV.
And for that, we're going to use pandas.
So import pandas.
Pandas is a third party library.
It is used to read CSV data.
So let me demonstrate you in the Python console how pandas works.
No, pandas has already been installed by streaming it because it's a dependency of stream late.
Otherwise, you could go to Python packages, Search for pandas.
And if you see the install button in here, then you can install it.
In my case, it's already installed.
I hope it's the case for you too.
Then you can import pandas.
So like I did and we can import it in the python console as well.
And then you say you have this variable and you point to pandas that reads See CSV.
So CSV is a function of the Pandas third party library.
And this function expects as output the path to the CSV file.
In this case it is data.
Does CSV data that CSV is located in the project directory in my computer in here.
So it should be the case for you as well.
So provide it there and.
Presenter And now the F is.
But this.
However, the reading was not done correctly here, actually, because pandas actually the read see
as the method doesn't know how to read this data.
So what we got is just a bunch of texts.
It's not formatted correctly, so to format it correctly, press the upper arrow key until you get this
expression where we read the CS with data.
Then you give another argument.
So after a comma you need you need another argument for the function.
This will be the CEP argument is equal to.
Semicolon as a string you see in double in double quotes.
So I'm giving it a semicolon.
So I'm telling the reader as a function that the data are divided, are separated.
CEP stands for separator.
So these data are separated by a semicolon.
If I press enter now and then I call the F again.
This time you're going to see a better structure.
So you see we have the title column.
So all these belong to that title column.
We have other columns as well, but they are not being displayed here because it's too much data.
However, you can also view the dataframe in here.
You can press that view dataframe button and py charm will show you this.
So python and pandas have passed this dataframe as a table.
So all the data are well structured now and we can access these data using some other functions which
you'll see in just a minute.
So that's what we have, the title, the description of the URL and the image, that's what PANDAS does.
So you could also do this parsing using that with open data CSV method as file.
And so you can load this as a string.
Let's say you say content is equal to file dot read.
The contents and the contents variable will be just a string.
So these are not ports and you could pass them using Python methods like string methods to split this
text and so on.
But that would be too much work.
It would be like reinventing the wheel.
So Pandas gives you the data structured in a tabular format so you can access what data you want.
So in this case, we want to access the titles of these data.
So basically we want that column.
We want to display all these titles on the web page.
To do that, we need to iterate over that data frame, which would be for index row in D, F, So F
is the variable that contains the data frame the table.
And then you see print row and we only want the title.
So the title is the name of that column.
So let's execute.
Execute again.
Now we've got an error here.
And the problem is that I forgot to add something here.
So let me call that again with the operator Key in point, Sean, you can call the previously executed
statement.
You can go with the upper arrow key above here.
Right.
Arrow key.
Go to DF and add a method itr rows you see with double or it arrows.
That's a method with parentheses.
So basically we access know the rows of the dataframe.
So this method gives access to the rows and then we iterate over those rows.
So now you need to go with your down arrow key to the last dots here and press enter.
This time we got the correct results.
So these are all the titles.
So basically that gives you the title of each row in the dataframe to do app portfolio websites, PDF
templates and so on.
So with that we can go to main dot SPI.
We import pandas before creating columns.
We read the dataframe using pandas that reads CSV data.
CSV another set of arguments which is going to be a semicolon.
If this was a comma, you'd have to write a comma here, although this could be omitted if the data
are separated by commas, because by default this RCEP argument is equal to a comma.
But when the data are not separated by commas, you have to explicitly declare the separator here.
And then with call three you say for index row in DF that it rows.
That's a method, a colon.
And then I'm going to use a header to write a big text.
You can also write the right method, but a reader will write an H one header, so that would be row.
Title.
So in the case of the Python console, we just printed out the titles, but here we write them on the
web page.
Yep.
I'll make some space here and let's run the app in the terminal.
So that would be stream lit.
Run Main dot P.
That's the name of my file.
And the browser should open automatically.
Yeah, that's it.
So these are all the titles.
They are rendered in one single column for now, but we can fix that easily.
The way I would fix that is by adding here another column.
So call three that one.
Again, we iterate for index row in default eight rows.
See that header row title.
I know you are confused.
What I just did is identical with this one.
But we can do some small change here.
So let me show that to you in the python console.
First we've got the DF dataframe, which has 20 rows you can see at the end.
We get the statistics about this dataframe.
So it has 20 rows and four columns or both.
If you use a list indexing syntax such as 0 to 10 or just that which is the shortcut of 0 to 10, if
you execute that, you're going to get only the ten first rows.
You can cancel that.
So only the first ten rows we've got in here.
And if you are the last ten rows, you can do ten like that.
And that's what we get.
So from 1011 up to 913.
So that's the indexing of the data frame.
It starts from zero.
So zero is the index of the first app up to nine for the first ten apps and 10 to 19 for the second
ten apps.
So therefore, we can go to the code here and say DF.
Up to ten and.
From ten up to the end of the dataframe.
I can save this script, go to the browser refresh and yeah, those are the titles.
Split it into two columns.
And that's how you work with pandas.
So as you can see, this might be looking like a simple website, but it does teach you some very fundamental
advanced, actually Python concepts.
PANDAS is more into the advanced part of Python where you work with data.
And before we close the video, let's commit the changes.
This would be day 22.
And what we did is render the titles, the app titles.
Let's be more explicit in two columns and commit.
And that's it.
Thanks a lot and I'll see you in the next video.