rn-lib-temp
v3.1.2
Published
A usable template for setting up a new React Native library. It's designed to reduce the hassle of configuration and help quickly start the project.
Downloads
220
Maintainers
Readme
📚 React Native Library Template
This repository is an optimized React Native library boilerplate, designed to boost your library development process.🧑💻🔧 It's tailored for both bare React Native applications and Expo-created ones. This boilerplate is equipped with valuable tools, simplifying library development and ensuring high-quality code.
🌟 Features
- Enforces code style with eslint, prettier, and TypeScript,
- Precommit hooks checking code style and type issues,
- GitHub Actions to aid in your development process,
- Automated library deployments to npm and hassle-free versioning thanks to semantic-release,
- Provides an example app for both bare React Native projects and Expo-managed ones,
jest
setup is also available with example tests
📋 Requirements
Node 18 or greater is required. Development for iOS needs a Mac and Xcode.
🚀 Quick Start
To create a fresh project, just run:
npx rn-lib-temp init <projectName>
Before starting development, go to the directory where you created the template project and install all necessary dependencies with yarn
:
yarn
For iOS only: Install required Pods for the bare React Native example app (example/fabric
or example/paper
):
yarn pod
💫 GitHub Actions
To use the GitHub Actions bundled with this boilerplate, you'll need to provide 2 secrets (refer to this page for more about secrets):
GH_TOKEN
- a GitHub token withrepo
permissions (check docs for more on GitHub access tokens).NPM_TOKEN
- an npm token employed by semantic-release for automatic library deployment (see docs for info on npm access tokens).
Alternatively, remove workflows from the .github
directory if you prefer not to use GitHub Actions.
🛠️ Library Development
🏗️ Project Structure
he repository uses the most common monorepo structure where the example
directory contains the example app and the packages
directory contains sources of the library itself, as well as, documentation and other packages (if necessary).
Library Source Files
By default, the resulting library will include files specified under the files
key in the packages/<your-library-name>/package.json
:
src
directory - where you write all library source code,dist
directory - generated by react-native-builder-bob during the build process,LICENSE
- you should include yourLICENSE
file because it's not provided by default,CHANGELOG.md
- a file containing all version history with included changes, automatically generated by the semantic-release library,README.md
- readme file from the repository root directory
Library Dependencies
Included in the library
- Usually for smaller dependencies or these which must point to the exact version,
- Should be listed under
dependencies
field in thepackages/<your-library-name>/package.json
Dependencies that must be installed by the user
- Usually large dependencies or these, which are commonly used by other packages (such as
react-native-reanimated
), - Should be listed under
peerDependencies
field in thepackages/<your-library-name>/package.json
, - Should be installed as
dependencies
of the example app (added to theexample/app/package.json
)
All dependencies should be installed with yarn
in order to ensure that yarn workspaces work properly.
📱 Example App
The example app is located in the example
directory. Inside, you'll find three subdirectories:
app
- Where the example app source code is locatedfabric
- Sources necessary to run the bare React Native app on Fabric (the New Architecture)paper
- Sources necessary to run the paper React Native app on Paper (the Old Architecture)expo
- Sources of the expo-managed app
If you don't need to include expo or fabric/paper React Native app example, you can just remove the corresponding directory.
Useful Commands
For launching the bare React Native example app:
yarn start|android|ios|pod
For the Expo React Native app:
yarn start|android|ios
start
- starts metro clientandroid
- starts example app on the Android emulator/device,ios
- starts example app on the iOS simulator/device,pod
- installs Pods required by example app native iOS dependencies.
🔄 Automatic deployments
The release.yaml
workflow included in the project contains the auto deployment logic. By default, the deployment will be caused on the workflow dispatch action (manually from the GitHub Actions page). You can change this behavior by modifying the workflow triggers.