TL;DR: HTML only supports JavaScript by default, so if you want to use any other programming language for your website, you need a web framework. Also, web frameworks have a lot of complicated code already written for you to call into, preventing the need to write everything from scratch.
Let's say you want to develop a very basic website on your own. In that case, you don't really need to use a "web framework". All you need is to write a few lines of HTML. For example, if you copy the few lines of HTML below, paste them in a .html file on your computer, and double-click it, your browser will open the file as if it's any other website.
<!DOCTYPE html>
<html>
<body>
<h1>This is a web page.</h1>
</body>
</html> So that's great. But you'll notice the site is probably looking a little bland. Well, that's where CSS comes in. CSS allows us to add some style to our website (bright colors, fancy fonts, etc.)
If you wanted, you could create an entire website using just HTML and CSS. However, it's important to note that HTML and CSS are not programming languages, they're markup languages. You can think of them as Word docs that are easy for machines to read. HTML and CSS define what your website looks like, but you can't implement any logic or complicated instructions. To do that, we'd need a programming language. And the only programming language supported by default within your HTML/CSS webpage is JavaScript.
Basically, HTML/CSS is used to tell your web browser what your website looks like, but you won't be able to perform any complex operations. For example, let's say I wanted to display an alert when a visitor to my website clicked on a button. To achieve this, I'll have to use JavaScript. The code block below demonstrates how this is done. All you have to do is add script tags to your HTML file, and put the JavaScript logic inside. Copy the below text into a .html file on your computer and you'll see what I mean.
<!DOCTYPE html>
<html>
<body>
<h1>This is a web page.</h1>
<button id="button">Click me!</button>
<script>
var button = document.getElementById('button')
button.addEventListener('click', function() {
alert('Hello world!');
});
</script>
</body>
</html>Alright, so this is great. You can use HTML to outline the structure of your website, CSS to make it look good, and JavaScript to make it smart. What, then, do we need these web frameworks for??? Basically, web frameworks provide a framework for web developers to work off of. You can imagine that a lot of the basic functions are the same for most websites, so instead of having everyone re-write the source code for these functions in JavaScript every time, web frameworks provide a simple function you can call once and be done with it. It's like the difference between building a house from scratch and designing a house after someone else has already stood up all of the walls.
Also, there's another reason someone might want to use a web framework. You might recall that I said JavaScript is the only programming language supported by all major web browsers. Well, that means you can't use Python or Ruby or Java to program your website. Unless... you use a web framework. JavaScript is fine, but it also has a lot of weaknesses. Python, for example, has a vast array of libraries for developers to use, making it a very popular programming language. If you're a web developer and you want to design your website in Python, you could by using Flask or Django, both Python-based web frameworks.
Stay tuned for my next post on how to create a web app using Flask. Also, if you enjoyed reading this, consider signing up for CodeConda and registering for some coding lessons!
Comments