Lesson 2. Acquaintance with VKUI

The main thing in the lesson

•

VKUI is a library of adaptive React components that will help your app blend seamlessly into UI VKontakte
•

The structure of the application is formed by the following components:

TypeScript
<SplitLayout> // Контейнер для создания многоколоночны?1?… экранов <SplitCol> // Отрисовка отдельны?1?… колонок <Epic> // Используется для организации экранов ... <View> // Базовый компонент для создания панелей <Panel>...</Panel> // Экраны приложения, <Panel>...</Panel> // из нескольки?1?… виден только один ... // ... </View> </Epic> </SplitCol> </SplitLayout>
•
In addition to the components mentioned above, mini-applications also often use the following:
- •
  
  Tabbar Component for navigation inside Epic . It is a lower navigation block with tabs. Within it are located TabbarItem - individual elements of navigation (buttons).
- •
  
  FixedLayout A component that anchors embedded components at the top or bottom of the screen scope. Ideal for buttons “Order” and “Share?2?.
•

To display the dish information, we’ve curated our React component based on the components that VKUI PROVIDES. The full code can be found in the source files at the link below .

:::