For the next project we are going to build, I'm going to ask you to first download a starter package.
That's a zip file that will be attached to this video.
Now let me explain why we will be doing this.
The reason is that in the previous project, we've built a functional framework apart from building
the project.
And this starter package contains the code of that framework that we've built in project number two.
It doesn't contain the logic of the previous project because we are building another one.
This is about building the third project, which is the file sharing app.
But some of the things can be reused.
Now, I'd like you to just pause the video now and get this resource under the video, extract it and
open it inside Visual Studio Code or your editor of choice.
So we are in the same place.
So you are also looking at the directory structure, because I'm going to now explain what all those
folders contain.
Which most of you should be familiar to you already.
But if I made any changes and I did make.
Tiny changes, I'm going to explain them.
So let's begin with this core folder so you can find the.
Same files that were there before.
For example that's app database error handling the middleware.
Model router and view.
But what's new is we have this three folders that weren't here before.
And if.
You were paying attention, you could have found those folders inside the app folder before.
So I've decided that those can be made generic, like the authentication middleware that's making sure
we've got access to the user.
Then the CSF middleware that should be generic.
We shouldn't be writing this from scratch every single time.
And also this view middleware that gets the user, the currently authenticated user available in the
views.
Then we've got some models like the remember tokens and the user model.
They were made generic.
I don't think we would have to make a lot of changes to those, but it's still possible.
Anyway, I think we can just reuse them in any apps that we've built.
And then the services.
So things like authentication, I think we should just reuse that because it was hard to make, and
it's safer to reuse something that we have proven works.
Same with authorization.
But in case of this one we've made that an abstract class.
That's the only difference.
And I have removed the code that was specific to previous project.
This means that this class being abstract, It has to be extended in this project and customized.
Next up we've got the CSV class for the CSV protection.
It's also exactly the same and we're just going to reuse it.
And then the Remember Me functionality when you sign in we're also going to reuse it completely.
So that's why it has now landed inside the core folder.
Now let's go back a bit.
So inside the binary folder we've got the console scripts.
So we are using two of them the schema fixtures and schema load.
So this one is responsible for loading the schema that can be found inside the database folder, exactly
the same way as we did in the previous project.
And I think this can be something that we do every single time.
This can be a reusable thing.
Now schema contains the definition of users table and remember tokens something that I think every app
would need and you can add to those schema.
Every new table that will be required.
And this is exactly what we will be doing.
But the script remains the same.
It will just load the schema and update the database table.
Now the fixture script was simplified a little, and this is because we no longer have the posts and
comments table.
As a quick reminder, this fixtures script is supposed to load some dummy data into the database so
that we don't have to click around the app so much.
And in our case, I think we always have users.
That's why we are creating some user accounts.
We are clearing the existing data for users and remember tokens resetting the SQLite sequences.
And this code is responsible for loading the users.
We're going to be changing the scripts for all the tables that we're going to add in this project,
but I've deemed that this part is really reusable.
Okay, so we've covered the binary folder.
Now let me collapse this.
And now let's jump to the app folder.
Let me start with controllers.
We've got two out of the box the index one to display some kind of a main page which is dummy doesn't
really contain anything inside this template.
And our controller.
Now this one is not a dummy one.
It contains exactly the same implementation of the authentication.
So the signing in process as we had in the previous project.
So nothing has changed here.
I just felt that this controller could really be reusable.
There is no point in just doing it again.
That's why we have it as part of the project.
Now next up we've got this views folder.
But let me talk about this one last.
So next up we've got the database folder that should be familiar with, got the schema file and then
the database file.
Then we've got the logs folder, which should contain all the error logs that happened during the project
execution.
And our error handler class is responsible for populating this one.
So for details you obviously need to watch the previous project which explained all of that and where
we have built all of those things.
And then we've got the public folder.
Nothing really changed here.
It is exactly the same, this index PHP file.
Next up we've got a dot env file.
It's empty for now.
And that's a completely separate concept that I would have to explain later on.
For now it's an empty file and we don't have to worry about it at this very second.
So let's close it because I am going to go back into this.
Then we've got a bootstrap file which hasn't changed.
So it's exactly the same now composer file contains, well, the basic info.
We are still not using any libraries.
We've got those namespaces defined and we've got some scripts.
So no changes in here.
The config file.
Well it contains the application name we can set.
So enable or disable the debug mode.
And we have some database settings.
So no changes here really.
But we're going to be changing this and working with environment variables.
That's related to this dot env file.
But as I've said well this has to be explained separately.
Then we've got the helpers exactly the same functions defined.
So nothing new in here.
And the routes.
Well we've got the middleware registered automatically so we can use it right away.
That's the reason we just bundle this middleware with the starter package.
Because they This middleware is just useful for every single project.
We've got the main route defined only and the authentication route so that the authentication can work
out of the box.
Other than that, it's no different.
Okay.
So now let me talk about the views.
The last thing.
So I have bundled couple of views with this starter package.
But we have built everything before.
So that's nothing new.
We've got this main view which displays the dummy page which we obviously would have to change.
But other than that we've got the layout, we've got the pagination partial which we have built in the
previous project, and it is exactly the same.
And I've bundled this partial because it would be useful.
We've got the error pages or error page templates for different errors.
There are almost the same.
And the authentication form to sign in.
Now it's the same with the tiny change.
I've introduced a frontend framework called bootstrap, so I was thinking about introducing either Bootstrap
or Tailwind CSS.
I've chosen bootstrap because it requires less work to get some decent view, and this course is not
really about the design.
And you can still use any CSS framework, whatever you prefer or whatever you use at work.
But we just want to make this app look a little bit better.
That's why I've added some classes.
That's the only change that I've actually made.
So I've introduced bootstrap.
It's inside the layout.
So I've added this link to the CSS file from the CDN, which means it will be downloaded from Content
Delivery Network.
You don't need to have it locally which has some benefits.
It's going to load faster for your users and the loading of the CSS file would be automatically optimized,
so you can see some classes added inside some of those templates.
And they are all bootstrap classes.
I'm going to briefly go over them in the next video.
That's why I didn't want to talk specifics about bootstrap in this video.
The only thing I'd like you to know is that this files, this form, this layout, they really haven't
changed except the added classes.
So you can still see familiar things like if the user is authenticated, we need to show the username
and the logout button.
And we also have CSRF token in here.
If the user is not authenticated then we add a login link and also the form should look familiar.
The login form I mean so there is a form.
There are some inputs labels.
We've got this.
Remember me checkbox.
So mostly things that were added here were classes.
Okay, so let's not go too deep into bootstrap for now.
Let me just show you how the project would look like right now when we start it.
So first I'd like you to open the terminal and make sure that inside the terminal you are in the folder
of this project that you have just downloaded and extracted.
That's super important because we have to run composer install.
So this would create the vendor folder and the composer log file.
It's essential that we run this command first.
So you should see an output more or less like this.
And let me close the terminal for just a second.
If you have this composer log file and the vendor folder it's fine.
Then it means everything went fine, which means open the terminal again.
It can be inside the visual Studio Code, or it can be a separate terminal.
This doesn't matter.
Next up, type php hyphen s localhost 8000.
And then just make sure no other project is currently running at this port.
How do you check that?
Well, if you have run any projects before using this specific port, just make sure they are stopped.
Typically you can stop them by pressing Ctrl C and let's point to the public directory which contains
the index.php file.
So now the project should be started.
If it's not starting.
Choose a different port and let's take a look at it.
So this is how it looks.
So the things that are different is basically the styles.
And this comes straight from this bootstrap framework.
So we've got this navigation bar and the index page and the login page.
So as you can see the form looks much nicer.
I can try and sign in using some of the accounts that we have also used before.
So as you see, something has went wrong.
Probably I haven't created the database schema.
And by the way you can also see how the errors would look like.
So this really wasn't complicated to make.
And as I've said I'm going to briefly go over the features of bootstrap and why it is a great choice
if you want to give our apps some decent looks quickly.
And basically that was my goal.
So I think that this should cover a lot.
And next up, I'm gonna talk in more detail about the bootstrap and how we are using it and generally
what it is.
And then we begin building the project by using quite a lot of code that we have created before, so
that we achieve some code reusability, which is very important when we are building some bigger projects.
Births.