1. Browser developer tools
Every modern web browser includes a powerful suite of developer tools that allows you to inspect your HTML, CSS and JavaScript! This is a must-know skill for any developer.
The more acquainted you are with the many developer tools there are the quicker you will be able to analyse and/or fix bugs in your page.
In this video we will be taking an intermediate look at the Google Developer Tools. You will learn how to do things such as: Inspect & Examine HTML/CSS, Edit HTML/CSS, Enable/Disabled styles, Move & Delete Elements, Console Logs & Other Commands, Special Console Symbols, Examine Network & Resources, Use Snippets, Workspaces & Permanent Changes, View & Remove Browser Storage, Perform Audits
Google Chrome Developer Tools Crash Course
https://www.youtube.com/watch?v=x4q86IjJFag
... in this HTML & CSS tutorial for beginners I'll go through what Google Chrome dev tools are - and how they can help us when creating websites. We'll look at inspecting elements, getting CSS selectors, editing attributes & CSS rules on the fly and also importing project folders into Chrome for live coding.
Chrome Dev Tools - HTML & CSS Crash Course
https://www.youtube.com/watch?v=25R1Jl5P7Mw
Debugging JavaScript code
Debugging is an essential skill for any JavaScript developer. In this video, we will explore two different options to do so in Chrome and in Visual Studio Code.
Debugging JavaScript (Google Chrome and Visual Studio Code)
https://www.youtube.com/watch?v=AX7uybwukkk
2. Version control with Git
Real life projects generally have multiple developers working in parallel. So a version control system like Git is needed to ensure there are no code conflicts between the developers.
Additionally, the requirements in such projects change often. So a version control system allows developers to revert and go back to an older version of the code.
An introduction to Git: what it is, and how to use it
Git is a powerful tool, but it has a reputation of baffling newcomers. It doesn’t help that most people are simply thrown in at the deep end and expected to swim.
With the right knowledge, anyone can master git. Once you start to understand it, the terminology will make more sense and you’ll (eventually) learn to love it. Stay strong 🙏
Understanding Git - Part 1/3
In this video, we'll go over all the important stuff you need to know to get started using Git. We cover git add, git commit, git branch, git checkout, and git merge!
Learn Git In 15 Minutes
https://www.youtube.com/watch?v=USjZcfj8yxE
In this Git tutorial we will talk about what exactly Git is and we will look at and work with all of the basic and most important commands such as add, commit, status, push and more. This tutorial is very beginner friendly.
Git & GitHub Crash Course For Beginners
https://www.youtube.com/watch?v=SWYqp7iY_Tc
3. Web Hosting Overview
So you created a website an want it to be available on the internet? Learn the basics about web hosting and publishing (deploying) websites.
Web Hosting is the home of your website. If you want a website you’ll need somewhere to host it. That’s exactly what a hosting service is. There are different types of web hosting like shared hosting , reseller hosting, Virtual Private Servers & Dedicated Servers. But in this video I’ll cover shared hosting which is the most popular & most affordable type of hosting.
What Is Web Hosting? Explained
https://www.youtube.com/watch?v=htbY9-yggB0
There are some services that allow you to host your websites/front-end applications for free:
- GitHub pages
- Netlify
- Firebase Hosting
In this episode we are going to take a look on how you can host your static websites for free. We are going to be using netlify to upload all of our files and assets with only 1 click. I am also going to show you how we can connect a domain to your website and add an ssl certificate!
Host Your Website For Free Tutorial
https://www.youtube.com/watch?v=tTKnuVx5qWA&t=37s
You may also want to learn about:
- Domain names