Original subtitles

0 All right. 1

So now that we've looked at a lot of the technologies that are used in front end web development, and we've 2

designed and developed web sites using HTML, CSS, Javascript, Bootstrap, jQuery, in order to become a 3

full stack web developer, we now have to learn about the back end. 4

Now what exactly is a full stack developer? 5

Because this is a term that's brandished about a lot and especially in the context of development jobs. 6

So, according to Linked In, these are the hottest jobs for 2018, and squarely on that list is a full stack 7

developer. 8

So what exactly is a full stack developer? 9

Well, a full stack basically is just front end development plus back end development. 10

And once you're familiar with both, then it's this flexibility of working with the front and back end 11

that makes you so much more desirable as a developer. 12

Up till now we've only been interacting with front end technologies. We’ve learnt about HTML, CSS 13

and Javascript, as well as jQuery and Bootstrap, which all enable us to design our web site and also 14

allow for user interaction on the client side, in the browser for example. 15

But now we're going to look at the back end. We’re going to learn about Node.js and other technologies 16

that enable us to interact with databases or have business logic on a server and a whole lot more. 17

Now what exactly is the back end anyways? For some of you out there who are a bit more immature like myself, 18

don’t worry, it's not something that's rude. 19

Instead it consists of things such as a server which will serve up your files your HTML, your 20

CSS and your Javascript, a database which can store your user data such as their log ins and passwords, 21

as well as your applications. 22

So this is where you create your business logic, 23

you determine how your web applications work, 24

for example things such as calculating flight prices, or making payments, that sort of stuff. 25

So let's look at a real life example. Let’s take a look at the Eventbrite 26

web application. 27

And it's a web application because it doesn't just display information, 28

it also has functionality on the back end that enables it to do something concrete, such as find events 29

or allow you to book events. 30

So let's say we've gone to Eventbrite and we look at all the events that are happening today, and I 31

find something that is the Hogarth beer and music festival. 32

Well, that sounds right up my alley. 33

So let's go ahead and register and book a ticket. 34

So here I enter my name and I buy a ticket. 35

Well now, that information that consists of my name, how many tickets I bought, and my registration details 36

such as my e-mail, gets saved on the web site's databases. 37

And for simplicity's sake you can just imagine these databases as these giant Excel spreadsheets living 38

somewhere. And all of my data that I enter gets saved onto these spreadsheets. 39

And that means that when I come back at a later date, I'm able to log back on to Eventbrite, and it 40

will be able to retrieve from its database 41

all of the data that is associated with my account. 42

So, for example, it could retrieve my ticket to the Hogarth beer and music festival. Now a really great 43

analogy for a full stack web application, it's kind of like a restaurant. 44

So there is a front of house. 45

This is the main restaurant where your clients will sit down and have dinner. 46

But then there's also the kitchen, right, which is where the cooking is mostly happening. 47

And finally there's also the larder, which is where you store all of your ingredients and everything 48

you need to make the food. 49

In this analogy our front of house restaurant is basically the client side. 50

This is what the user sees in the browser. 51

They're able to interact with the web site using Javascript and they're able to see the information 52

that's being displayed using HTML and CSS. 53

Now, a little bit further back on the back end, we've got the kitchen, and this is analogous to our server. 54

This is basically the place where all of our dishes get served from. 55

So, when a restaurant goer ask for a Philly steak, then that order gets sent to the server, and the server 56

should send back what it is that the client wanted, which is the actual steak. 57

And finally the larder where all the ingredients are stored is of course the database. 58

This is where all of our user data, our event data, our ticket data, 59

all of the data that makes our web site work is stored. 60

So this is where the divide between the front end and the back end happens. It’s between the front of 61

the house and the restaurant, and the kitchens and larder. 62

Now, just as with restaurants, you don't actually have to create everything in the kitchens, 63

right? 64

You could have a restaurant where you make all of the dishes in front of the client, and you just do 65

it on their table. You bring all of the ingredients there and you make it right there for them. 66

Now the downsides in this case is that, firstly, your secret recipe that's been passed down over generations 67

from your great grandma to your grandma to your mother to your self, 68

well that's kind of exposed, right? 69

Anybody would be able to see what it is that you're doing, 70

and they would be able to replicate it. 71

And this is the same for the business logic of your web site. 72

If you had something that you wanted to keep secret such as your API keys or how you implement your 73

particular application, then you don't want that to be visible every time somebody loads up a web site, right? 74

And the other problem is that it can be really really time consuming to make the dish in front 75

of the client in the restaurant, because you would have to bring all of the ingredients, 76

you would have to make it one by one in small batches, and in web sites that translates to a long loading 77

time. 78

So if you are transporting a lot of code over to the browser where it has to be executed on the browser, 79

that usually takes a lot longer than if it was done on the back end. 80

So the alternative is we take our ingredients from our database, so our server interacts with the database, 81

then we execute some code on our server and we create the application or the dish, 82

in this case, which then gets served to the client side. 83

So that means we don't have to transport any of the ingredients, 84

we don't have to transport a lot of code, which will vastly speed up your web site, and also keep your 85

business logic hidden. On the back 86

end there's a lot of technologies that are commonly used for this purpose, and these include PHP, Ruby, 87

Java, Node.js, amongst many many others. 88

Now, in addition, there are frameworks, such as CakePHP or Ruby on Rails or Spring, Express, and these are 89

things that will speed up development using the particular back end technology you chose. 90

So a common one you would have heard is maybe Ruby and Ruby on Rails, and the main job of these frameworks 91

is to simply reduce the amount of repetitive stuff that a developer has to do, 92

and just like how you don't want to write the email boilerplate code out every single time you create 93

an additional page, 94

then in the same way a lot of these frameworks such as Ruby on Rails or Express, they make a developer's 95

life much much easier by cutting down some of the grunt work and saving you a lot of time. In the coming 96

lessons we’re going to be delving deep into a lot of this kind of stuff, 97

and we're going to be learning about Node.js as well as the most common framework that's used with it, 98

which is Express. And the best part of all is that we don't have to learn a brand new programming language 99

to do it, because Node.js runs on Javascript. 100

And this is why Node.js is one of the most popular back end languages currently, because it runs on 101

Javascript. 102

So for all of that and more on Node.js, I'll see you on the next lesson.