Hello! So you may have heard of the phrase "front-end" development before, but you don't quite know what it means. Let's dive into it. Front-End Development is what I like to call the "umbrella" of our code that contains the visual side of things for our client. Essentially, everything you see on the webpage. Our role as the developer is to ensure that our websites are usable and compatible with one other.
Skills
Knowing how complex a working webpage is, you can imagine the different parts that all align with each other to form them. Essential skills required to learn front end development as a whole include knowledge of HTML, CSS, JavaScript, and Frameworks.
HTML is the section that includes all of the elements that create a webpage. For example, things such as creating a header tag, a title, a paragraph and even images. Here is how we divide our webpage into sections that we could even investigate within the browser.
For the sake of time, here we just created a header tag for the title of our blog. However, you can imagine there also being a body tag which would then include a p tag for every paragraph text of our blog. So if we were to debug our webpage, we can inspect which elements are what based on their structure in the html page.
CascadingStyleSheets (CSS)
The styling of our webpage typically goes here. From changing the color of a specific DOM element, to altering the background image of your page. CSS is a world of it's own because there are so many different ways to style a page and it grows by the day! So if you're a fan of designing how things will look on the webpage, CSS may be right up your alley.
JavaScript
Although there are many other coding languages, JavaScript remains to be one of the most commonly used. Not only that, but many people agree that learning JavaScript first can make your transition to learning other languages a lot easier.
For example, if I had an array of data that I wanted to be multiplied by 2, we can use javascript to create higher order functionality that achieves certain goals faster for us. In this case, the map function logs [2, 4, 6, 8, 10] to the console.
Frameworks
Frameworks are different tools that we as developers can use ensure that our webpages are able to "communicate" with one another. For example, if I wanted the client to add a tweet to the page, or even add a background image to their profile, we expect the state of our webpage to update to an entirely new one that includes that tweet and/or background. Frameworks allow us to do that! Just like there are many different coding languages, there are other frameworks as well. Some of them include Jquery, AngularJs, Bootstrap, Vue.js, and ReactJs; the most popular being React.
There are many other layers to front end development that can be a focus career wise such as maintaining Asynchronous HTTP Requests (AJAX) for the client side, DOM manipulation, learning about package managers (such as npm), hosting the webpage and more. Salaries can range between $60,000-$120,000 depending on your experience level. Some senior devs make up to $150,000. So it's imperative that you find your niche as a developer for job hunt. If you're one that loves to focus more on the client side of things, then you would narrow your search to anything under the front-end development umbrella.
Top comments (0)