What is Web Development

Views: 0

Backend are different for every user two examples are the YouTube example recommendation algorithm as well as Amazon knowing what we want to buy more than we do these advances have blurred the lines between web development and the rest of software development let’s dive into our stack starting with front-end browser though when you visit a URL this will kick off a request for index.html from Google servers and HTML files only made up of two things we have text and more importantly tags these tags can modify text add links break our page into sections and add classes that we can apply styles to we also have standalone tags essentially these tell the browser to load additional assets whether that’s an image or additional files one such file might be a CSS file which creates an additional request of the Google servers

 

and we receive it at all scan through and loaded HTML and add styling this is done through selectors and attributes selectors find elements and keep you broad searching for all matching a tag or more narrow with a class or ID attributes are the styles we apply here’s some examples something nerve-wracking for all people learning CSS is how to do spacing you can do 95% of your spacing if you master something called flex bucks I’ll leave a great link in the description to learn this CSS isn’t logical it’s mostly just

practicing memorizing and applying what you’ve learned for this reason Google is your friend back to our HTML file there’s one more important tag we need to talk about it’s the script tag which allows us to load JavaScript files from our server or elsewhere on the Internet by the way servers that send these kind of files we’re talking about are generally referred to as web servers so we see a script tag we request our file and it gets sent over let’s look at some of the stuff JavaScript is responsible for with

an example let’s say we have a button that logs us in what triggers the log in is known as a user event or a click on the button to respond to this event we need what’s known as a listener some code that waits for the button to be clicked and responds accordingly when the click happens JavaScript can update our HTML to show a loader so JavaScript would update the appearance of our page we then send this login data to our server to validate it goes lets us talk to our server without reloading the page these can request whether it’s to

 

send data or request more data are known as Ajax asynchronous JavaScript and XML requests in 2020 almost all front-end developers are using frameworks here’s a few frameworks ranked from easy to hard to learn and here’s them ranked by usage these frameworks don’t do anything JavaScript can’t do but they give us a better developer experience which when you’re making changes or fixing bugs is pretty much everything that being said browsers can only run JavaScript not framework code so our framework code has

to go through a build or bundle step which converts it to normal JavaScript the important part is to choose one and stick with it although keep in mind that react and angular have an order of magnitude more jobs than the other two okay we have our front-end but how does it talk to the backend that’s the purpose of an API essentially our front end and back in may or may not be in different languages so how do we standardize a way for these two to talk well we do that with what’s called an API most commonly REST API z’

 

are used which follow the convention of combining a verb with a location for example we might want to get a list of accounts or add a new account alternatively if we pass a parameter we could get a specific count modify it or delete it rest does give us some nice standards but there’s no guarantees if anything changes our front-end can get messed up so there’s an alternative called RPC which sets rules in advance with something called a schema these make inputs and outputs explicit in advance now house data transferred well

that’s done most commonly by sending strings back and forth through a protocol known as HTTP ideally these strings can be read by any programming language two common formats are JSON and XML and we convert data to a JSON string through a process called serialization so web development backends our back-end application layer can glue together multiple different components we can talk to front ends other servers and databases you can write web backends and pretty much any language but the most popular are Python JavaScript PHP and

 

sure c-sharp do back in frameworks are commonplace too to make your life easier and here’s the most common one for each language I mentioned if you’re wondering when we would talk to other servers backends are often broken into what’s known as services this is just a pattern to separate logic that can make things easier to scale and to work on other than responding to Api’s backends might do various other batch processes which are often done on a timer one example of this could be web scraping to talk to databases backends

often use what’s known as an ORM these just give us more semantic ways through query our database add to it and so on there are entire college courses on databases but let’s talk about them at a high level there are two main types of multifunctional databases namely sequel and no sequel each provides different strengths and guarantees sequel databases are organized in a strict column representation format that means to write or add to the database you have to adhere to the set of rules or it won’t work

 

these stricter rules allow you to do more complicated things when you’re reading from your database alternatively no sequel databases don’t really have rules they just have collections which are groups of objects so a user object might have name and email but it’s not enforced these scale much better but you have to be careful because there are no guarantees about the structure of your data again there are many more database principles that apply and what you use is totally circumstantial the three most

popular databases are probably my sequel Postgres and MongoDB finally you should know that when we’re trying to scale up our application databases are usually the slowest and they’re the bottleneck and resolving these scaling issues also has entire books written about it let’s touch on web security any web app with the login will need to consider authorization and authentication the login itself provides authentication will usually give the user a string based token that is a random sequence of characters this is

 

then used on the server-side to validate each request authorization on the other hand defines different user roles so if I’m an admin I would be able to do different things than a normal user we’re almost to the end let’s touch on infrastructure and networking data centers are pretty much where all servers and web servers exist unless you have a dedicated server running at home that’s always on these servers are just computers without monitors that are constantly running they can be controlled with SSH a direct way to

control the machine from the command line but most of what they do is automated through scripts you can group multiple servers into a private network each server in a network is called a node and in private networks servers can communicate quickly and securely servers that talk to the outside world have more to worry about they’re usually set up with a reverse proxy it’s a gateway that exposes specific ports to the outside world a port just being a machine specific address a process is running on so you

might want to expose a REST API sport but not a database port nowadays most of this Hardware management is handled by companies like AWS and digital ocean who run their own data centers and rent out space on demand this is where the term cloud computing comes in you can rent a fraction of a single server for an hourly or monthly cost cloud providers like AWS will usually offer a lot of additional free services that keep you on their platform cloud computing is expand beyond just having servers as a service though you could run individual

 

functions for a very low cost on demand – so if I wanted to send an email every time something happened in my front-end I can put that in a cloud function moving on if everything after the front-end section was not getting you that excited in this video then you can actually now use an entire back-end as a service that means everything from database to API configuration to security is handled by the service this means you can get apps up and running in a matter of hours and it’s really easy one example is firebase it’s a service.

Leave a Reply

Your email address will not be published. Required fields are marked *