React Native UI components built by dooboolab
We love react-hooks and willing to share our react-native ui components built in functional components using hooks. Also the dooboo-ui
is built on top of our favorite stacks like styled-components, typescript, jest, react-testing-library, expo, storybook, and so on.
dooboo-ui
yarn pre
so that the packages are prepared.
yarn install-packages
.storybook
. Ensure to test in platforms we provide which are iOS
, android
and web
. Then it’s all good to go for pull request
. Give it a try 🌼.yarn watch
in order to build typescript files dynamically while implementing. This is currently the best solution to sync with your typescript code using package.json
. If you find something more efficient, please give a pull request.We aim to support react-native
ui components in all platforms and we are currently targeting iOS
, android
and web
. If you read issue on plan for unifying dooboo-ui, you can see in more detail how we want to drive this project.
package | version |
---|---|
react | >=16.13 |
react-native | >=0.62 |
styled-components | >=5.1.1 |
dooboo-ui
You can use most light weight components in
dooboo-ui
by importing it which are listed above. However, we also support individual imports using seperate installation which are more UI heavy. Those packages start with@dooboo-ui/*
like@dooboo-ui/gifted-chat
and is listed below.
dooboo-ui/*
Below elements are not included in
dooboo-ui
package since it depends on other packages that may overload its package.
You need to set webpack for using “dooboo-ui” in expo-web.
Install @expo/webpack-config in your expo’s project. yarn add @expo/webpack-config
or npm install @expo/webpack-config
Create webpack.config.js in root path and Add below code. See issue below for more details.
```javascript
const createExpoWebpackConfigAsync = require('@expo/webpack-config');
module.exports = async function(env, argv) {
const config = await createExpoWebpackConfigAsync(
{
...env,
babel: {
dangerouslyAddModulePathsToTranspile: [
'dooboo-ui',
],
},
},
argv
);
return config;
};
Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]
Author: dooboolab
Source Code: https://github.com/dooboolab/dooboo-ui
#react #react-native #mobile-apps