The main function of this template is to meet the requirements of modern applications in terms of scalability and maintainability over time. That is why it was implemented with the concept of clean architecture (Onion architecture).

Overview

How to start use?

npx react-native init AwesomeApp --template https://github.com/CrisangerA/react-native-template-clean-arch.git

Why this template? What needs does it solve?

The main function of this template is to meet the requirements of modern applications in terms of scalability and maintainability over time. That is why it was implemented with the concept of clean architecture (Onion architecture).

The main motivation for this template is to use as many native features as possible for the requirements of modern applications such as scalability and maintainability over time. The reason for using native platform features is because they offer better performance than features that run on the JS thread.

Among other things the project includes this plugin https://www.npmjs.com/package/eslint-plugin-hexagonal-architecture that will help you to build the rest of your application with the onion architecture concept https://blog.cleancoder.com/uncle-bob/2012/08/13/the-clean-architecture.html.

Configuration

Global configuration of styles, api routes, navigation and dependency injection are located in src/config.

  • Navigation
    • Define type of root navigation
    • If you created a new screen describe it here. Only Screens not Modals
  • Style
    • Colors
    • Font Sizes
    • Spacings

Strucure folders

Folders (1)

Extra

Features

Verify the versions in the package.json

Implemented software principles

  • Single responsibility
  • Liskov substitution
  • Interface segregation
  • Dependency inversion
  • Pattern repository

Screenshots - Uplabs design

MacBook Pro 16_ - 1

Troubleshoot

You might also like...
A facial emotion detection concept using React JS & the face-api.js
A facial emotion detection concept using React JS & the face-api.js

APADS Real Time emotion detection Explore the project » View Demo · Report Bug ·

A full-stack web app built with NestJS and ReactJS that helps you find and discover over 500,000+ video games on your device. Powered by RAWG API.
A full-stack web app built with NestJS and ReactJS that helps you find and discover over 500,000+ video games on your device. Powered by RAWG API.

Game Store Monorepo A full-stack web app built with NestJS and ReactJS that helps you find and discover over 500,000+ video games on your device. Powe

CABINDOGS - Discover cabins for rent all over the world. For you and your furry friend.
CABINDOGS - Discover cabins for rent all over the world. For you and your furry friend.

CABINDOGS Cabin Rentals for you and your furry friends too What is a getaway from home when your best friend can't come and is left all alone? SAD! CA

Small demo standalone app letting users vote for a movie while results are synced over different clients with Microsoft's fluid Framework.
Small demo standalone app letting users vote for a movie while results are synced over different clients with Microsoft's fluid Framework.

Small demo standalone app letting users vote for a movie while results are synced over different clients with Microsoft's fluid Framework.

A portfolio built in React and NextJS. Simple, clean, and fast.
A portfolio built in React and NextJS. Simple, clean, and fast.

A portfolio built in React and NextJS. Simple, clean, and fast.

A simple project to display clean and concise Covid-19 Statistics by country. ⚛️ React.js ⚛️ React Query 💅 Tailwind CSS 🔎 Google Analytics
A simple project to display clean and concise Covid-19 Statistics by country. ⚛️ React.js ⚛️ React Query 💅 Tailwind CSS 🔎 Google Analytics

A simple project to display clean and concise Covid-19 Statistics by country. ⚛️ React.js ⚛️ React Query 💅 Tailwind CSS 🔎 Google Analytics

TrackIt - Single Page Application that helps the user track their habits. Implemented with JavaScript/React and an API server which enables the user to sign-in or sign-up in the app.
TrackIt - Single Page Application that helps the user track their habits. Implemented with JavaScript/React and an API server which enables the user to sign-in or sign-up in the app.

TrackIt - Single Page Application that helps the user track their habits. Implemented with JavaScript/React and an API server which enables the user to sign-in or sign-up in the app.

Bookstore - a project built with React redux, implemented with Ducks files structure and, React Router to interact between the different tabs of the project
Bookstore - a project built with React redux, implemented with Ducks files structure and, React Router to interact between the different tabs of the project

Bookstore is a project built with React redux, implemented with Ducks files structure and, React Router to interact between the different tabs of the project. You can manage information of a book interact with an API.

Slack-Clone is a clone of a slack. Implemented using React and Firebase

Slack clone using React, MaterialUI with google-authentication & firestore database for a real-time chat across multiple channels.

Owner
Cristian Alejandro
Software Developer. Fullstack | Backend | Frontend | Mobile | Developer
Cristian Alejandro
React + TypeScript app built using clean architecture principles

React + TypeScript app built using clean architecture principles

Alex 1.8k Dec 6, 2022
A valorant wiki where users can check informations and meet other players created with React

The aim of the project is to create a valorant wiki where users can check informations and meet other players (social section will be relased in the future). website created with React.

Matteo Leonesi 7 Jul 13, 2022
An app built with react and firebase and few other modules. It is tiktok but for movie trailers. that is why I called it tiktrailer

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

null 7 Mar 31, 2022
Swiggy Clone - Main Tech Stack used are React and for state management Redux and Local Storage

Solo Construct week project executed in 7 days. Main Tech Stack used are React and for state management Redux and Local Storage is been used , for persisting the data Local Storage is used, All the Data used are manually created.

Biswaranjan Subudhi 4 Jul 8, 2022
The NetflixClone project is about a reproduction as faithful as possible of the main page of Netflix

O projeto NetflixClone se trata de uma reprodução o mais fiel possível da página principal da Netflix, onde conseguimos rolar as barras de filmes de modo a mostrar todos os filmes localizados, temos interações com o mouse em toda a página.

Gustavo Lira 3 Nov 8, 2021
A library project built using React with the main objective of learning how to use Redux with React

A library project built using React with the main objective of learning how to use Redux with React

Andrés Felipe Arroyave Naranjo 6 Apr 28, 2022
An E-commerce site template, implemented with Next.js and TypeScript. Styled with TailwindCSS

An E-commerce site template, implemented with Next.js and TypeScript. Styled with TailwindCSS. This is one of my portfolios, but I would be pleased if these codes helped others, so I published it as an open-source project. feel free to explore it, and if you need help, ask me. I would respond as soon as possible.

zahra mirzaei 111 Nov 27, 2022
Bored Room - a web platform designed for people to play modern board games online with friends and strangers both asynchronously and in real time

Bored Room - a web platform designed for people to play modern board games online with friends and strangers both asynchronously and in real time

null 1 May 8, 2022
A teaching tool to introduce youth to the concept of investing and the benefits of long-term investment. (React, NodeJS, Express, PostgreSQL, Socket.io)

SmartMoney is an app that teachers can use to introduce students to the concept of investment and show them how it is a smart way to grow their money.

Kurtis Grant 2 Apr 4, 2022
🔥 FakeNuke is a simple proof-of-concept social network using React and Firestore.

FaceNuke ?? A proof-of-concept social networking platform written in React! Introduction This project was developed using React and Firebase (also imp

Liam Townsley 1 Apr 23, 2022