The Front-end Learning Map, part 1

  • Computer and Programming
  • Internet and Network
  • Requests and Servers
  • Browser, HTML, CSS and Javascript
  • Rendering flow and native APIs
  • Performance

A possible evolution towards the Front-end developer

When the Web started, it didn’t make much sense to have a specific professional for the client-side, since HTML and CSS were very simple and straightforward topics by that time. The programmer was someone who found a way to connect a folder on his/her computer to the Web, and generate some pages with content. Eventually, different technology companies specialized in (as well as took responsibility for and, of course, monetized) taking care of the infrastructure of putting something on the Web, which led some professionals to study the administration of servers and databases. The languages ​​available in these online environments have given study material to Back-end developers. And with the evolution of browsers, the creation of Javascript and the maturity of users, a professional has become increasingly necessary in order to take care of the client-side (you can read more about the evolution of the Javascript ecosystem in this article).

What does a Front-end developer do?

If you think about it, the work of a Front-end developer is just the end of a long chain of professionals whose goal is to organize and share information. In fact, people have been engaged with that kind of activity for a long time.

Paintings in caves, before the written word.
Libraries with indexed and cataloged information.
Datacenters with indexed information in computers hardware.
Software, organised and cataloged information in your computer.

And so our map begins…

Once it became possible to store and organize information on the computer, the Front-end journey officially began. From this point onwards, it would be useful for the client-side developer to learn at least a little about the following subjects.

You can see the whole map with its branches here.

Computer and Programming

  • Knowing a little about how information is transformed into different formats, bits, bytes, and stored, provides you a background to better understand data structures and formats, such as typed arrays (Uint8Array, etc.), Buffers, and so on.
  • Understanding how information (variables, for example) is indicated and recorded in memory is important to learn specific data structures that are increasingly being implemented in Javascript. Furthermore, it is important to understand how Set, Map, Lists and other data structures with well-defined characteristics (unlike Array) — such as fixed size, keys and binary trees influence the performance. It would be also important for you to understand the importance of Javascript compilers that use typing and other resources to try to bring some benefits from compiled languages.
  • Recording information in the HD is slow, so avoid caching or recording things straight in files.
  • Choose RAM memory, because the access is faster. You will rarely need anything so persistent that could not be written into memory.
  • The GPU processes graphics data faster than the CPU, so hardware acceleration in CSS animations is important.
  • If you understand how threads and processes work, it will be much easier for you to understand the differences between the languages ​​and features of Node and Eventloop.
  • Academic / mathematical / scientific context: depending on the purpose, you will often come across the functional paradigm
  • Enterprise software, object-orientation
  • Graphical interface (GUI), a lot of MVC and its variations
Photo by Daniil Silantev on Unsplash



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store