A full-stack developer has to work on almost every part of development stack. Development of what? Usually it’s about web applications, but for someone else it can also about mobile or desktop application stacks.
So, we may say that a full-stack developer is kind of a full-featured, all-rounded programmer. If we’re referring to the Web environment, for example, this term is in contrast with the terms “front-end developer” and “back-end developer“, both of which indicate a developer who specializes in one specific part of the stack. The front-end developer is the one who designs robust, flexible and responsive layouts using technologies such as HTML, CSS and Javascript as well as development tools like SaSS, Gulp, or advanced Javascript frameworks like Angular, React or Vue.
As I already said in a previous article here in Codemotion Magazine, in the modern development era, all Web developers should have a solid understanding of both the front-end and the back-end in order to be successful developers, although it could be good to specialize in one part rather than the other. So, it is quite good for a front-end web designer to have a solid grasp of what happens behind the scenes of a web-app, in the server, as well as it is good for a back-end developer to understand the principles of a good-quality layout and how the user interact with the visible part of the application. So, here, I’m going to share my tips on how a “basic” full-stack developer could become a great full-stack developer and have a competitive edge on the market.
Tip#1: Really know how to develop a solid layout
First of all, as a full-stack developer, you should be able to design a robust, flexible and good-looking layout, filled with awesome features. In order for a web application to be successful, it must be enjoyable on the visible part, namely, the front-end. The main technologies with which you construct that visible part are the HTML, that makes the structure of the layout, the CSS that makes the style/graphic part and maybe Javascript that forms the interactive part. To design a layout is an art, but here we’re not only talking about graphical concepts. A layout must be easily navigable and internally well-constructed.
A front-end developer should understand that his task is similar to the ones of a developer who write pure code in a real programming language, such as C#, Python or Ruby. He has to understand the core design patterns that are the basis of all the modern layouts and make them part of the development process: remember, the code part of the layout creation is very important.
The “separation of concerns” tells us that we should avoid mixing the structure from both the style and the interactive components, in order to design a modular architecture. The “mobile-first” pattern tells us that we should design our layout for the mobile devices first, and then switch to the bigger devices (such as laptops and desktops) through a responsive CSS.
The HTML should follow the guidelines of the w3c, so we have to use good semantics and naming conventions. You have to grasp the main features of the modern styling techniques, such as the Grid and the Flexbox model, and know what kind of HTML element is the good one to use in a specific context. Your front-end code should take into consideration Search-Engine-optimization concepts, too. A web application is a complex software that involves many different aspects that fuse together, and a good full-stack developer is able to see the importance of every single aspect.
Tip#2: know how to use the cutting-edge tools
In the previous point, without being too specific, I wanted to make clear that you have to pay attention to the quality of code on the front-end part, too. In fact, from a good-quality client-side code comes a good-quality web-application.
The second tip I want to share is about the ability of a developer to properly use cutting-edge tools that aid the development in different ways. First of all, you should have a solid understanding of the core technologies by which these tools are built, and this is the point one. But you should not write your code from scratch. A CSS framework, like for example Bootstrap, allows you to construct vey well-build layouts that follow all of the principles of a good layout, in no time. Using a CSS framework reduce browser inconsistencies and saves us a lot of time. So, being able to wield a framework is really a good thing. In the same way using a dynamic preprocessor style sheet language that can be compiled into Cascading Style Sheets, like SaSS or LESS, is great: you have the power of a programming language to write your static styles, and thus produce a modular, scalable architecture. In the Javascript zone, a part from a solid understanding of the newest ECMA architecture, you would benefit from the knowledge of tools such as Gulp (an open-source a streaming build system used for automation of time-consuming and repetitive tasks involved in web development like minification, concatenation, cache busting, unit testing and optimization), Babel (a free and open-source JavaScript transcompiler used to convert ECMAScript 2015+/ES6+ code into a backwards compatible version of JavaScript that can be run by older JavaScript engines), npm (a package management system), webpack and the others.
A full-stack developer should know how to use at least one of the modern Javascript (or front-end) frameworks, namely Angular, React or Vue. Angular is from Google, React from Facebook and Vue from Evan You. They all are great software, and the core principle they share are the same: a virtual DOM that is reactive to changes. These tools are capable of powering sophisticated Single-Page Applications as well as complex web-applications that involve both front-end and back-end technologies. Vue, for example, is focused on the view layer (of the Model-View-Controller architecture) only, and is easy to pick up and integrate with other libraries or existing projects.
Moreover, TypeScript, a strict syntactical superset of JavaScript that adds optional static typing to the language, allows you to write super-robust Javascript code, and is a must-know for a modern full-stack developer. If you are studying Angular, TypeScript is mandatory.
The world market highly requires developers that are good at writing modern and flexible code, and that are able to make a good use of modern tools too. It’s a good practice to specialize in one tool rather than another, but the right mindset of a good full-stack developer is to be open to interiorize new development tools, and the more tools you are able to wield, the more competitive you are on the market.
Another feature that is highly required by the modern market is a deep knowledge of a distributed version control system, like Git. Git is this kind of system for tracking changes in source code during software development, and although it can be used to track changes in any set of files, it is designed essentially for coordinating work among programmers. Developers can work both on the same file, or personal branches that could be merged in a later moment. A knowledge of such a system is mandatory for a good full-stack developer, because the quality of a software and a web application depends on both the quality and the maintenance of the code.
Last but not least, another tool a full-stack developer should be able to wield efficiently is a code editor. A code editor speeds up dramatically the development of an application, it allows to organize the work efficiently and connect with several external resources, such as libraries, version control systems and packages. Depending on the particular set of technologies that you are using, one editor could be better than others. The thing is, you should be able to work efficiently with your editor, using feature plug-in and extensions if necessary, mastering its components and look for a cool coding experience. This aspect will dramatically improve your efficiency as a developer.
Tip#3: be good at one server-side technology, but know the others too, and make security the top priority
The world of web development is and will always be rich of alternatives. Of course, it is difficult to master all the languages and tools that spread from the market, but as I said, the more tools you’re able to wield, the more competitive you are. On the server side, you now have such a quantity of possible choices: PHP from Zend Technologies, C# and .NET framework from Microsoft, Java and Spring, and finally Node.js and the back-end Javascript frameworks.
I’m not the kind of developer who elevates one technology at the expense of another. All these technologies are very good, if you have properly mastered them. This is the key point: the mastery of a back-end development stack.
As a full-stack developer you should understand all the principles of the interaction between the client and the server, how to choose the right architecture for the current web project and set up a good-quality environment in which your web application can thrive.
You should be able to work with a multitude of database-driven technology, so, the knowledge of a database language, such as SQL (although the NoSQL counterpart is equally important), is a must. The client sends and receives data from and to the server, and these data have to be stored in a solid database structure. As long as the application grows, the knowledge required to handle such data exchange grows accordingly.
Moreover, you should have a deep understanding of modern and robust development architectures and design patterns, like the MVC (Model-View-Controller), MVP (Model-View-Presenter), MVVM (Model-View-View-Model) and know how to consistently implement them into your application. The usage of such architectures is mandatory for good quality applications.
But the back-end’s most important task is the making of security layers. We should be able to develop a super-secure environment, and implement all of the techniques and patterns that allow us to protect both user data, internal data and the entire application. This is the most important aspect of a software application. If the security fails, the entire application fails, too, no matter how good the layout or the architecture you developed. This concept applies both to the client and to the server part of our applications. For example, Cross-Site Scripting (XSS) is one of the most common vulnerability in web applications and also the name of a client-side attack in which the attacker injects and runs a malicious script into a legitimate web page. Browsers are capable of displaying HTML and executing JavaScript: if the application does not escape special characters in the input/output and reflects user input as-is back to the browser, a user might be able to launch a Cross-Site Scripting attack successfully.
So, whatever the development stack you chose, you must pay careful attention to the security component, this is a mandatory ability of a good full-stack developer.
As well as in the front-end part of our analysis, in the back-end part you should at least have mastery of one of the server-side options, but we have to keep an eye of others choices too. The modern market requires PHP developers, Java developers, .NET developers and Node developers. The last ones, in particular, are becoming increasingly sought after and appreciated by the market, due to the incredible increase in popularity of the Javascript language and its cutting-edge architecture. You should keep an open mind and try to understand different kind of development technologies: they all have excellent features to offer, and the process of learning one technology helps you to understand other technologies more deeply.
At the end of the day, we can say that the keys to becoming a competitive full-stack developer are a good polymorphism (and no, I’m not talking about an Object-Oriented concept), namely the ability to wield a wide collection of different tools in a professional way, and the willingness to follow solid, well-known rules to software development. And, last but not least, as I say every single time, you have to love what you do, and make what you do your passion… both in the front and the back-end, of course.
