React Native Boilerplate

Crafted with ❤️ by Mobix Software Studio for React Native applications.

Install

// clonning:
git@github.com:mobixsoftwarestudio/react-native-boilerplate.git

Dependencies

• React Navigation
• Axios
• Eslint
• React Query
• Typescript
• Jest
• Detox

Folders

assets

Contains all project`s global assets, such as images and videos.

components

Contains all global components that will be used throughout the application.

contexts

Contains all global contexts created with Context API.

hooks

Contains all global Hooks.

export const useUser = () => {
  const [name, setName] = useState<string>('');

  const onChangeName = (value: string) => {
    setName(value);
  };

  return {
    name,
    onChangeName,
  };
};

queries

Contains all global queries.

import { useQuery } from 'react-query';
import axios from 'axios';
import { RequestOptionsType } from '../../types';

type ExampleParams = {
  param1: any;
  param2: any;
};

type RequestParans = {
  param1: any;
  param2: any;
  requestOptions: RequestOptionsType;
};

type ResponseType = {};

const queryKey = 'example';

const fetchRequest = async ({
  param1,
  param2,
}: ExampleParams): Promise<ResponseType> => {
  return axios
    .get(`url.request/${param1},${param2}`)
    .then(response => response.data);
};

const useExample = ({
  param1,
  param2,
  requestOptions: { refetchOnWindowFocus, enabled },
}: RequestParans) => {
  return useQuery(
    [queryKey, { param1, param2 }],
    () => fetchRequest({ param1, param2 }),
    {
      refetchOnWindowFocus,
      enabled,
    },
  );
};

export { useExample, queryKey };

services

Contains all external services configurations, such as api base url and interceptors.

themes

Contains all theme configurations.

types

Contains all global types.

modules

Contains every functionally of the application divided by the following folders:

assets

Contains all the assets of this module.

components

Contains all the components of this module.

hooks

Contains all the hooks of this module.

queries

Contains all the queries of this module.

screens

Constains all the screens of this module.

It should also have the following files:

• routes.tsx: responsible for handling the module's routing.
• types.ts: responsible for storing the module's types.