- As this course is about code improvement,
a complete application has been included
as a starting point.
Let's get it installed
and take a tour of what it has to offer.
Switch over to VS Code.
The first thing we'll do is set up our workspace,
under start click open folder,
and I'm going to navigate to the desktop,
which is where I've put my exercise files.
Select the Nadia folder,
and then click select folder.
If prompted, save the workspace.
Now that the workspace has been set up,
let's take a quick tour of the code.
The bin folder contains just one file, www.js.
It's a standard express entry point
that configures an HTTP server
and then executes the app.
We're not going to be making any changes here.
The lib folder contains our custom code.
The middleware folder contains auth.js,
which just configures a basic auth middleware.
The schema folder contains a custom class
that defines the structure of a reservation.
It has a constructor,
a helper to combine a date and time
and a validate method.
In the route,
there are 2 files, connects.js,
which sets up the database connection
and reservations.js,
which exports functions used for acting on reservations
including retrieval, creation, saving,
and a validation wrapper.
The migrations folder contains a connect schema,
which we'll import before starting the application.
The public folder contains the front ends
of the application.
In Triv contains third-party code
and the CSS, images,
and JS folders are pretty self-explanatory.
The routes folder contains 3 routes.
Admin is the administrative interface.
Index is the homepage
and reservations is where the bookings take place.
The last folder is views,
which contains the pug templates.
If you weren't familiar with it,
pug is a successor to jade.
This isn't a front end course,
so we'll be leaving this alone.
Finally, we have apt.js,
which is the main express application.
It is intentionally sloppy
and has some inconsistencies right off the bat.
Let's get this project installed.
Open up the terminal by pressing control and backtick.
First, let's tell NPM
that this is not a production environment.
Type, NPM, space, config, space,
set, space, dash G, production, false.
I'm going to use NPM
to install everything we need.
After a moment,
all dependencies will be installed.
We will need to run a connects migration
in order to use the sequel light database.
Type, NPX, space, connects,
KNEX, space, migrate, colon latest
and press enter.
We're going to be using a debugging mode
that is built in,
so we can see verbose output from the application.
Type NPM, space, run, space, debug.
The application will bootstrap
and we'll see a log file in real time.
Open a browser and position it,
so you can see both the log
and the browser.
Navigate to local host port 3000.
This is the homepage for the restaurant.
There's no functionality here except
for a link to the reservations.
Let's click on reservations now.
This is the booking request form
and this is what we're going
to be working on cleaning up.
Let's book a reservation for today.
Pick a time,
for 8:30 PM,
and there's only one in my party.
My name is John Peck
and my email is going to be username,
just username and no app domain
because this is a bug in the application.
Enter in a phone number,
which will be 5555555555
and click the email icon to toggle the message
and type hello comma world,
click request booking.
Great, we've made a reservation,
even with a bad email address.
Want to see it?
Navigate to local host 3000 slash admin.
The login and password are admin.
Only the best security.
Don't save this password.
The reservation booking request we made is shown.
Let's clean up and shut down the server.
Switch back over to the terminal,
click to focus
and then press control and see.
It'll ask if I wish
to terminate the batch job,
say yes, press enter.
It's functional, but we already know
that there are problems.
Ready to fix them?
Fantastic. Let's get started
with no JS testing and code quality.