Front End Engineer: Scope of work and responsibility
Tags: forntend, engineer, responsibility
Published: 2020-11-27 06:16:17

---
title: Front End Engineer: Scope of work and responsibility
published: true
description: Front End Engineer Scope of work and responsibility
tags: forntend,Engineer,responsibility
//cover_image: https://direct_url_to_image.jpg
---

There was a time when html and css wasn’t anything too difficult. Knowing some rules was enough. Was with [jQuery](https://jquery.com/) . 2009 [node](https://nodejs.org/en/) and 2010 [npm](https://www.npmjs.com/) and [angularjs](https://angularjs.org/) the scope and complexity of both the client-side development creativity grows increasingly. Client-side and server-side development are different from breaking the traditional practice of full stack developer. The demand for the skilled frontend developer (FE Dev) is created and it is increasing. This trend continues to this day.

Year 2017 while knocking on the door, the scope of FE Dev’s work has increased. A FE Dev on the development team has to work with both designers and backend developers. So you have to have a basic idea about their work as well as their work. Well, what are the frontend developers’ own tasks?

**html and wireframe from psd**

It’s almost everyone I know. Format HTML and CSS from Photoshop File (psd), Illustrator File (ai) or Sketch File [sketch](https://www.sketch.com/) or xd file (Adobe XD). What most people do not know is that FE Dev needs to have a basic idea of ​​how to design changes with photoshop, illustrator and sketch. At any time in the [development cycle](https://www.tutorialspoint.com/software_engineering/software_development_life_cycle.htm) you will need to know how to create a quick [wireframe](https://webdesign.tutsplus.com/articles/a-beginners-guide-to-wireframing--webdesign-7399) to discuss with the Idea or Concept team members.

**Active role in design**

If the final product appears to have an adverse effect on the existing design after receiving the complete design or during the [design process](https://www.shopify.com/partners/blog/109299398-6-tips-for-building-a-web-design-process-that-boosts-your-team-s-efficiency), it should be discussed with the other team members, including the designer, and actively involved in the solution process.

**Client Side Logic**

Write client side logic with JavaScript. In this case, the nature of work can be of two types.

There are some organizations where backend developer [api](https://en.wikipedia.org/wiki/API) develops. FE Dev integrates api into client. However, there are usually two developers. One works in HTML and CSS and the other works only with JavaScript. He can be just a client side JavaScript developer or a full stack JavaScript developer.

In other instances, FE Dev writes some JavaScript with html and CSS. The rest of the work is done by the backend.

**[Responsive](https://thenextweb.com/dd/2015/12/22/the-web-in-2016-long-live-responsive-design/) and cross-browser compatible**

The emergence of smartphones, tabs and their widespread use is one of the major factors behind FE Dev’s growth. The same can be said of [cross-browser / platform compatibility](https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Cross_browser_testing/Introduction). The design should be visible and functional on different sized devices.

**Performance optimization**

[Performance optimization](https://www.keycdn.com/blog/website-performance-optimization) itself is a huge field. In many large establishments or products, there is only one performance engineer for this purpose. Performance Engineering is a branch of Frontend Development.

The [task runner](https://www.smashingmagazine.com/2016/06/harness-machines-productive-task-runners/) or [module bundler](https://www.sitepoint.com/javascript-modules-bundling-transpiling/) used in the organization should be well thought of. You need to have a basic idea about backend for optimization.

**Keeping up to date**

In the Frontend development field, more and more new things are arriving every day. FE Dev needs to keep itself updated as much as possible. Community for developers to learn in [Stack Overflow](https://stackoverflow.com/). [Newsletters](https://css-weekly.com/) , blogs to follow, reads, new concepts to actually test in [codepen](https://codepen.io/), [stackblitz](https://stackblitz.com/). Store data in GitHub. You have to do this work in your own free time.

Frontend means not just psd to html or just JavaScript. The scope of the frontend extends far beyond. Unrestricted field of work. The frontend means the joy of hitting the ever-new bar.

If you have an opinion or question about the article, comment. If you like please share.

[Original Article](http://bit.ly/38mPASn)
Author: Kamal Sharif