There is more to UI development than Javascript!

Rishabh Dua
The Desk of Rishabh
3 min readJun 2, 2020

JS Frameworks like React, Angular, Vue etc are making it more exciting to build web (and mobile) applications with ease. They are not only reducing development time but also more developers are trying them out and becoming “UI developers”.

I have received multiple UI developer profiles here in Bangalore, India who have worked on React or Angular for 2–3 years but have no idea about the ecosystem around them. So thought to write a blog and explain what actually entails to be a UI developer and its much more than creating a few components / flows in your favourite framework.

UI developer should have good understanding of the entire web stack and not just the client side. Broadly the topics for a UI developer other than client side development are:

  1. HTTP, Websockets, TCP
  2. API Design
  3. Webservers, CDN
  4. Security
  5. DevOps, Site Reliability, Operations

Protocols — HTTP, Websockets, TCP etc

Understanding of http constructs like HTTP 1.1 vs HTTP 2, Websockets, REST API, Client side & Server side static resource caching, CDN etc all give a developer exposure to the actual architecture. The developer understands how actually the client side resources land on the browser and what are the tweaks necessary to give a better experience.

I am not saying you to understand how actually the protocol was defined and read the white paper. But its different constructs like “Request Methods”, limitations like size of URL, size of Cookie Header, sending data in JSON, XML, headers for downloading a file. There are plenty of blogs and reading material on these.

API Design

API design is not just the REST/SOAP API design but also your own component properties are nothing but APIs. So for a UI developer a deep understanding of sound principles for API design are paramount.

As a UI developer you will work on top of the some set of webservice API exposed by backend in one project or the other. Reading through REST constructs will give you some context on how the API design actually works.

Webservers, CDN

One of the most commonly used open source webserver to serve static resources “nginx”. Pick a webserver that you work on, and you should have a working knowledge of its basic config parameters like enabling caching, gzip, rewrite rules and the likes.

Most of the client side resources are being served via CDN. Frameworks like Gatsby are taking server side rendering to the CDN as well. As a UI Developer you should know when and why to choose a CDN.

Security

The amount of attempts to hack a website are on the reason both black hat and white hat hackers are attempting on many popular websites every single second.

Basic attacks like IFRAME, CORS, XSS are now well known, but just keeping up to date with latest vulnerabilities allows you to take decision while implementing.

Operations — Devops, SRE etc

The actual deployment and rollout of your code, using & setting up tools for CICD. Creating dockers, hooking up to kubernetes, integrating github repo with jenkins etc all are parts and parcel of working on your project. Adding to this adding Alerts & Monitoring to your projects. Integrating systems like logstash, sentinel, pingdom etc to make your project reliable.

Summary

To summarise, don’t get stuck with a particular framework, always question how things are working around your ecosystem to expand your learning.

References

  1. https://roadmap.sh/frontend

--

--