Building a Deno HTTPS Web Server with Self-Signed Certificate

Key Takeaways

is going on guys my name is hussein and in this video i want to explore the new deno framework and what i want to build in this video guys is i want to build an http server with dino and and then i'm going to build an http server so we're going to generate like a self-signed certificate and then spin up a net dinner server and serve the tls uh certificates or these self-signed and uh yeah how about we jump into it guys so they know as of today uh today's what june june 28th 2020 does not support http2 so we'll be dealing with just pure http one one that's not a big deal but i i still don't think it's production ready to be honest right but doesn't stop us from tinkering with it how about we actually jump into it so the first thing actually we need to install dino and the easiest one way to install the note is to go to denodet land the site let's open the site they know that land and then uh follow the instructions i'm going to use homebrew to install the notes which is the easiest thing and when and uh and um in mac and uh i recommend using chocolaty if you're a windows or just download it and do the curl thingy right just does the job right so once you have it let's go ahead and install it real quick so i'm going into the terminal i'm going to go pro install deno and then updating homebrew all that jazz that's it we have deno installed so how about we actually jump into it and start testing so i'm going to open a brand new folder let's go to javascript playground i'm gonna call it uh deno http s actually it's both http and https but sure and i don't know anything about typescript which is mostly the language that is written in deno but i am going to do it with vanilla javascript i said because i don't know typescript and frankly i don't care about that language in node we used to do like npm init and npm installing all these packages however in deno we just basically reference whatever we want from available urls because once you have it it will then will start caching them so the first library we're going to import is is the serv library which will allow us to serve http server responses so we're going to do import serv from https.land and this is a standard library so we're going to pull it from the standard and then you specify the version and i think the standard library is now at version 59. 59 dot zero and then you can specify older versions if the recent one is like buggy or whatever and then do http finally server.ts because everything is typescript in and just like that now we have the class that is serve and now we can create a server object i'm going to create serve and that's it you do a serve you create a serve object here and then you specify some parameter and uh the first parameter is a hostname like where do you want to listen to and the default i believe is 0 0 0 0 that means all interfaces but since i'm not listening to any other interfaces the local interface is enough and the second parameter is the port obviously right what por do we want itit that's famous right and that's it for the https this is an http pure unencrypted http one for https we're gonna add two other parameter but we'll stick to that right now and here's the interesting part that i i absolutely love right and we can say just like hey we're really rich here that means i'm listening on puerte 80 right and then we can start consuming that so the way this http server is implemented is using the generating function or the async iterator and the asic iterator does this for a wait for a weight and then for every request that comes in in this server right you will be you will start consuming that request and the way it works is this is basically how async await works and generator functions in general works that you can i'm gonna reference the documentation for async iterators a really powerful thing really and i'm really uh glad that the dental team's using that because it's it's so it was very confusing at the beginning but once you understand how it works it is really powerful so we are the at the beginning there are no requests so we're stuck here right and by stock we're not really waiting it's just deno's not doing anything right because the uh the control is somewhere else and the moment the server receives a request that is the tcp stack and the http stack start assembling the packet and now we got a request a legit request that deno will start yielding literally it will yield right there is a command called yield and it will yield us the request and then immediately we will jump into this loop and we'll start uh consuming our stuff so we can do that console.log request dot i don't know the url for example right that's for a stud let's just do that let's just print whatever we get back from the server without responding for now okay and uh that's it how about actually start running and testing this thing okay so to run you do deno and then run and then literally index.js which is our file right and this is going to yell at us and that's another beautiful feature in denim it says anything has to be given permission to do right and and in dental this is unlike node.js where you can just like hey just run a route and you can pretty much do anything no then you have to explicitly provide flags allow networking allow reading allow whatever right which is which is a good semantics to be honest right so what we're going to do is deno same thing dino run dash dash allow that's exactly what they told us right allow dash net net and then we do what index footages and just like that we are running baby on port 8080 how about we test this thing firefox localhost 8080 and obviously this is going to continue spin up because we didn't really respond right but if i come here look at that we actually printed something kill it we're saying we got that url not really fancy so let's kill it how about we actually respond this time this time i'm gonna respond but if i can spell right this is how you respond you respond with uh basically a whole json object and we say okay my the body of the response for now is i don't know some strength yay what is up then we're going to show how to return actual json object so by default the content type will be what text header right so let's do that boom we're listening again go here refresh hey what is up hey what is up so let's check what did we actually return from the network refresh click on this guy we returned only content length that said the server return only content length all right let's spice things up a little bit so here's what we're going to do i want to return a json object and as you guys know if i want to return a json object i need to tell the client that hey i am returning jason dude so what do you do is basically create headers equal new headers we're going to create a brand new headers object and then we start adding our headers right append we're going to do what content type and that puppy is apple cash on json so just one one header for now right and that's it oh that will be just a comma because that will be the key and that's the value right and there we just literally say headers is hedars right and obviously that's not really jason is it son i don't know let's return on jason username hussein right and i don't know id is one two three four that's a json object obviously nobody likes this right returning an actual json object in this it's not what it's expecting and that that's actually a lie i like this object so he says like hey i don't know what you're returning sir that's that's not i'm expecting a strength so you really need to convert this into a json string by doing this right and you can create variables and all that jazz right and now we're going to retain a beautiful jason so kill this thing run it again and now go back refresh and here's a good it firefox recognize that it's adjacent let's prove it's a jason i'm gonna go here network refresh look at this beautiful beautiful and you can start returning all kind of headers that you want all right how about we try in chrome enter looks like it's working and for fun let's use the fetch command right fetch http localhost 8080 and then uh since we're expecting jason we can do this right console.log boom and then we get back the json right that's how we we can establish json commands right awesome and you can do send a post request as well and do the same good old stuff right okay uh how about we actually make this https all right to make this into an https server all we need to do is literally change this into tls right and we're going to get started yell we're going to kill the ldap because now we need to specify two parameters first the third file which i'm going to specify here and the key file which i'm gonna specify here but where the heck do we get this and i'm gonna refresh the video that i did for node.js http 2 to to show you how to do you use let's encrypt to get legit uh certificates and a private key but for the sake of this video what i'm gonna do is generate an open ssl self-signed certificate and i talked about certificate guys in this video in this channel check those videos out so to generate an op a self-signed certificate you do this following command you do open ssl i believe should be available in windows and mac i'm going to zoom in a little bit here so you can guys can see so openness world i'm going to request an x 509 certificate that's the type of certificate for the web pretty much the standard and then i'm going to do a new key here the type is rsa and it's going to be a four zero nine six bit key so it's really hard to break but that's the algorithm the the public key encryption to generate those public and private keys right and then nodes sha 256 the subject doesn't really matter it's all um you can you can have it to say anything but the common name is equal localhost because it's for me here zoom out and here's the most important thing i want a key out this is the private key right private.pm and the public key will be the cert.pem right so that will be the certificate which doesn't really just include the certificate it worked with the certificate and the signature which is signed by the same uh same party which is us right it's not really much trusted but it's a test anyway and once you do that i'm gonna reference the command below guys so you don't have to really type it in almost let's check our command all right we forgot a dash here there you go so start generating the private key and the public key and just like that we have two beautiful files obviously not a good idea to have these files or laying around or checking them out and i get help repo i'm not gonna do that and obviously actually you saw that this is automatically grayed out because they are in my get ignore uh code so they if i check this code in for you guys it's not gonna be it's not gonna show up and all final thing is the search file will be the dot pen right that's the file uh that's the type of the output certificate and the key is the private.pm and now how about we test this thing out deno dash uh run index.js no we have to allow a net right and index.js and we're gonna get yelled at again but this time another good thing see says hey you're trying to read a file deno cannot read files by default you have to specifically tell meter right so this way if you're running your application and let's say someone injected some code into your application that does something that it doesn't supposed to do then the application will error essentially right which is just pretty neat it will protect you from excess attack now allow read enter now we're actually listening on port 8880. all right test this thing out in chrome in chrome we're going to kill yell that and there's no way for me to actually proceed because chrome tries to protect you as much as possible right i think there is an option but i can't find it so i'm gonna go to firefox because they're more uh leaning all right and then just like that you're gonna get an error that's okay because we know our certificate is not really trusted and we want to we you want to see these errors these are good guys except this once you accept it and just like that we are in baby it's not really secure but it's an http server https server so follow that similarly guys you can easily generate those with let's encrypt i'm gonna reference the video that we did with node.js it's it's a very similar thing however i want you to pay attention to that this is uh if you refresh now look at this it's an http one one deno as of this date recording of this video does not support http 2 yet right so there is a lot of work people are working on this this is not an easy task right obviously but yeah so they're they're building all this code and then they're starting to bring the support of http 2 and and all other certificates i'm not sure guys if there are like options here more options to specify like the um you know the fine grain uh tls uh options such as okay i want this kind of handshake i'll go to them i want the uh i want tls 1.2 versus ps 1.3 i think this is by default how do we find out this is let's actually check this is ts 1.3 right so okay that's good so then by default uses tls 1.3 and uses a aas so that's that'll go to them and uh since it's still 1.3 definitely it's diffie-hellman as a key exchange i'll go to them all right guys that's it for me today i hope you enjoyed this video give it a like if you like it dislike it if you didn't like it i'm going to see you in the next one what do you think of dinner do you think it's going to take over the world as everybody says or no you think it's just a fluke let me know in the comment section below and can i see you on the next one you guys stay awesome