- react-native-ui-kitten is a framework that contains a set of commonly used UI components styled in a similar way.
- The main idea of this framework is to move style definitions into a specific place making components reusable and styled in a single way.
- Documentation for this framework is here.
- There is also a cool application built using our framework.
- We will be happy to work with you!
react-native-ui-kitten – 🐱 Customizable and reusable react-native component kit
Continue reading “What’s a react-native-ui-kitten?”
- React ComponentsIn this short post, I would like to describe how to structure react components.The main idea is to have a structure that helps to build highly maintainable and scalable software and makes it easy for developers to navigate and find files.Each component has its own directory and inside it, we put all related files.
- It will be also relatively easy to move components around or to create a separate package since all important code will be already packed up.Example componentsWe have to start with components directory which contains “global” components, used in different parts of an application.Above we can see Search / component, which is used in TopNavbar / and somewhere else in the app, that’s why both components are at the same main level.TopNavbar/ directory contains following files and directories:index.js – it contains only single line which exports TopNavbar default.
- /TopNavbar’;TopNavbar.jsx – main component structure (layout).
- Private components contain own tests, other private components, and styled-components.
- Stories for react-storybook are only created for the main component not for private ones.ConclusionAt first, this structure may look complex and overcomplicated.
The main idea is to have a structure that helps to build highly maintainable and scalable software and makes it easy for developers to navigate and find files. Each component has its own directory…
Continue reading “Structuring React Components – Kacper Goliński – Medium”