DEV Community

Cover image for React Native Template Strong
Sergei Butko
Sergei Butko

Posted on

React Native Template Strong

Idea

The primary idea is to have everything set up for quick start with components, modules and other stuff which many templates can't offer.

Core

The core of this template is build around next dependencies:

Documentation

One of the main differences between this and any other template is that it offers a documentation to each of its component, helper, module, etc.

Structure

It offers more than just a simple template project it offers a guidance towards project, module, component creation.

From the component to publishing an app, it covers each aspect of development.

Performance

From the beginning it includes Hermes on both platforms, proguard is enabled, consoles are being removed and many other enhancements are used to provide the best performance.

Native-look-alike focus

By using React Native Navigation and providing SF Symbols usage on iOS and Material Icons on Android this template strives to make apps look as native ones as possible.

Native colors usage are also welcomed in this template and bring many useful helpers.

Components

Set of created common components like buttons, text inputs, radio buttons, date and image pickers, permissions, toasts and more.

Different helpers to help in your day-to-day cases.

Hooks which are found useful throughout the development process.

Localization

Localization is provided by react-native-localization helps to keep all the strings in one place and maintain correct usage when adding new languages.

Tests

Jest is used to test functions, methods and show test coverage of your project.

End-to-End coverage provided by Detox will make it easier to test each scenario on emulators or real devices.

Storybook can help to see what each component is capable of and show its properties and different edge cases. Or even contain whole screens.

So it brings best of both TDD (Test Driven Development) and CDD (Component Driven Development).

Code quality

ESLint with strict set of rules and plugins provided by eslint-config-strong.

Additionally there are Prettier and TSConfig rules which will make it hard to create messy code.

To prevent commits with errors Husky together with lint-staged won't allow them to pass.

Environments

React Native Config bring you the ability, for example, to have different environments which will make it easier to work with different API endpoints and test your application.


If you think that this template lacks something or would like to add something, feel free to do so by creating issues or participate in discussions.

There are still many things which I'd like to add, check the roadmap and issues to see where it's heading.

This and many more other things you can find in repository's documentation.

I hope you will find it useful and you will use it in your next project! 🎉🏆🎉

GitHub logo svbutko / react-native-template-strong

Quick, opinionated, documented and strong beginning for your next project. Template made with react-native-navigation, TypeScript and Redux.

Top comments (0)