Mastering the front-end: Alexander Molchanov on leading Windmill’s HTML/CSS team
In this installment of Windmill’s Thought Leadership Series, we sat down with Alexander Molchanov, our seasoned engineering manager who also leads the HTML/CSS team. Alexander provided valuable insights into his area of expertise and discussed his experiences working at Windmill.
What is Windmill’s HTML/CSS team responsible for?
Alexander Molchanov: Well, first of all, Windmill is a company that cares about design solutions, and, as such, there is a big team of great designers who create innovative experience designs. The HTML/CSS team works closely with designers to implement their vision and any avante garde ideas they have in the first-class web applications of our company. By keeping a keen eye for small details, using the best approaches and modern technologies, and improving the final results with several stages of testing and reviews, we bring this experience to end-users.
We are also responsible for design systems, responsive design (rendering on displays of various sizes), accessibility, image optimization, SEO, email templates, and print styles, etc. Sometimes we can work independently on some types of projects, but mostly we work together with other development teams, such as Angular and React, on large, complex web applications.
What are the key technical skills for HTML/CSS developers at Windmill?
AM: Of course, HTML and CSS are basic and key skills, but that’s not all. The list of key skills also includes SCSS, SVG, WAI-ARIA, JavaScript/TypeScript. Also, our work involves knowledge of React and Angular (at least at a basic level), GIT, design and build tools, UI component libraries, package managers, design systems, and so on. There are even more secondary skills, but it makes no sense to dwell on them. In total, the list of skills and knowledge areas in our Team Levels Framework consists of 87 items at the moment.
We used to also learn and practice jQuery, PHP, MySQL, server administration for our WordPress-based websites, but now another team is in charge of that, so we have more time to hone our core skills and learn some new related technologies.
What other Front-End teams are there in the company?
AM: Currently there are four Front-End teams in the company: HTML/CSS, Angular, React and CMS. Each team has many excellent specialists in their field, who have years of experience behind them and are still intensively developing to reach the peak of their capacity and efficiency. Depending on the requirements of the project, selected technologies and some other aspects, front-end developers from different teams form mixed sub-teams and united in squads with other teams (such as Back-End, Quality Assurance, Management, etc.) jointly develop modern and high-quality products of the company. This model has proven itself, especially in large long-term projects.
What do you think is the advantage of highly specialized Front-End teams?
AM: The main advantage is the ability of such teams to create projects of any complexity with well-thought-out solutions and excellent quality.
It’s no secret that every developer is limited in the way of his development by a number of factors, for example, the ability to assimilate a certain amount of information per unit of time, free time for learning, memory stability, monotony or technological limitations of projects, and so on. In addition, technologies do not stand still and are continuously developing, supplementing, changing every day. Also, new auxiliary tools appear, new specifications come out, more and more libraries and frameworks are invented, while something becomes irrevocably outdated and loses its relevance.
And all this leads to the fact that it is easier for developers with a smaller technology stack to stay on the wave of relevance. They have more opportunities not only to go as far as possible into the jungle of their technologies, experiment, practice non-standard approaches, understand the slightest nuances and specifics of the selected technologies, but also more often and deeper to track any innovations. They hone their skills almost to the ideal, can solve the task of any complexity within their specialization, write cleaner and more optimized code, make fewer mistakes, use significantly fewer hardcodes and workarounds, etc.
If we talk about developers with a wider technology stack, they are more versatile, but at the same time, their knowledge and skills in each individual technology are less than highly specialized developers. Therefore, the quality of their code and the visual part are often worse; complex tasks take longer to solve or are even rejected; or for some solutions, cumbersome alternatives or third-party libraries are used instead of several lines of correct code, etc. As a result, projects can look worse, work slower, have more different problems, and it’s harder to maintain them.
Nevertheless, any specialists are in demand now. As for the choice between highly specialized and cross-functional specialists, it depends primarily on the company’s goals, expectations, and quality requirements.
Does knowing other technologies make you a better web developer?
AM: I think it’s useful to be familiar with other technologies. This can help you better understand all stages of project development, work with other teams more easily, resolve various problems. But it’s important to find the line because spending too much time on other technologies can negatively affect your core skills. In addition, not all technologies might come in handy, so it’s not really good idea to waste your time on them. Everything must be wise. And everything needs a reason. As for me personally, I can spend up to 20 percent of my time studying other technologies that are interesting to me and useful for projects.
What are your main responsibilities as HTML/CSS lead?
AM: All my responsibilities can be roughly divided into 3 groups: general, project-related, and intradepartmental.
The general responsibilities include the development and updating of standards and technical documentation as well as universal modules and libraries; the introduction of new technologies and optimization approaches; the development of trial tasks and evaluation systems; prescreening candidates and holding technical interviews; communicating with other leads and top-management around high-level questions; knowledge sharing between departments; and participation in resource planning and allocation, and so on.
Project-related responsibilities contain the following: communication with clients and team members, analysis of the project goals and technical expertise, project planning and estimation, support in resource management, work on project architecture and technical solutions (together with other leads), technical documentation, regular code reviews, VQA, development strategy, and refactoring plans.
I also have intradepartmental responsibilities, which include department development strategy, team expansion planning, technical onboarding and continuous support, integration scheme, mentoring, team documentation, OKR process, inventing and conducting various training events (like code hackathons, workshops, technical meetups, etc.), review and verification of developer skills, supporting materials and learning programs, review of developers seniority level, knowledge sharing, introduction to new technologies, team motivation, resolving various issues, and corporate events.
What is the prevailing atmosphere in your team?
AM: Actually, I’m very proud of my team. This is the case when the team consists not only of cool developers but also of good sociable people. We have a very friendly and exciting atmosphere. All the guys in the team are very positive, without arrogance and pomposity, they are always ready to help each other, support in any matter. We often hold various events, like to brainstorm and resolve issues together, periodically meet outside of business hours to discuss work and personal issues. Of course, it helps to work better, easier and more fun!
What technologies have you started using in recent years?
AM: Since we stopped supporting the Internet Explorer on our projects a few years ago, and nothing else holding us back, we have begun to use the full power of modern CSS. We have started using CSS Grids, CSS custom properties, content-based intrinsic sizes and context-based extrinsic sizes, logical properties, new functions, various modern properties and values that were not supported by IE, etc. We also abandoned almost all vendor prefixes, stopped using different fallbacks and polyfills, optimized old mixins, and so on.
With the start of React projects, we mastered a new javascript library and a number of new knowledge, started using [React UI library] Ant Design, learned styled-components, discovered new auxiliary tools for facilitating our work and automating some processes. There are also many interesting plans for the near future, but it is too early to talk about them.
How does the HTML/CSS team ensure the best implementation of projects?
AM: We always take care about the quality of our work. Years of experience, responsibility, well-coordinated teamwork and a number of established processes help in this matter.
So first of all, it is an individual approach. Even at the project planning stage, we carefully review all the requirements for the project and the client’s expectations, thoroughly analyze them and choose the best suitable technologies taking into account possible risks and scalability.
Secondly, in the process of working on a project, each piece of code goes through several levels of thorough code reviews by different developers. Also we do visual quality assurance, stress-testing, conduct code optimization sessions, and so on.
Thirdly, we have multi-level testing, which includes both automated testing and manual testing in various conditions at different levels: by developers, tech leads, designers, QA engineers, and managers.
Fourthly, we periodically conduct global code review sessions between sprints and collectively decide what can be improved. There is always something to cut, optimize, redo or refactor. Thus, the project code is not littered and is always under close scrutiny.
Finally, we carefully test the project at the stage of completion and put the final touches on it.
What are you doing to train HTML/CSS developers quickly and effectively? Are there any training activities in the team?
AM: I think we have succeeded in this direction. In addition to a good mentorship model, OKR process, general development programs and shared training materials, we have a number of training events within the department. Some of them are code hackathons, workshops, technical meetups, master-classes.
Code Hackathons help developers to improve their practical skills on the top level, better analyze tasks and make the correct decision, look at problems from all angles, think outside the box, improve their ability to work under the pressure and with tight deadlines. And all this without real stressful situations on the project, but in a gambling and interesting way.
Master-classes help broaden the horizons of developers. At them, we analyze all possible options for solving one problem in different ways, both obvious and very unexpected alternatives, find and discuss the best approaches, share experience and ideas.
Workshops have many different advantages: learning new technologies and the latest updates in existing ones, consolidating old knowledge, improving teamwork skills, and finding common interests by developers. Fairly often these events take the form of quizzes, mini-games, interactive exercises, collaborative coding, or group discussions.
As for technical meetups, they can be held by developers on absolutely any topic that is useful to the team. The history of all meetups is archived and available for new developers to study.
Usually, we have up to ten events per quarter. This is enough to constantly improve the overall technical skills of the team, and at the same time not overload the developers.
What are the career prospects for developers in your specialty?
AM: Our specialty is a good option if you would like to start your career in web development because HTML and CSS are key technologies in this area. Each web developer, regardless of direction, should know at least the basics of these technologies. After a few years of study and practice, you can choose your future path: Continue to grow and become a great specialist in this direction, or easily switch to Angular or React (for example) or to technical project management, or whatever you like. There are no boundaries here. The main thing is to know exactly what you want and where you would like to go. Any specialists are valuable in the market, but only if they are good.
What advice would you offer fresh graduates pursuing a career in your profession?
AM: The most important thing is to be diligent and attentive. Try to spend as much time as possible on learning and practice, at first preferably not only during the day, but also at night. Do not miss the chance to dig deeper, experiment, look for popular solutions to average problems and compare them with your own solutions. Always think and analyze, do not learn automatically.
In terms of learning itself, it is now much easier because there are guides, videos, and courses available on the internet for any budget. You can experiment with different types of training and understand what you like best and understand better. I would highly recommend taking some interactive courses. I will not advertise any specifically for obvious reasons, but you can easily Google and choose the best ones by rating.
Interactive courses are a very interesting approach where you learn theory and immediately practice in a playful manner. This causes additional interest and excitement and makes learning not boring at all. In addition, it would be good to find an experienced mentor who will help you with advice, direct you on the true path, and point you in the right direction. A good mentor will shorten your learning time by several times and help you avoid the most common mistakes.
Finally, could you say a few words about working for the company?
AM: I’ve worked at Windmill for over 5 years. That already says a lot. We have a good general atmosphere in the company, with many great specialists, interesting complex projects, high team morale, and good career opportunities. What else does a developer need for happiness and self-realization? Of course, there are some challenges that can happen in any work, but they are rare, minimal, and quickly resolved. So in general everything is great!
Windmill Digital offers high-quality product design services. Our experts are highly skilled in their field and are experienced in creating exceptional products for our broad range of clients. For more information, contact us here.