Stefan Stoilov

I started my developer journey with the basics of frontend - HTML, CSS and JavaScript. Mastery of those is a necessary prerequisite for any web developer. I spend a lot of time building e-commerce websites using those three languages, without using libraries or frameworks.

Throughout this process, I gained a deep understanding of their capabilities. From clever tricks and elegant styling solutions with CSS, to encapsulated DOM manipulations with JavaScript and HTML web components, I learned and used all of it vanilla during development in order to craft the best possible user experiences.

After a while, I began using TypeScript, a superset of the JavaScript language, wherever possible. I saw the value of the technology with the reduction of runtime errors and the improvements to code maintainability.

Vanilla CSS is a powerful tool styling, much faster than JS for applying styles, and with a little finesse, it can even match it for conditional style application. That being said, it has it’s limitations, such as being globally and not component scoped, and definitely can be improved syntactically.

I’ve been lucky enough to work with many, if not most, technologies that build on top of vanilla CSS to provide better DX and speed of development. Those include CSS modules, pre-processors, pre-styled component libraries, CSS-in-JS libraries, such as styled-components, and my favorite Tailwind.

Each of these technologies has it’s strengths and weaknesses. I’ve used and mastered all of them through my career. I know their capabilities and limitations. I can confidently say that a project can use any one of them and I can work with it.

Created over 10 years ago, React still is the most widely used framework for building user interfaces, and for many good reasons. Building with it is declarative, as opposed to the imperative nature of vanilla JS DOM manipulations, and it’s component architecture allows for building large, scalable and maintainable applications.

Complex projects using React require deep understanding of its model of reactivity, its vDOM diffing algorithm, in order to prevent performance issues, because there are many ways that inexperienced developers can mess up.

I specialize in creating highly optimized web applications with React. I posses a deep understanding of its inner workings and APIs. I also have a lot of experience with its vast ecosystem, including state managers, routers, auth, component libraries and more.

Next.js is the most popular framework for creating React-based applications with server side rendering and static website generation. I have extensive experience with the framework, building headless full-stack applications.

Its powerful architecture, which leverages React Server Components (RSCs), blurs the line between front and backend, enabling the rapid development of fast and secure web applications.

Although frontend development is my forte, the ability to create API endpoints with NodeJS and perform CRUD operations inside RSCs, provided by Next.js, has allowed me to work and contribute on backend functionalities on all projects I’ve worked on with the framework.

Creating beautiful and performant web animations is a passion of mine. I started by using vanilla JS with HTML web components for encapsulation of the logic, without a library to abstract away the details. This allowed me to master the fundamentals of the craft.

And for React-based projects, I started off, and sometimes still use, a similar imperative approach by utilizing refs. Since then I got the opportunity to work with Framer Motion, the most widely used animation library for React.

Currently, I use Framer Motion on most projects that require it. Although its declarative API is easy to work with, I most often find myself using its advanced features, like motion values, to create stunning yet performant animations that avoid triggering the React re-render cycle.