Alabo Excel
Curated List: Frontend Web Development Beginer Resources

Photo by Glenn Carstens-Peters on Unsplash

Curated List: Frontend Web Development Beginer Resources

Alabo Excel's photo
Alabo Excel
·

8 min read

Table of contents

Welcome!

Web development is an ever-evolving field and with the constant advancements in technology, it can be not easy to know where to start. This guide is specifically designed for beginners interested in learning the basics of front-end web development. We will be covering key concepts such as HTML, CSS, and JavaScript, as well as providing resources and tutorials to help you along the way. By the end of this guide, you will have a solid foundation in front-end web development and be well on your way to creating your own dynamic and interactive websites. With the given resources and tutorials in this guide, you can start your journey of Frontend web development completely free.

Let's get started!

NOTE: you don't have to watch all the videos in every section before moving to the next if you feel you don't fully grasp the concept try building a project with what you have learnt check out frontend mentors for projects.

HTML RESOURCES

  • "HTML Tutorial for Beginners" by LearnCode.academy: This tutorial provides a comprehensive introduction to HTML, including the structure of a basic HTML document, common tags, and how to create links and images.

  • "HTML Crash Course For Absolute Beginners" by Traversy Media: This video covers the basics of HTML in a fast-paced, easy-to-follow format. It's a perfect video for those who want to quickly learn the essentials of HTML.

  • "HTML & CSS Tutorial For Beginners" by Dev Ed: This tutorial covers both HTML and CSS, and provides a great introduction to the basics of web development.

  • "How To Create a Website: HTML & CSS Tutorial" by FreeCodeCamp: This tutorial takes a step-by-step approach to create a website, covering everything from the basics of HTML and CSS to more advanced topics like responsive design.

  • "Learn HTML5 in 1 hour" by The Net Ninja: This video provides an overview of the main features of HTML5, and shows how to use them to create modern web pages.

If you're more of an article person here are some cool articles you might want to check out

These articles cover a range of topics such as HTML document structure, different types of elements and tags, and basic formatting. They also provide examples and exercises to help you practice what you've learned.

CSS RESOURCES

These video tutorial cover a range of topics such as selecting elements, cascading styles, Box Model and layout, Flexbox and Grid layout, Transitions and animations and Responsive design, using examples and exercises to help you understand the concepts, These tutorial will help you to get started with css styling and make you comfortable with more advanced CSS concepts in the future.

These articles cover a range of topics such as Selectors, cascading styles, Box Model and layout, Flexbox and Grid layout, Transitions and animations, Responsive design and CSS preprocessors. They also provide examples and exercises to help you practice what you've learned, These articles will give you a good foundation for writing clean and maintainable CSS code.

GIT AND GITHUB

  • Git & GitHub Crash Course for Beginners: This video tutorial, by Traversy Media, covers the basics of Git and GitHub and gives you a quick overview of the most commonly used commands and features.

  • Git and GitHub Tutorial for Beginners : This video tutorial by LearnCode.academy provides a step-by-step guide to using Git and GitHub. It covers the basics of Git and GitHub and also shows you how to use them together.

  • Git and GitHub Tutorial for Beginners: This video tutorial by The Net Ninja provides a comprehensive introduction to Git and GitHub. It covers the basics of Git, how to use GitHub, and how to collaborate with others on GitHub.

  • Git and Github for beginners by freeCodeCamp.org: This tutorial will cover the basics of git and github and provide a good starting point for getting started with version control and using Github.

you might also want to read

  • "Git for beginners: The definitive practical guide" by Atlassian: This article provides a practical introduction to Git, covering the basics of how to use the tool and the key concepts you need to understand. It includes examples and diagrams to help you visualize the concepts.

  • "Git and GitHub (introduction): This article provides an introduction to GitHub, including a brief overview of what it is, how it works, and how to use it. It covers the basics of creating and managing repositories, working with branches, and more.

  • "Git and GitHub: A beginner’s guide to version control" by Dev.to: This guide provides a brief overview of Git and GitHub, and explains how they are used together to manage code. It covers the basics of Git commands, how to set up a repository on GitHub, and how to collaborate with others.

BOOTSTRAP RESOURCES

it'll also do some good to check out the official documentation here.

JAVASCRIPT RESOURCES

These video tutorials cover a range of topics such as JavaScript Syntax, Data Types, Variables, Functions, Objects, and DOM manipulation, they also cover the newer features introduced in ES6 and ES7. They use examples and exercises to help you understand the concepts, and will give you a good foundation to start learning more advanced JavaScript topics.

These articles cover a range of topics such as JavaScript Syntax, Data Types, Variables, Functions, Objects, and DOM manipulation, They also provide examples and exercises to help you practice what you've learned. These articles will give you a good foundation for writing JavaScript code and will help you understand the basics of programming logic, and make you comfortable with more advanced JavaScript concepts in the future.

REACT.JS RESOURCES

These video tutorials cover a range of topics such as React components, JSX, state and props management, hooks and lifecycle methods, and how to build and manage a React application. They will help you understand the basics of React and how to use it to build user interfaces.

CONSLUSION

Web Development is a field that is constantly evolving, but with the right resources and guidance, it can be accessible for anyone. The web development ecosystem is vast, but the three main building blocks of any web application are HTML, CSS and JavaScript. They are the foundation of web development and are essential for any beginner who wants to learn web development. There are various free resources available such as tutorials, articles and videos, that can help you to learn these technologies. This guide provided you with an overview of various free resources such as tutorials, articles, and videos for the Frontend web development for the beginners.

As you continue learning and practicing, you will gain more experience and skills, and be able to create your own web applications.

As a beginner don't forget to join communities and ask questions if you get stuck wish you all the best in your journey.

Frontend DevelopmentDeveloperbeginner#beginners #learningtocode #100daysofcodeHTML5