How to organize styles and build a complex "styleguide" design system with a set of reusable components?

Question

Design

Interested in the general methodology for building such systems and organizing design as
https://design.alfabank.ru/components/amount
codeforamerica.clearleft.com
https://getbootstrap.com/
what you need to know, what to read, what to watch in order to learn how to build such design systems,
where to start, what tools are used, what team is needed?

Answer 1

Figma, all inclusive. Read the official website and blog, for starters, and then google authorities like Roman Kamushken.

Answer 2

1) UX and representation of what we want to achieve. Used to understand what components will be needed, as well as to understand what Layouts will be in the application.
For cape layouts and UX, Axure is fine .
2) Layout design layouts.
Sketch - in my opinion, the most convenient of all, with a large number of plugins, but the truth is only for the poppy
Figma is also good, and most importantly free,
Photoshop is not the best option, but you can also if you like hardcore
3) Layout control system. Needed to store all layouts in one place, sorted by type and the rest. It will also be convenient for the website layout designer to view the necessary parameters from it, such as indents, sizes, colors, etc.
Avocode , Zeplin
4) Layout layouts. HTML+CSS will do. To write styles, you can choose a preprocessor to taste: LESS , PostCSS . Usually combined with point 5.
5) Scripting, Logic, Components, Javascript and dozens of sleepless nights.
To write the logic of work and components, Nuxt.js or React is suitable
6) Testing and debugging. Bug fixes. It will be good if the team has a person who can write Unit tests. And even better, if the developers will do it themselves.