Web Application Development Course Overview

Welcome everyone, this course we are going to learn how to make a web application that will run on the browser. This application will be very simple. Take a look at this image. We are going to have a text area where you can type text. You're going to have a button to submit your text and that text will be added to a list of things that you have written before. So this is very similar to applications we have present day. Any applications you post something and whatever you wrote added to some sort of feed or list of things that other people can So this will be a very simple application and we'll demonstrate how to build both the front end and the back end. So we are going to use web technologies to accomplish this. Here on the right hand side I have some of the technologies we will be using to build this application. I'm going to call the application write something. You can call it whatever you want as you follow along this tutorial. So we have to usually split the application development into two parts. The side of the front end and the side of the back end. Front end is that which both what the user see they visit the application or site. Back end is what usually the user does not see. Back end is responsible for the underlying data for the application while the front end is more about the visuals, the interactions with the user. So the front end is going to be talking to the back end to obtain and write some data. That is when you type something and you click write that write make submission of the button will make a request to the back end. So the back end will know that someone that is you requested to add an entry to our database. Then the server side that is the back end will take that will make sure you're typing something that's valid and will add that to the database. Then we're going to have a list of existing entries here at the bottom. Those will also be read through the back end that ultimately talks to the database. Now for the technologies for the front end we're going to use html that the structure of the document. CSS to define the style, the visuals, JavaScript for the behavior and that is we're going to manipulate some of the elements that we see here in this document html document. The JavaScript will be what we call vanilla JavaScript meaning no frameworks the pure JavaScript. I'm going to use ES6 by the way beyond for the back end for the database that will be my SQL SQL database. Now for the server side we're going to use Node.js which is just JavaScript on the server side. This has a different name. We're going to use a framework called Express and with that we're going to create what's called a JSON API. API that will serve data in the format called JSON JavaScript object notation. API means a prequation programming interface. The way for our client side that is the front end to communicate with the back end to say request to write something to our entries or request to read all the entries. Okay so that is it. That's what we are going to do. The first part we're going to start at the front end, the second part of the other back end. Because we don't already have the back end for the first part we're going to have a draft and have kind of like fake data for the time being until we build out the back end and then we connect it to and finally we'll have persistent data that is data that won't go away after you refresh the browser. Okay with that I will see you on the next lesson.