Frontend Web Development Roadmap👇
đź”— Good to know
WWW: WWW can be defined as the collection of different websites around the world, containing different information shared via local servers(or computers).
Learn hereHTTP: HTTP stands for HyperText Transfer Protocol.
It is a protocol used to access the data on the World Wide Web (www).
The HTTP protocol can be used to transfer the data in the form of plain text, hypertext, audio, video, and so on.
Learn hereBrowser: A browser is an application program that provides a way to look at and interact with all the information on the World Wide Web. This includes Web pages, videos and images.
Learn here
đź”— Basics
HTML: HTML is used to form the “skeleton”, or the base, of any website.
Learn HTMLCSS: It is used to add styles to your web pages like colors, fonts, layouts, and animations.
Learn CSSJavaScript: Javascript improves the interactivity of your website. It adds functionality to the website.
Learn JavaScript
đź”— Pro CSS
Preprocessors: With the help of CSS preprocessors, we can use logic in our styling files like variables, functions, mixins, inheritance, etc. SASS/SCSS, Stylus, and Less are a few popular preprocessors.
Learn moreFrameworks: CSS Frameworks like Bootstrap, Materialize, Tailwind, Semantic UI, Bulma, etc.
Learn more
đź”— Pro Javascript
Frameworks: Frameworks offer enhanced functionality without writing the code from scratch. Angular, React, Vue.js, Meteor, etc are some popular Javascript Frameworks.
Read moreDOM: The Document Object Model (DOM) is an application programming interface (API) for HTML and XML documents.
Read moreFetch API: The Fetch API provides an interface for fetching resources.
Learn moreModern Javascript: Learn new features and syntaxes introduced in JavaScript in ES6, ES7, ES8, etc.
Read more
đź”— Intermediate
đź”— Advanced
Package Manager: A Package Manager is a tool that allows you to install, configure, update and manage software packages. NPM and Yarn are two popular Package Managers.
Learn moreVersion Control: It allows you to manage and track changes to the source code and also revert to a previous version of the code, instead of manually reverting the changes. Git is the popular Version Control System.
Know moreTesting & Performance: Testing the website from a user's point of view.
Read moreDeployment: Pushing changes or updates from one deployment environment to another.
What & how?SEO: Making your content search-friendly.
Read more
đź”— Optional
- Designing: Basic understanding of image manipulation, designing graphical components, etc is a huge bonus. Some of the popular tools are Adobe Photoshop, Figma, etc.
This is it in roadmap to become a Front End Web Developer. Some amazing resources are mentioned below:
- Detailed Roadmap with step by step guide
- GitHub
Thanks for Reading!
Let's connect 👇
Instagram: https://instagram.com/coding_dev_
Support: https://www.buymeacoffee.com/codingdev
Top comments (0)
Some comments may only be visible to logged-in visitors. Sign in to view all comments. Some comments have been hidden by the post's author - find out more