web development course - part1 lesson 1 the web development full stack
of your options near the end of the course so don't worry about it for now tavanga is asking one more question do you need to know a bit of code the answer is guys this course assumes no previous knowledge so if you are brand new to the industry don't worry i will bring you through the whole process step by step quick warning though we do move very quickly so you will have to focus guys but it'll be worth the effort all right guys i'm going to stop uh looking at questions now and we're going to get into the class proper because i do want to get through the material with time to have a decent length q a session at the end so let's go ahead and move into the first topic of the day guys which is of course web development what exactly is web development a lot of you guys have taken on this course a lot of you guys know sort of what it's about but i'm going to try and give you a more formal definition of web development as well as what's involved in web development as a career as well because a lot of you guys will be interested in a profession in the industry which is the reason of course while you're here so guys web development it refers to building creating and maintaining web content so literally anything that you guys see on the internet is web content and web development is involved with every part of putting that content online and available for you guys to view on your web browser web development can actually be divided into a few professional fields which focus on the individual components of the web development full stack i will be explaining in more detail of course what that phrase means in just a moment but just to give you an idea guys professions can include things like web design web publishing web programming and of course database management as well you'll have a stronger understanding of all these terms today and again as we cover them in more detail over the next four weeks sorry all right guys so here is your monitor so you're going to load up a website on your monitor and all you have to do guys is type in the website address into your browser and voila the website appears on your page but how does that happen how does that website get from wherever it is from its creation to a place where it can be served to your computer in your house whenever you want to access it well of course it involves several things guys there's a lot of steps involved in getting the website all the way to your computer in a fully professional industry ready and available for a customer to view as well the first thing i want to talk about is the individual components guys i just want to define a few words before we go into too much detail what you're seeing when you load up any page in your browser guys is what's known as a web page and a web page it's a document that's written in html html stands for hyper text markup language and we'll be having a closer look at how you can build html uh at the end of this class and in our lesson two in just a couple of days so what's a website then well a website is actually just a collection of web pages so if you have multiple web pages written in html well then suddenly guys if they're connected to each other they're suddenly considered a website and of course any website on the internet can be accessed through the internet via any web browser whether it's mozilla firefox internet explorer google chrome safari opera mini even if you're using opera mini on your mobile device okay so that's the basic concepts and terminology involved with the bare bones of a website but how is that created well there's actually two sort of big aspects to it there's two main roles involved in setting up a website and these of course can be divided into two main roles as professions we've got the web designer and we've also got the web developer a web designer guys they're in charge of the look and feel of a website so this is how a web page feels when you load it up in your browser how it displays the colors the fonts and the layout how you can navigate from web page to another web page on the same website so the navigation bar any sub menus the search facility how that looks on the web page well that's the domain of a web designer and most web designers guys they have a design background so they've either studied graphic design or interior design any kind of design background the same theories apply to a web application a web developer on the other hand guys they're what makes the website actually work so they're in charge of the functionality if that search bar built by a web designer well it needs to have some functionality or else it won't search for anything successfully so that's what the web developer can do it's of course more programming focused as a result because in order to get a computer to do anything you actually have to program instructions into the computer and web developers focus on that side of building a website additionally guys they do things such as creating a database which is sort of like the memory of a web application and finally guys they're in charge of actually putting that website into a place where it can be accessed from the world this is of course using a web server where which will contain the website and then it will be able to instruct and the internet to send the page to any user that requests it that's all well and good of course but there's one more subdivision that i'd like to make guys it's the difference between a website and a web application i've been referring to everything sort of using the two words synonymously so far but i'd like to clarify them now just before we move on to the next section a website guys it's mostly sort of static informational brochure style content and no matter what user is on that website it will basically look the same if you could imagine sort of the um the news channel the new york times it doesn't matter who visits the site the same content will be available to anyone who visits that site and that would be considered a website a web application on the other hand guys it's dynamic it depends on the person who's using the application and it changes guys based on the information about the user that the application has facebook is a perfect example of a web application because the application changes depending on what the user's interests are who the user's friends on facebook are and all of the users preferences as well when you log into facebook you see a completely personalized news feed from your friends you can make a post and then what you see on your page will change immediately your post of course will also change what your friends see on their newsfeed and this makes facebook the true in the true sense a dynamic web application of course uh web applications have some faults as well if it's user driven such as facebook well then if there's no users there's also no content so it relies on having a strong user base uh twitter youtube instagram all of these are good examples of web applications as well without content from a user well then there would actually be no meaningful purpose for that web application i do want to mention though that in recent years the difference between a website and a web application has become a little bit blurred because for example going back to the new york times website if you have a premium account with the new york times well then you actually might get access to additional content and this is sort of an element of a web application and so these lines are being blurred as web developers guys we build web applications it's the focus of this course but we still need to know how the website is built in order to turn it from static to dynamic so my question to you guys based on what you've learned so far guys why is it that you should learn web development what makes you think that web development is a good idea for you guys to get into as a subject i'm just going to have a quick wait and look at the questions box while i wait west ham is saying i love programming that's good to create for the future very good uh good stuff guys um just having a look in the other questions box here good money from gadris very good answer uh creating a web application for a shop so alan has a a goal already very good uh people have applications they want to build very nice to build a website to update your website because we need it in our career very good to stave off boredom to create web apps academic reasons very nice as well to support my ba job good independence very nice as well uh you can be your own boss excellent guys all right so very good guys we've still got answers coming in which is really cool but to summarize everything guys the internet is everywhere the internet is pervasive in the modern day and as a result uh web applications are becoming pervasive as well i talked about the fact that in recent years websites are moving into web applications there are websites being built and created a new all the time every business that's worth it salt will need a website of some kind and of course that creates jobs that's making money and of course web developers are paid surprisingly well additional benefits as well guys you can actually work anywhere you like because it no matter what language you speak web development is the same language across the world it doesn't matter what language you speak in terms of the written or in terms of what you say but if you're typing in web development it's all the same no matter what and of course a lot of people were saying they wanted to create a web application well you can create anything you like if you know how to web development how to web develop even and for me that's my favorite thing because i can create anything i can conceive of and that's just by being a web developer okay guys so that covers this section here and we're going to move on now to the next portion of the class which is the components of a web application but i would like to have a quick look at the questions box before we do so just to make sure that everyone is okay uh it's an amazing way to change my career from very good from aegya just gonna have a quick look and scroll up to a previous uh to some of the previous comments because of course i asked you guys for an answer very recently ah so we've got omar who's already a database programmer very nice well you're looking to extend your knowledge to the other components of a web application that's brilliant um let's see when are we going to start the coursework we've already started the coursework uh let's see work from home will i be able to make games as well from gideon the answer is actually yes you can use the canvas html5 element to build a game if you so desire of course we won't be teaching you specifically how to build a game but you can apply the skills you're learning in this course to building a game uh let's see the handout for today will we need it in this lesson or the next lesson the answer is no the handout is just bonus content for you guys for attending live in your first lesson so you can have a read it'll be available as part of the toolkit as well if you're watching the recording of this lesson of course okay guys looks like we're in good shape to go for now so we're going to move on to the next section of this class which is the components of a web application i've been talking about web applications and i've been talking about html and css talking about databases all of these words but now i'm going to explain what they actually are so first things first guys the component of a web app these are the modules that work together to produce a fully working dynamic web application web applications keyword guys dynamic it changes based on the user interaction so it includes everything from a web server to the web pages which are built with html css and javascript to back-end coding which is the sort of brain of a web application and to databases which you can think of as the memory of a web application so i have a question for you guys don't answer me yet i will ask you again at the end but i would like you to bear this in mind as i go through the next section what elements of a web application are contained inside a web server so do have a think about this guys keep it in the back of your head as we move into the next section and hopefully by the end you'll be able to answer me all right so we've talked about web development and what it is so it's now time to talk about the component parts and we're going to be covering a fair bit in this section guys so do bear in mind this is just an overview these topics will be covered in more depth and individually in their own lessons over the next four weeks so there are a lot of different components guys that a web app consists of these can be divided into a few main in a few main categories the first is the web server and the server software there are a few defining features of a web server which we'll look at in more detail in a few moments but between the server and the server software we get a web server and this is what will serve the web page to the user that requests the page it's also the place where everything else is stored as well the second main component guys is the web pages themselves there's no point in having a website with no content well the content is held inside web pages and these are written in the languages of html css and javascript so you can actually create any kind of static content that you want using just these three programming languages and then we use the rest of the components to turn them into a dynamic web application we also have the back end code if the code that we will be using in this course is php but there are numerous backend coding languages that you can use um back end code guys think of it as the processing that the web application does it's the thinking done it's the decision making that a web application has finally we have the database and the database software databases are like really organized uh really organized excel sheets inside excel sheets inside excel excel sheets they're essentially a really good way to organize and maintain data we'll be looking at this in a little bit more detail in a few moments but the database software that we will be using in this course is mariadb mariadb is a relatively new database software and it is an extension of mysql which was a former very popular still database software programming language all right so everything that i mentioned just there it actually ends up creating what's known as the full stack of web development you've got your web server you've got your software you've got your web pages you've got your back end code you've got your database engine all of these are contained in the web server and then whenever a user requests the page inside their browser well then it's all amalgamated into html css and javascript and then that web page is sent out to the user in his computer so some quick terminology guys before we go into a little bit more depth i'd like to segregate some of the components into two main parts the first is the front end the front end guys is everything that's sent to the client's browser namely the html the css and the javascript these make up what's known as the front end of a web application then there's everything else the back end which is everything that happens on the server this of course includes the back end code it includes the database as well and then it also includes the actual processing of data as well and then the two of these together guys makes up the full stack of web development that's everything on both the front and the back end of the web development full stack all right uh zoltan is asking how can i see the chat platform the answer is uh you can see your chat box as well as ayesha's answers to your questions okay it's a bit warm in here guys so do bear with me so guys i'm going to go into a little bit more detail about each of these components now we're going to start by looking at the web server the first thing that we need when we're making a web app is a web server without a web server it would be impossible to put your content online for people to see so what exactly is a web server well a server guys is actually just a computer just like the one that you're using right now except that it has special web server software for delivering the web pages that are installed on it and what that means guys is that its main purpose is to send web pages to people's web browsers it also contains all of a web application's content and data you might have heard of the term web hosting before well web hosting guys is just what a company can do to provide customers with a web server with all of the server software installed already and ready for them to put their websites and web applications on they generally charge a monthly or a yearly fee as well but there are free alternatives but i generally would try to stay clear of these guys they put a lot of ads and pop-ups on their hosted content and this can mean that your website can look pretty unprofessional believe it or not though guys you're actually already using web servers every day as i mentioned every single time you type in the url of a website in your browser such as www.google.com the internet actually sends a request to the web server that has that content that web server then finds the information on its computer and then we'll send it back through the internet to your web browser i'm actually going to put this again into a visual format and hopefully you'll be able to see the process step by step so we've got a user on his computer guys and he is typing the url for facebook.com into his browser or her browser that request is sent to the web server at the facebook data center that web server will then find the information on its hard disk and then it sends it back to the web browser and voila guys suddenly facebook is on that user's computer i'm sure you can imagine though that facebook gets a lot more than a single request from a single user in any one moment in fact it's more like hundreds of thousands per second obviously you'd need a pretty extreme computer to be able to process all of these requests at the same time and well this is actually where what's known as a data center comes in a data center is a network of web servers and these are all linked together and they're specifically designed to handle large numbers of data requests at any given moment these data centers guys can often include hundreds or thousands of web servers all processing millions and millions of requests per hour high-end web servers also generally use special components that are designed to be on constantly 24 hours a day seven days a week if you try to make your own computer do this while handling a large number of requests well you'd very quickly run into problems guys this is why having a high quality web server is very important i will be looking at web servers in more detail in lesson four for now though we're going on to the second portion of a web application in a little bit more detail and we're going to talk about back end code specifically guys back-end code is the brain of a web application it's essentially what makes a website or web application actually work as intended it's used to interact with the web server and to perform certain tasks as well uh back-end code is used to validate data process data manipulate data coming and going from the web server this data could be requests for specific web pages like we saw earlier it could be how you can verify your password to log into a website or of course your email address as well to use emailing people as an example when you send an email the content of that email goes to a web server somewhere it's then processed by code on the web server which will find out who sent it who it's going to uh are there any files attached and then it will send it to its destination the software necessary to run back-end coding languages is often pre-installed on most web servers so you don't have to worry too much about the details on that front on that side important guys static websites they don't generally have or need backend code because they don't have to do any processing of information they just have to display that information to any user that asks for it we're going to go back and see a visual example of how back end code works again guys so let's go back to our little user on his computer we're going to call her sarah let's say sarah is trying to log into a website and this time she's trying to log in and her password is very very unsecure it's one two three four five but this password gets sent to the server guys and this server well it'll check the list of users and passwords on its database to find a match and if that all works out if the password is correct well then the user is sent the page that they wanted or alternatively they'll be sent an error if the password was wrong it's very important to note guys that all of the processing and the checking of the passwords correct or incorrectness is not done on the user's computer it's done on the server and it's extremely important because this explains why back-end code is so important so let's have a quick talk about that for a second you might be asking why is back end code is important well there's two very important reasons the first which is what i just mentioned there is that it's safe because that password the user on his computer will never have any access to the correct password all they're doing is sending what they think is the correct password to another computer and it's the other computer that has to do all the calculating and figuring out if that password is correct this means that at no point does that user have access to a password if it's not their password the second reason and it's kind of an important one as well is that it's much faster server computers tend to have much better uh hardware inside them and that means that they can perform calculations much faster as well additionally the software on them is more efficient it's more robust which also adds to the fact that it's a faster processing machine and this means guys that the person watching their website on their computer i won't see any delays or lags or at least we'll see the lowest amount possible because all those calculations get done faster and the information will arrive on their computer as quickly as possible all right so let's move on to the next component of a web application guys and that is databases so databases are actually kind of interesting because they're actually hidden behind all of the tools and services that you use every single day but you actually just don't see them uh they're used to store things like the passwords i just mentioned uh the facebook uh the posts that that facebook have the tweets that twitter has uh the photos that are stored uh with instagram basically anything that you can think of that's information gets stored in a databases um so why are they stored in a database well databases guys they're installed on a web server and they are a lot like web servers themselves except that they actually contain organized data and then we can request that data from them in any manner that we wish and that data will come to us as physically fast as possible databases are intended to store extremely large amounts of information and to be able to give us that information really really quickly adjusted for comparative purposes um let's say you have a giant warehouse and it's got a huge number of files file cabinets you know to the ceiling hundreds of thousands of them imagine if you could ask the file cabinet uh you know where is the person whose name is stacy um henry who tried to log in yesterday and the file cabinet would come out with the answers straight away well that's what databases do guys databases are a software version of a giant file system except that they're much more efficient they can store more data and of course they only take up the space of a computer so that's what makes them absolutely brilliant as well finally guys they're also very good for updating information you can manage them easily all of these things that are really difficult with a physical system becomes really easy with a database um i'm going to look at the questions box in a little bit guys i do want to get through the final section of this uh components of a web application then i'll have a quick look at the questions box okay so the final portion guys of a web application and we're actually going to have a look in more detail of this in the last portion of the class is the web pages themselves namely html and css so as i mentioned at the beginning of the class html stands for hyper text markup language and it's a document written in html it uh html hypertext markup language is a system for annotating a document in a way that makes it really easy to distinguish from the text the actual content html uses small pieces of code called tags in order to differentiate itself from the text on a page and the tags guys it also tells the web browser what the content actually is so that means that a browser can understand oh this is the heading for a particular section this is a paragraph this is a image this is a video uh all of that's what hypertext markup language does it actually explains the browser the kind of content that it has inside of it there are loads of html tags guys that help us markup pages really easily but we'll be looking at these in more detail in the latter portion of this class and in lesson two as well the latest version guys is html5 this is the current version of html and it's a very good modern way to build your web application if you guys are coming back to do revision well you might have to update your knowledge guys to html5 it's been around for a good few years now but it's definitely worth improving your knowledge because if you want to be a search engine optimizer well then you'll need to know exactly how html5 works so that the google search engine or the yahoo search engine can very quickly understand your web page and be able to improve the search on your on your website the next part of a web page that i'm going to talk about today is of course css and css guys stands for cascading style sheets um css is kind of interesting because it's the coding language that we use to style and to position web content this includes everything guys from colors to fonts to spacing everything to do with how a web page looks without css web pages would just look like a text document and i'll be showing you an example of exactly what it does in a few moments the current the current version of css guys is css free okay so that covers the components of a web application guys i'm going to have a quick look at the questions box and then we're going to take a break from learning to look at the course agenda everything that's going to be coming for the next four weeks html is essential from omar you're absolutely correct um file security what languages should we know for back end code isaac that depends we will be focusing on php in this course but there are a range of backend coding languages that you can use are we using javascript from we sam the answer is yes absolutely we'll be learning to use javascript as well more details though in lesson three which is this time next week javascript is the last sort of component of a web page but i'm going to leave that until lesson three we're gonna build our web page completely statically and then we're going to introduce javascript javascript is kind of interesting guys because it's partly for web designers html and css is very web design oriented but javascript is kind of half and half it's half to do with designing and it's half to do with developing are we going to learn java the answer is no because java is not the same as javascript guys these are two different programming languages uh okay so um i'm gonna have a quick look at the questions box uh advantages of php over python um back encoding languages like there is no real advantage or disadvantage to any given language php has a lot of documentation and a lot of peripherals available to it and it's also relatively easy to learn it's part of the reason that it's on this course uh let's see uh if we build a website will we build a website during the course this course and the answer is yes in lesson eight we'll be putting together all of our knowledge to build our first web app um let's see okay uh does html have programming code i'll be covering the details on this in a few moments guys so bear with me regarding html and css are we learning asp.net the answer is no we're learning php okay guys i'm going to leave the questions till the end because a lot of you guys are asking questions that i'm going to answer in the next little while so do bear with me guys while we get through the course content and then i'll be happy to answer any remaining questions okay guys so as you guys know we're gonna go through the course agenda now we've already covered lesson one which is the full stack of web development i've shown you guys a little bit about everything that's involved in a web application and i'm about to introduce you to html and css the actual programming languages themselves in lesson two guys we're going to take this into more detail we'll be looking at in more detail about how we can actually write html and css to create our first web page we'll be building our first web page guys in lesson two so very soon we'll be learning how to build a web page from scratch uh week two next week we'll be doing sort of the setting up of the systems we'll be covering javascript which is the first programming language that actually has programmatic skill requirements involved we'll be learning it from scratch though guys so don't worry if you're new to programming we're learning everything from first principles the variables the data types the functions all the things you can do with javascript in lesson three then in lesson four guys we'll be learning how to set up our first web server so we'll be learning what a server is we'll be learning about the kind of hosting services where we can get someone else to do the server maintenance and work for us and all we have to do then is build the web app and put it on their computer finally we'll be looking at how we can actually create our own server on our local computer this won't be so that we can serve web pages from our computer this will be so that we can develop on our own computer and then when we're ready we can upload it to a web hosted server for example in week three guys we'll be learning about the powerhouse of web development so we'll be expand extending our knowledge of programming we'll be learning about all the control systems that are available to us in javascript specifically guys we'll be learning about conditional logic which is one of the most important things you're going to ever learn if you want to be a programmer of any kind and then finally guys we'll be adding this knowledge to our knowledge of php as web developers guys back end coding is our focus web programming using a end coding languages is one of the most important things we'll do so even if you miss all the previous lessons which i don't recommend make it to lesson six guys because it is the centerpiece of a web application and then finally guys we're going into week four which is going to be the final pieces of the puzzle we'll be talking about sql and databases so how we can build our own database on a computer and how we can actually talk to a database using a language known as sql finally guys we'll be using a user interface known as phpmyadmin in order to create and build databases for use with our web application and then finally in we in lesson eight guys the end of week four we'll actually gonna put all the knowledge that we've been learning throughout the four weeks together and we're actually going to build a web application so we'll be building something something akin to a simple template for a website except that it'll have the full stack of web development involved we'll actually have a database built so that we can store information about our products we can display our products on our web page dynamically it's going to be pretty fun guys we'll be using everything put together so it should be fun for you guys as well all right so we're going to now get to the last section of the class guys and then we're going to go into the q a session and then i'd be happy to answer anyone's questions then all right so the first thing guys is html just a quick redefine of html it's a standardized system for tagging text files to allow all of the css to be applied to it on a world wide web so essentially guys html describes the content that it contains so for example we've got a heading or we have a hyperlink which is what's links one web page to another web page we have a video we have an image we have a paragraph we have um basically any kind of content guys we even have canvas which is basically a place where you can actually create your own images and your own animations if you like as well we'll be going through in more detail all the kind of html tags that one can have in lesson two and we'll be expanding upon it step by step over the next four weeks as well right so with css guys which is cascading style sheets this describes how html elements are to be displayed on the screen so this can mean i want to put my paragraph in the top left hand corner i want my navigation bar to be a bar at the top of the page i want a little dashboard on the left hand side of my screen i want a a list of everything to do with my website on the right i want my article to be in the center this is what css does guys this is what this allows us to do it allows us to place content in a neat nice user-friendly way all right that's all well and good guys but how does html and css work well first things first guys i'd like to ask you the question what is the difference between a html element and a html tag most of you guys won't be able to answer this yet because i haven't covered it in the class but you should be able to by the end of this section so do bear in mind guys and i'll come back and ask you again at the end okay so guys this is what html looks like you can see that i've got a bunch of what looks like a tag and then i've got a bunch what looks like content so we've got the content written in black and we've got the tags written in blue so you can see for example if you look at these three html elements we've got the title which is an opening html tag we've got i am a title and then we have a closing title tag and guys the difference between an opening and a closing is simply the forward slash before the name of the tag so in this scenario taking the first line we've got the title saying i'm going to now give you the title of this document and then you say i am a title and that is the title of the document and then you end the title element with a forward slash preceding the name and that means i finished talking about the title of the html element do let's go over that again with the paragraph we've got the opening paragraph tag which is an opening angle bracket the letter p and a closing angle bracket and then we have the actual paragraph in this case i've just written i am a paragraph and then we end our paragraph with opening angle bracket a forward slash and then the letter p and a closing angle bracket and guys all of that all together is a html element this looks a little strange guys you wouldn't expect to see this on a web page but of course when you actually display these contents in a browser well then this gets translated to a nice looking basically static text documents so you can see that the title gets translated to the title at the top of the tab you've got the i am a heading element turns into i am a heading and then you've got i am a paragraph turns into i am a paragraph this guy's is the main principle of html it allows the developer to separate web page content in a way that the browser can understand don't worry though guys we'll be covering this again from scratch in lesson two and then going into a lot more detail about what we can do with html elements in lesson two all right so let's talk about css now let's take this exact same web page and now what i'm going to do is add css to it so this on the left is no css and then i can simply change the paragraph color to white and change the paragraph background to blue and suddenly guys that paragraph has css on it obviously this is a very simple basic example but you can extend this to build a fully beautiful website by just going and improving it step by step to give you a more extreme example of how useful um css can be let's have a look guys at a website that i think you guys might already recognize this guys is the shaw academy website it's actually a really old version of the show academy website it's probably about eight months ago now but that's what the show academy website looks like with css what happens guys if we strip out all of the css does anyone know what would happen to this website if we stripped out all of the css edwardian's coming in with an answer right now that's correct absolutely brilliant we've got ugly from natalie just text lines just text becomes a mess smiley face look a mess would all be text no colors it will be blank with no color lines of text just be structure and text uh plain dull uh elements will fall out of the normal flow bunch of code just text no images content is mess just text absolutely guys well this guy's is what the show academy website actually is in terms of just html it's just a bunch of links with some sub links with some sub links inside lists that's all it is guys and it can be translated into a beautiful looking website with just css so that's just kind of goes to show you guys the impact that css can have on the user experience of a website so very important to note there god bless css from we sam absolutely agree css is awesome from sauron as well completely agree guys all right guys so that covers css now i want to go back to the question guys what is the difference between a html element and a html tag so let's have a look guys and see let's see them coming in does anyone know the difference between an element and a tag so we've got uh one second one second one second uh still waiting guys element is the value within the tags that's close but not quite uh will this course uh tag defines the element uh very good that's a good answer tags are fixed element is the tag and content from pagina that's a very good answer i like that one uh html element is the whole construct very good guys html is the tags and content very nice html tag makes up the html element uh it describes the html element but very good uh tags are content not quite tags are the opposite of content um element is content and tag is heading close and the element guys is actually the full markup of a section so that means like the paragraph the opening paragraph the content and the closing they are all part of a html element a tag on the other hand is simply something that defines what kind of element we're trying to mark up so very good guys nice interaction i like it and that guys concludes the course for this class we've got a few more things to talk about before we get into the q a but i do want to quickly summarize everything that we've learned today so we covered what web development actually is and everything to do with the web development full stack including guys all the individual components a very high level view now guys but we'll be going into a lot more detail over the next few weeks and finally we introduced html and css which are the first two programming languages that we're going to be introducing to they're not really quite programming languages they're more like scripting and markup languages but they are computer languages all the same congrats guys you've laid the foundations we're now got a base from which we can actually build up all of our materials this is an irish phrase that i still can't pronounce but it basically means guys that a good start is half the battle so um there you go guys uh all right so we can now start building guys on our theoretical and our technical knowledge and we can of course uh be doing that over the next few weeks don't forget guys to keep attending live we can ask questions and you can benefit as much as possible and if all else fails guys if you're still confused about anything feel free to get in touch with us i will be happy to help you out in any way we can uh guys just so that you are aware we have a facebook page and we also have a twitter account so if you're interested in keeping up to date with all of show academy's news i recommend you join these two channels obviously completely free if you have a twitter account join the twitter if you have the facebook join the facebook page uh we'll also be asking questions about web development over the next four weeks and these will appear on the facebook and the twitter pages so do keep an eye on them guys and fill out the polls that are accompanying each question that we ask additionally guys web development itself has a youtube channel so do be sure to subscribe i guess once every week or so i come up with some bonus content by the way guys you can sort of subscribe to the channel and stay forever if you so wish all of the information will be asking some interesting questions related to web development and talking about web development in general so definitely worth subscribing to our youtube channel if you are interested finally guys our next lesson will be creating our first web page using html and css we're just going to start typing into a text editor and we're actually going to build our first web page we will be covering html and css but we'll also be looking at the editor software that we'll be using in this course guys not just for html but also for css for javascript and for php as well later on in the course it's the same software guys to be used for everything and it's absolutely free so you don't have to worry about any of that stuff finally we'll be having a look at some useful resources that every web developer should have so definitely guys tune in and stay to the end to figure out uh what we can do to sort of augment our knowledge after this course as well all right guys don't forget about the lifetime membership prize and you can watch the recordings of all the lessons within 24 hours of the live lesson uh what time is it if we have time i will be happy to show you guys the members area now yes we do have a little bit of time so i'm just going to spend two minutes guys to show you the members area guys we're going to move into the q a session now i highly recommend staying around so that i can answer as many questions as possible but if you need to go don't worry the q a session is also recorded so feel free to pop off if you need to go and then you can watch the recording of the q a session at your leisure if you want to uh one second though guys i have to do some logging in in order to get access to ah guys unfortunately i'm not able to show you the members area today so i'll have to show you guys in lesson two before we start uh the lesson uh uh in just a couple of days but uh so apologies on that front but if you are new guys do keep watching the live webinars so i'll be able to show you guys how you can access your members area uh in lesson two all right guys i'm gonna take just two minutes i'm gonna go grab myself a glass of water and then i'll be back and i'll be answering questions for the next 20 minutes 30 minutes or so depending on how many questions we have all right ladies and gents and i'm back i'm just gonna answer some of the questions now in the chat box over the next 20 minutes or so uh do be aware guys if your question timestamp is before uh 8pm and one minute i may not see it i'm going to be looking at uh eight minutes and uh or whatever the timestamp is one minute past the hour and i'll be looking at those questions downwards do bear with me guys there are a lot of you guys so i'll be getting through them as quickly as possible but do be patient with me kelsang is asking is there an advanced web development course and when does it start the answer is yes uh we're currently sort of two-thirds of the way through the current run of the web development course but the next one starts uh near the beginning of january telstra so keep an eye out for it if you're a member already it'll appear in the add courses section over the next sort of couple of weeks uh which software will be using abdullah i don't want to introduce any software until it time comes time to use it because i don't want anyone to have issues installing the software so i'll be explaining everything step by step so do be patient i'll get to it in lessons two and i'll be covering some additional software again in lesson four are we going to learn how to make the website okay with a smartphone browser from anas uh to be honest on us that is more the domain of web design so i won't be focusing on it although i will mention it from time to time the things that we can do to help make it as easy as possible for a web designer to do his or her job so i will be sort of talking referring to responsive design but i won't be specifically implementing it because that is more the domain again of web design which is not the focus of this course great lesson thank you from faith no problem at all no questions from you that's okay maybe you'll have some in the next few days uh is there any way we can interact with other members on the same course from rhiannon the answer is we currently don't really have an infrastructure in place for that although i am thinking of building a facebook page just for web developers who are on any courses that are running so um if that if i do decide that i can do that i will do it and then i will let you guys know how you can add to that page and at that point guys you can talk with all of the other students and interact with them and you know post up your your the latest version of your website and so on and so forth i think it's a pretty cool idea it's being done for the web design course uh which i'm actually managing that for some reason but um i'm managing the web design facebook page and it's working out pretty well so far so i think we'll probably try and implement it for web development as well uh the next lesson is at what time same time as this lesson was abdal minam i don't want to say ours specifically because it varies depending on what country you're in but um it's you know an hour ago right now uh is html the only markup language that can be used to write a web page the answer is actually no there are different markup languages that can be used but html is by far the most popular way to markup a web page is it possible to build an application using a smartphone the answer is yes but it is so awkward that i definitely definitely don't recommend it it's hard enough to do it on a desktop never mind doing it on your phone uh really not recommended i wanted to start a web development company would you suggest using a platform like wordpress or coding the website from scratch assuming i know how to do this from a hash that's a good question and i spotted another question earlier there about what is wordpress so it's a good time to answer both questions uh okay so first things first guys for those of you who don't know wordpress is what's known as a content management system it's actually covered in detail in our toolkit bonus video which will be available next week uh for those of you guys who are interested in wordpress and setting it up on your server however wordpress and web application development aren't really the same thing you can apply skills from both to the other but wordpress is really for people who don't know how to web develop to build a static website wordpress is used for those people who are not particularly savvy with design or with development they can put a website up very quickly but it won't be able to do anything particularly complicated you can't build a shop website for example using wordpress you can build a static content only website with wordpress it's great for that in fact i would recommend it if that's what you're trying to build but if you want to build an actual website that's you know like something akin to uh if you want to build something with specific functionality you'll want to actually web develop from scratch or use what's known as a framework which i'll talk about in the advanced course i cannot understand the difference between an element and a tag the answer is that an element is the whole thing it's the opening tag it's the content it's the closing tag whereas a tag is just what is used to label the element so the tag is the label for the element whereas the element is the whole thing is there any security involved while building a web app the answer is absolutely uh for beginners it's i'm not going to be focusing on that but i will be covering it in the advanced course uh when you type a url into your browser how does your browser know what web server to talk to um alex that's a great question it's way outside the scope of this course guys though because it's to do with networking protocols and hypertext transfer protocol and stuff i don't want to answer the question but essentially the url gets sent to the internet and then the internet uses the uh http protocol to find the connected web server uh ignaz is saying where can i get all the software the answer is don't worry about software guys we'll be covering it as we get to it uh is the language c useful for web development the answer is you can use web c as a back end coding language but if you have a background in c well then you'll find this course a little bit easier is there a php course from germaldo the answer is this course covers php so discourse will every lesson be about an hour the answer is yes roughly it varies from class to class but every lesson the actual class itself will be roughly an hour uh let's see will we be using bootstrap to develop the website the answer is yes but i won't be specifically covering bootstrap because again that's the main of web design if you're interested in that kind of stuff i'd recommend the web design course so you should take this course for now and then when it comes time to take the web design course you can go and do the web design course bootstrap is covered in heavy heavy detail in the advanced web design course is there any literature that you recommend the answer is i recommend purchasing the toolkit the summary notes will explain everything there's a little additional information and the bonus videos have information attached to them as well for now i built this entire course so that you can learn from start to a comprehension level by the end of your four weeks so i recommend taking this for now and i'll be talking about resources to expand upon your uh web development vocabulary but i'll talk about that in lesson two which operating system is best for this uh xenophon um the answer is uh for web developing you can use a you know uh like a non server operating system like windows 10 windows 7 mac os 10 linux that's all fine uh if you want to build your own server that's also outside the scope of this course you don't need to build your own server to build a web application so it's also not recommended unless you're like a network engineer uh what's the difference between the different html versions uh they just have different amounts of content so the kind of tags available in html5 there's a lot more and they also allow uh html to be marked up they allow the content to be marked up better the later the version the better in my opinion html six is due in a few years but until then html5 is the latest and best way to mark up your web pages i know there's a lot of questions i'm not answering guys do bear with me i'm only at four minutes past eight here and that's just on one of my licenses so do bear with me here uh will there be any exam and the answer is yes i recommend watching the beginning of this lesson i go through all of that in detail the recording will be available tomorrow guys on the show academy website um let's see if if i answer any question guys and then i read the same question from a different person i won't of course be answering it uh so okay uh do you create facebook groups the answer is i might do uh i i'm still not sure i'm i'm managing the web design group at the moment uh leslie saying i enjoyed the first lesson i'm glad you enjoyed the first lesson leslie and uh i hope you enjoy the rest of them too will i be able to build a web shop after this course from r and the answer is uh honestly no like this is an introduction to web development course guys you can't be expected to be a professional web developer in just eight hours of material uh if you take this course and the advanced web development course well then i actually think you'd be ready to make a very good start to building your own webshop of course there'll be additional learning you need to do on your own but it'll be much easier once you have the foundation between the introduction and the advanced course together you'll be in a very strong position to build a website can you show us any of your work um i don't have any right now uh yeah i don't have any right now it's also hard to demonstrate work done from a web developer because web development work is not what people see on a web browser it's everything that makes the web browser website work right so i'll be explaining all of these things and i'll be i might showcase the um practical classes from the advanced course something that the advanced students are currently working on with me which is an ecommerce site a fully working ecommerce site we're building it step by step though so it's not complete yet but in by the end of this course it'll be close to compete so i might showcase it at the end of lesson eight if that's what you're interested in um what's the difference between back end code and a programming language the answer is there isn't one they are both the same uh can i sync my phone application with my website i'm not sure what you're specifically asking although you can make a phone application using web technologies are there two on-demand classes the answer is no there are three bonus videos available through the toolkit though um macros is asking which is faster the answer is it really depends on how good a programmer you are so uh there's no real answer to that question i'm afraid um i bought the show academy web development web design together but i can only register to web development uh andreas unfortunately the web design course is currently sort of in between educators so uh they may have delayed your course registration until we find a live educator to take the course back again uh let's see will i be able to start a dot-com company get a billion in funding even though i have no site and no idea that's funny donald uh i i see what you're saying there that's funny okay so let's see will we be learning scale and hosting on aws or such we won't be actually learning specifically on aws donald but um we also don't cover scale particularly until the advanced course because that requires a proper knowledge of database architecture and the like which is outside the scope of an introduction course will we cover http the answer is no because that's more the domain of network engineering you don't need to know how http works really you just need to know that it does work and how to use it uh let's see will we study web security the answer is in the advanced web development course we will be would passwords be hacked from servers which may not be too safe uh ahmed uh yes the answer is yes any server can be hacked guys uh it doesn't matter how well defended it is a hacker with enough dedication can feasibly hack any website if there is even a single tiny mistake in the website it's for this reason guys that i don't recommend that you use your own server uh it's the reason i recommend you use a host server more more details again in lesson four but um a lot of the work to protect the server is done by a host provider of course you still need to protect your own website as well from a programmatical perspective but i don't cover that until the advanced course you don't need to know it until the advanced course because uh well you shouldn't be able to build a cert you shouldn't be building a web application in just four weeks guys uh you will however be able to funny i'm reading your comments i don't want to read them out loud though okay guys i'm going on to the other license i'm sorry to you guys that the my answers to you on the other license have been so delayed but i've finished answering the questions on the first license now uh would learning's php on cbt nuggets have any benefit to this course i'm not sure what cbt nuggets is but if you've been learning php you'll definitely find this course to be easier than it would otherwise be uh what kind of information does the database say from gervani shabani literally everything like every piece of information that a web application can hold ideally should be held on a database let's take uh let's just go back to the facebook example because it's the easiest to work with uh facebook stores essentially everything on a web server the only thing it doesn't on a database rather the only thing it doesn't store is the actual web pages themselves so the layout of a page what what goes into a document and where it goes and how it's marked up however the actual content the inner html i spoke about the html element and the tags what goes between the tags is known as inner html well that inner html is actually stored in a database and it's pulled out by the back end coding language and then printed on to a html document before it gets sent onto a computer i actually i'm skipping a lot of information there but you will see a practical application of how this works near the end of the course once we cover these topics but a database literally saves everything guys the user's email address and password the user settings um the user's facebook friends the users uh the user is everything to do with the user it also stores all the posts every single post on facebook is stored in a database called you know database facebook posts or whatever it's called that database table will store literally billions of records it can store billions of records and it pulls them out and it prints them to html document using its backend coding language before it gets sent out to the user's browser again you'll see a better example of this when it actually comes to building a web application later on in the course uh where can i find the lessons thank you for this amazing introduction from abdullah you're more than welcome first of all and abdullah if you want to access the recordings of these lessons you can log into the shaw academy website um using your email address and the password you created when you set up your account and then navigate to the web development page uh this time it's about 24 hours after the live lesson it will be available to view through the website so if you say 24 hours from now it'll definitely be ready it'
2021-04-23 00:39
