0.0.1 • Published 2 years ago

@bukan-warung-pintar/renceng-native v0.0.1

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

renceng-native

renceng-native is an implementation of Renceng Design Language System for react-native apps.

Structure

/src         # source package
/dist        # build package
/example     # example/storybook react-native package
  .ondevice  # react-native storybook
  .storybook # web storybook

How to run

With script

You can run all the required step with one command

$ ./first-setup.sh

or

With Manual Step

Install & build main package

$ yarn install && yarn build

Install yalc

renceng-native use yalc to manage local dependency

$ yarn global add yalc

or

$ npm i yalc -g

Publish local build

$ yarn publish:local

Install renceng-native with local dependency

$ cd example && yarn add:local

Install storybook

$ yarn install

Run web storybook

$ yarn storybook

Run react-native storybook

Make sure to run emulator first

$ yarn android

For linux

Make sure to run metro server

$ yarn start --reset-cache

How to develop new component

Go to root package (renceng-native/here)

Create new component under

/src/components

Build package with

$ yarn build

or you can use this to build package everytime a change occurs

$ yarn start

Publish local build

$ yarn publish:local
# or you can use
$ ./update-local.sh

To test out new component, go to example apps

$ cd example

Update renceng-native

Example apps is using local dependency for renceng-native, hence this script is needed everytime you want to try out new renceng-native build

$ yarn fetch:local
# or you can use
$ ./update-local.sh

How to contribute

Create new branch from master using

feat/branch-name for feature branch
fix/branch-name for fix branch
chore/branch-name for chore branch

Develop using above guidelines

Create pull request to master

Create new issue in Issues if you find any issue/bug

Roadmap

  • Base package
  • Storybook react-native
  • Storybook web
  • View component
  • Text component
  • Button component
  • Image component
  • Icon component
  • Divider
  • ...
  • Publish to npm
  • Deploy storybook web