Get Started

Thanks for purchasing WashFleet CRM Application

Please read the documentation carefully, and if you have any questions, please feel free to contact us. Most pages are accompanied by a video tutorial, it's recommended to check both, the video and the written Documentation.

Must Read this:

After purchase, To get Download WashFleet CRM project Zip

it is suggested to setup the WashFleet CRM Project to following these steps:
  • Download the WashFleet CRM project Zip
  • To Extract the Zip
  • In these WashFleet CRM project Both folder frontend and Backend open in Vs-Code to run these project

Install Vs Code

To start these project,you need to Vs Code for your platform (Windows, macOS and Linux).

Visual Studio Code is a lightweight but powerful source code editor which runs on your desktop and is available for Windows, macOS and Linux. It comes with built-in support for JavaScript, TypeScript and Node.js and has a rich ecosystem of extensions for other languages and runtimes (such as C++, C#, Java, Python, PHP, Go, .NET). Begin your journey with VS Code

Install Node Js

In order to start configuration, you need to install Node js and NPM. First download the Node js and NPM from here Node and NPM

Install Next js on Window

First, you need to download the Windows Installer (.msi) file from the official Node.js website. This MSI installer database carries a collection of installer files essential to install, update, or modify the existing Node.js version.and more information visit onhttps://kinsta.com/blog/how-to-install-node-js/

Notably, the installer also carries the Node.js package manager (npm) within it. It means you don’t need to install the npm separately.

When downloading, select the correct version as per your operating system. For example, if you’re using a 64-bit operating system, download the 64-bit version, and if you’re using the 32-bit version, download the 32-bit version:

Once you open and run the .msi file, the installation process begins. But you have to set a few parameters before running the installation process. Double-click on the installer file and run it. The installer will ask you to accept the Node.js license agreement. To move forward, check the “I accept” box and click Next:

Then, select the destination where you want to install Node.js. If you don’t want to change the directory, go with the Windows default location and click the Next button again.

The next screen will show you custom setup options. If you want a standard installation with the Node.js default features, click the Next button. Otherwise, you can select your specific elements from the icons in the tree before clicking Next:

Node.js offers you options to install tools for native modules. If you’re interested in these, click the checkbox to mark your preferences, or click Next to move forward with the default:

Lastly — and this is the easiest part of all — click the Install button to begin the installation process:

So the installation process is completed. Now, you have to check whether Node.js is successfully installed or not.

  • To verify the installation and confirm whether the correct version was installed, open your PC’s command prompt and enter the following command:
    • Node --version
  • And to check the npm version, run this command:
    • npm --version

if the Node.js version and npm are correctly installed, you’ll see the version name in the CMD prompt.!

Install Next js on MacOS

As our first step, we need to actually get the official installer for Node.js on macOS. To do so, we can head over to the Node.js Downloads page to download the installer.and more information visit on https://kinsta.com/blog/how-to-install-node-js/

Follow these steps to get started:

You can get the macOS installer by clicking the Macintosh Installer option - this will download the .pkg installer for Node.js. Make sure you save it somewhere that you'll be able to access it!

Now that you've got the installer downloaded, you'll need to run it. The installer is a pretty typical interface - it won't take long to get through it (under a minute), even though there are a few parts to it. You can get through it by following the guide below:

  • Introduction
    • Select Continue
  • License
    • Select Continue
    • Select Agree
  • Installation Type
    • Select Install
    • Authenticate with your Mac to allow the Installation
    • Select Install Software
  • Summary
    • Select Close

To verify that Node.js was installed correctly on your Mac, you can run the following command in your terminal:.

  • node -v

Update Your npm Version

  • $ sudo npm install npm --global

Start building with Node.js!

Install Next js on Linux

The Linux operating system works a bit differently than the other traditional operating systems. That’s because Linux is open-source, offering you more freedom, customization, and advanced functionalities. https://kinsta.com/blog/how-to-install-node-js/

If you’re casual with commands, you should feel comfortable with Linux. Here, we are about to discuss the easiest method of installing Node.js on the Linux operating system.

The Linux operating system has hundreds of different distributions because of the diversity it provides. And users love to customize and harness different versions’ specific functionalities using distinct distributions.

Firstly, find the installation instruction for your specific distribution from Node.js’s Binary Distributions page. For this guide, we’ll be using Ubuntu for illustration purposes.

  • Install Curl Command Line Tool
    • Before going for Node.js installation, ensure that you have the curl command-line utility installed on your system. If not, then paste this command on your terminal to install curl:
    • sudo apt install curl
  • It may ask for your system password to verify the permission of the installation. Once you input the password, the system should begin the curl installation.
    • Password for codebind:

You need to copy and paste the Node.js installation command into your terminal (in our case, we can grab it from the Ubuntu distribution page) so that the system can begin the Node.js installation.

For instance, here, we’ll be installing Node.js v14.x. These are the installation commands for Ubuntu:

  • Install Curl Command Line Tool
    • curl -fsSL https://deb.nodesource.com/setup_14.x | sudo -E bash -
    • sudo apt-get install -y nodejs

As you already have the curl command line installed on your terminal, you’ll need to copy and paste the first command (the curl command) on your terminal and run it.

These commands should display the version numbers for Node.js and npm, respectively.

The curl command begins the Node.js installation process, updates your system, and downloads all Node.js libraries required to install Node.js on your Linux OS.

  • Copy and paste the second line of command from the installation instructions above into your Linux terminal:
    • sudo apt-get install -y nodejs

As you’ve installed Node.js, you can verify to check whether the installation is successful or not. To confirm the installation, you need to run two simple Linux commands on your Linux terminal.

  • To check the Node.js version, type:
    • Node --version
    • npm --version

Install React Js

In order to start configuration, you need to install Node js and NPM. First download the Node js and NPM from here Node and NPM

Install React js on Windows

In this section, we’ll guide you through the process of installing React on a Windows machine.

To publish and install packages to and from the public npm registry or a private npm registry, you must install Node.js and the npm command line interface using either a Node version manager or a Node installer. We strongly recommend using a Node version manager like nvm to install Node.js and npm. We do not recommend using a Node installer, since the Node installation process installs npm in a directory with local permissions and can cause permissions errors when you run npm packages globally.

Follow these steps to get started:

Before installing npm, you need to have Node.js installed on your system.

After the installation is complete, you can verify that Node.js and npm are installed by opening a command prompt and running the following commands:

  • node -v
  • npm -v

These commands should display the version numbers for Node.js and npm, respectively.

  • To download the latest version of npm, on the command line, run the following command:
    • npm i or npm install

Install React js on macOS

In this section, we’ll guide you through the process of installing React on a macOS machine.

As with the Windows installation process, you need to have Node.js and npm (Node Package Manager) installed on your macOS system as well. If you haven’t already installed them, follow these steps

Visit the Node.js download page

  • Visit the Node.js download page
  • Download the macOS installer

Once downloaded, click the .pkg file in your Downloads folder to run the installer

Follow the instructions that appear on your screen, including accepting the License Agreement, selecting the target destination for the installed files, and selecting the installation type.

After the installation is complete, you can verify that Node.js and npm are installed by opening a terminal and running the following commands:

After the installation is complete, you can verify that Node.js and npm are installed by opening a command prompt and running the following commands:

  • node -v
  • npm -v

These commands should display the version numbers for Node.js and npm, respectively

Alternatively, you can install Node.js and npm via the command line. To do this, open Terminal then input:

  • brew install node

Wait for the installation to complete then verify its installation in the same way as above, by entering:

  • node -v
  • npm -v

These commands should display the version numbers for Node.js and npm, respectively.

  • To download the latest version of npm, on the command line, run the following command:
    • npm i or npm install

Install React js on Linux

In this section, we’ll guide you through the process of installing React on a Linux machine.

Follow these steps to get started:

If you have a Linux-based system, you’ll want to follow this set of steps to install React:

  • sudo apt install npm

After the installation is complete, you can verify that Node.js and npm are installed by opening a command prompt and running the following commands:

  • npm --version
  • node --version

These commands should display the version numbers for Node.js and npm, respectively.

  • To download the latest version of npm, on the command line, run the following command:
    • npm i or npm install

Install Mongodb

MongoDB is an open-source document database that provides high performance, high availability, and automatic scaling.

Download Compass
https://www.mongodb.com/docs/compass/current/install/#download-compass

  • Open the Download page.
  • Select the installer you prefer. The MongoDB Compass installer is available as a .exe or .msi package or a .zip archive..
  • Download the latest version of MongoDB Compass for Windows.

Install Mongodb on Windows

Compass requires:
  • 64-bit version of Microsoft Windows 10 or later.
  • MongoDB 4.2 or later.
  • The Compass installer prompts you to install the minimum required version of the .NET framework if it is not already installed on your system.
  • Starting the installation as an administrator if you are running a silent installation using Microsoft PowerShell or installing on Azure Virtual Desktop Infrastructure (VDI).

Install Compass:

  • Double-click the installer file
  • Once installed, Compass launches and prompts you to configure privacy settings and specify update preferences

Create a MongoDB Atlas cluster

you will need a MongoDB database instance. If you don’t have one at hand, you can create a free cluster in MongoDB Atlas. Follow these steps to create and connect to a cluster:

  • Create an Atlas account
  • Add your connection IP address to your IP access list
  • Create a database user for your cluster
  • Connect to your cluster
Connect to Your Cluster
  • Now that we have a cluster, we can connect to it. It’s considered a good practice to keep your connection string and credentials separate from your code. You can do that by creating a configuration file that’s not checked into revision history. Create a “.env” file at the root of your project and add your cluster connection string as a variable:
    • DB_URI=mongodb+srv://:@.mongodb.net/

Next, create a new directory “src” in your project and a new “.env” file in it. To do that, you can run you project :

Then, we need to use the variables from the “.env” file into process.env. Once we’ve done that, we can log the connection URI to make sure the configuration is loaded correctly.

Install Mongodb on MacOs

Compass requires:
  • 64-bit version of macOS 10.12 or later..
  • MongoDB 4.2 or late.
  • Starting the installation as an administrator if you are running a silent installation using Microsoft PowerShell or installing on Azure Virtual Desktop Infrastructure (VDI).

Download the latest version of MongoDB Compass for macOS. The MongoDB Compass installer is a .dmg disk image.

Install Compass:

  • Once you have downloaded Compass, double-click on the .dmg file to open the disk image within the macOS Finder
  • Drag the MongoDB Compass application to your Applications folder.
  • Eject the disk image..
  • From the Applications folder, double-click on the Compass icon to start the application.
  • When you open MongoDB Compass for the first time, you may receive a notice stating that it is an application downloaded from the internet, requiring you to confirm you want to open it. Click Open to continue and launch Compass.

Create a MongoDB Atlas cluster

you will need a MongoDB database instance. If you don’t have one at hand, you can create a free cluster in MongoDB Atlas. Follow these steps to create and connect to a cluster:

  • Create an Atlas account
  • Add your connection IP address to your IP access list
  • Create a database user for your cluster
  • Connect to your cluster
Connect to Your Cluster
  • Now that we have a cluster, we can connect to it. It’s considered a good practice to keep your connection string and credentials separate from your code. You can do that by creating a configuration file that’s not checked into revision history. Create a “.env” file at the root of your project and add your cluster connection string as a variable:
    • DB_URI=mongodb+srv://:@.mongodb.net/

Next, create a new directory “src” in your project and a new “.env” file in it. To do that, you can run you project :

Then, we need to use the variables from the “.env” file into process.env. Once we’ve done that, we can log the connection URI to make sure the configuration is loaded correctly.

Install Mongodb on Linux

Compass requires:
  • 64-bit version of Ubuntu 14.04 or later..
  • MongoDB 4.2 or late.
  • To download and install MongoDB Compass, select your operating system:

Select the appropriate tab based on your Linux distribution and desired package from the tabs below:.

  • To install the .deb package on Ubuntu and Debian, click the .deb tab.
  • To install the .rpm package on RHEL, click the .rpm tab.
  • Download MongoDB Compass:
    • wget https://downloads.mongodb.com/compass/mongodb-compass_1.40.4_amd64.deb
  • Start MongoDB Compass:
    • mongodb-compass
  • Download MongoDB Compass:
    • wget https://downloads.mongodb.com/compass/mongodb-compass_1.40.4_amd64.deb

Install Compass:

  • Once you have downloaded Compass, double-click on the .dmg file to open the disk image within the macOS Finder.
  • Drag the MongoDB Compass application to your Applications folder.
  • Eject the disk image..
  • From the Applications folder, double-click on the Compass icon to start the application.
  • When you open MongoDB Compass for the first time, you may receive a notice stating that it is an application downloaded from the internet, requiring you to confirm you want to open it. Click Open to continue and launch Compass.

Create a MongoDB Atlas cluster

you will need a MongoDB database instance. If you don’t have one at hand, you can create a free cluster in MongoDB Atlas. Follow these steps to create and connect to a cluster:

  • Create an Atlas account
  • Add your connection IP address to your IP access list
  • Create a database user for your cluster
  • Connect to your cluster
Connect to Your Cluster
  • Now that we have a cluster, we can connect to it. It’s considered a good practice to keep your connection string and credentials separate from your code. You can do that by creating a configuration file that’s not checked into revision history. Create a “.env” file at the root of your project and add your cluster connection string as a variable:
    • DB_URI=mongodb+srv://:@.mongodb.net/

Next, create a new directory “src” in your project and a new “.env” file in it. To do that, you can run you project :

Then, we need to use the variables from the “.env” file into process.env. Once we’ve done that, we can log the connection URI to make sure the configuration is loaded correctly.

Start-project

In Vs-Code both frontend and backend project folder will be open in new tab and both terminal will be open for run commands

Front-End

Once the project is setup, head over to the project directory by running the following command in the command prompt:

  • npm start

This command launches the development server, which watches for changes to your project files and automatically reloads the browser when changes are detected.

A new browser window should open with your React application running at http://localhost:3000/ that looks like this:

Above illustration demonstrates the process to start the project of Frontend.

Congratulations! You have successfully run React project on your machine. You can now begin building your user interfaces with React.

Back-End

Once the project is setup, head over to the project directory by running the following command in the command prompt:

  • npm run dev

In terminal backend code running on port at http://localhost:8080/ that looks like this:

Above illustration demonstrates the process to start the project of Backend.

DashBoard View

After the successfully login,then redirect Dashboard Ui

Above illustration demonstrates the project of dashboard Ui.

Change App Title Name

Above illustration demonstrates the process to change the name of application.

Change App Menu

if you want to change name of menu go to title option and change the title on particular screen

Above illustration demonstrates the process to change the Menu of application.

Change App Routing

if you want to change url of routing go to path option and change the path of routing on particular screen

Above illustration demonstrates the process to change the Routing of application.

Install React Native

In order to start configuration of React-Native, you need to have high system configuration which requires minimum 8gb RAM and 1TB Storage or 256 SSD.

To run the WashFleet you need to configure React Native version 0.72.5. You can check the official React Native Documentation also to confgiure React Native version 0.72.5. React Native

Install React Native on Windows

In this section, we’ll guide you through the process of installing React Native on a Windows machine.

To publish and install packages to and from the public npm registry or a private npm registry, you must install Node.js and the npm command line interface using either a Node version manager or a Node installer. We strongly recommend using a Node version manager like nvm to install Node.js and npm. We do not recommend using a Node installer, since the Node installation process installs npm in a directory with local permissions and can cause permissions errors when you run npm packages globally.

Follow these steps to get started:

Before installing npm, you need to have Node.js installed on your system.

After the installation is complete, you can verify that Node.js and npm are installed by opening a command prompt and running the following commands:

  • node -v
  • npm -v

These commands should display the version numbers for Node.js and npm, respectively.

In the WashFleet we are using Node version v20.5.1

  • To download the latest version of npm, on the command line, run the following command:
    • npm i or npm install

React Native

Now, You will need Node, the React Native command line interface, a JDK, and Android Studio & It is recommended to use an LTS version of Node.

While you can use any editor of your choice to develop your app, you will need to install Android Studio in order to set up the necessary tooling to build your React Native app for Android.

Node, JDK

We recommend installing Node via Chocolatey, a popular package manager for Windows.

React Native also requires Java SE Development Kit (JDK), which can be installed using Chocolatey as well.

For the Medical App you need to install JDK version 11

Now, To install node lts and JDK 11 you can run the follow below steps as well :

Open an Administrator Command Prompt (go to the global search of your machine and search command prompt then right click to Command Prompt and select "Run as Administrator"), then run the following command:

choco install -y nodejs-lts microsoft-openjdk11

Android development environment

Setting up your development environment can be somewhat tedious if you're new to Android development. If you're already familiar with Android development, there are a few things you may need to configure. In either case, please make sure to carefully follow the next few steps.

1. Install Android Studio

Download and install Android Studio.While on Android Studio installation wizard, make sure the boxes next to all of the following items are checked:

  • Android SDK
  • Android SDK Platform
  • Android Virtual Device

Then, click "Next" to install all of these components.

Once setup has finalized and you're presented with the Welcome screen, proceed to the next step.

2. Install the Android SDK

Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the Android 13 (Tiramisu) SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio.

To do that, open Android Studio, click on "More Actions" button and select "SDK Manager".

The SDK Manager you can found within the Android Studio. Right click on More Actions options and choose SDK Manager option to reach on SDK Manager Screen.

Select the "SDK Platforms" tab from within the SDK Manager, then check the box next to "Show Package Details" in the bottom right corner. Look for and expand the Android 13 (Tiramisu) entry, then make sure the following items are checked:

  • Android SDK Platform 33
  • Intel x86 Atom_64 System Image or Google APIs Intel x86 Atom System Image

Next, select the "SDK Tools" tab and check the box next to "Show Package Details" here as well. Look for and expand the Android SDK Build-Tools entry, then make sure that 33.0.0 is selected.

Finally, click "Apply" to download and install the Android SDK and related build tools.

3. Configure the ANDROID_HOME environment variable

The React Native tools require some environment variables to be set up in order to build apps with native code.

  • Open the Windows Control Panel.
  • Click on User Accounts, then click User Accounts again
  • Click on Change my environment variables
  • Click on New... to create a new ANDROID_HOME user variable that points to the path to your Android SDK:

The SDK is installed, by default, at the following location:

%LOCALAPPDATA%\Android\Sdk

You can find the actual location of the SDK in the Android Studio "Settings" dialog, under Languages & Frameworks → Android SDK.

Open a new Command Prompt window to ensure the new environment variable is loaded before proceeding to the next step.

  • Open powershell.
  • Copy and paste Get-ChildItem -Path Env:\ into powershell
  • Verify ANDROID_HOME has been added
4. Add platform-tools to Path
  • Open the Windows Control Panel.
  • Click on User Accounts, then click User Accounts again
  • Click on Change my environment variables
  • Select the Path variable.
  • Click Edit.
  • Click New and add the path to platform-tools to the list.

The default location for this folder is:

%LOCALAPPDATA%\Android\Sdk\platform-tools

React Native setup on windows machine Video Tutorial

You can also watch the video given below to setup react native environment on your windows machine:

Install React Native on macOS

In this section, we’ll guide you through the process of React Native configuration on a macOS machine.

As with the Windows installation process, you need to have Node.js and npm (Node Package Manager) installed on your macOS system as well. If you haven’t already installed them, follow these steps

Visit the Node.js download page

  • Visit the Node.js download page
  • Download the macOS installer

Once downloaded, click the .pkg file in your Downloads folder to run the installer

Follow the instructions that appear on your screen, including accepting the License Agreement, selecting the target destination for the installed files, and selecting the installation type.

After the installation is complete, you can verify that Node.js and npm are installed by opening a terminal and running the following commands:

After the installation is complete, you can verify that Node.js and npm are installed by opening a command prompt and running the following commands:

  • node -v
  • npm -v

These commands should display the version numbers for Node.js and npm, respectively

Alternatively, you can install Node.js and npm via the command line. To do this, open Terminal then input:

  • brew install node

Wait for the installation to complete then verify its installation in the same way as above, by entering:

  • node -v
  • npm -v

These commands should display the version numbers for Node.js and npm, respectively.

  • To download the latest version of npm, on the command line, run the following command:
    • npm i or npm install

React Native on MacOS

You will need Node, Watchman, the React Native command line interface, a JDK, and Android Studio.

While you can use any editor of your choice to develop your app, you will need to install Android Studio in order to set up the necessary tooling to build your React Native app for Android.

Node & Watchman

We recommend installing Node and Watchman usingHomebrew.Run the following commands in a Terminal after installing Homebrew:

brew install node

brew install watchman

If you have already installed Node on your system, make sure it is Node 16 or newer.

Watchmanis a tool by Facebook for watching changes in the filesystem. It is highly recommended you install it for better performance.

Java Development Kit

We recommend installing the OpenJDK distribution called Azul Zulu usingHomebrew. Run the following commands in a Terminal after installing Homebrew:

  • brew tap homebrew/cask-versions
  • brew install --cask zulu11
  • brew info --cask zulu11

After you install the JDK, update your JAVA_HOME environment variable. If you used above steps, JDK will likely be at /Library/Java/JavaVirtualMachines/zulu-11.jdk/Contents/Home

The Zulu OpenJDK distribution offers JDKs for both Intel and M1 Macs. This will make sure your builds are faster on M1 Macs compared to using an Intel-based JDK.

If you have already installed JDK on your system, we recommend JDK 11. You may encounter problems using higher JDK versions.

Android development environment

Setting up your development environment can be somewhat tedious if you're new to Android development. If you're already familiar with Android development, there are a few things you may need to configure. In either case, please make sure to carefully follow the next few steps.

1. Install Android Studio

Download and install Android Studio. While on Android Studio installation wizard, make sure the boxes next to all of the following items are checked:

  • Android SDK
  • Android SDK Platform
  • Android Virtual Device

Then, click "Next" to install all of these components.

Once setup has finalized and you're presented with the Welcome screen, proceed to the next step.

2. Install the Android SDK

Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the Android 13 (Tiramisu) SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio.

To do that, open Android Studio, click on "More Actions" button and select "SDK Manager".

The SDK Manager you can found within the Android Studio. Right click on More Actions options and choose SDK Manager option to reach on SDK Manager Screen.

Select the "SDK Platforms" tab from within the SDK Manager, then check the box next to "Show Package Details" in the bottom right corner. Look for and expand the Android 13 (Tiramisu) entry, then make sure the following items are checked:

  • Android SDK Platform 33
  • Intel x86 Atom_64 System Image or Google APIs Intel x86 Atom System Image or (for Apple M1 Silicon) Google APIs ARM 64 v8a System Image

Next, select the "SDK Tools" tab and check the box next to "Show Package Details" here as well. Look for and expand the Android SDK Build-Tools entry, then make sure that 33.0.0 is selected.

Finally, click "Apply" to download and install the Android SDK and related build tools.

3. Configure the ANDROID_HOME environment variable

The React Native tools require some environment variables to be set up in order to build apps with native code.

To set ANDROID_HOME environment variale run the following command in command prompt~/.zprofile or ~/.zshrc (if you are using bash, then ~/.bash_profile or ~/.bashrc) config file:

Add the lines given below to ~/.zprofile or ~/.zshrc (if you are using bash, then ~/.bash_profile or ~/.bashrc)

  • export ANDROID_HOME=$HOME/Library/Android/sdk
  • export PATH=$PATH:$ANDROID_HOME/emulator
  • export PATH=$PATH:$ANDROID_HOME/platform-tools

Now, Run source ~/.zprofile (or source ~/.bash_profile for bash) to load the config into your current shell. Verify that ANDROID_HOME has been set by running echo $ANDROID_HOME and the appropriate directories have been added to your path by running echo $PATH.

Please make sure you use the correct Android SDK path. You can find the actual location of the SDK in the Android Studio "Settings" dialog, under Languages & Frameworks → Android SDK.

React Native setup on macOS machine Video Tutorial

You can also watch the video given below to setup react native environment on your macOS machine:

Install React Native on Linux

In this section, we’ll guide you through the process of React Native configuration on a Linux machine.

Follow these steps to get started:

If you have a Linux-based system, you’ll want to follow this set of steps to install React Native:

  • sudo apt install npm

After the installation is complete, you can verify that Node.js and npm are installed by opening a command prompt and running the following commands:

  • npm --version
  • node --version

These commands should display the version numbers for Node.js and npm, respectively.

  • To download the latest version of npm, on the command line, run the following command:
    • npm i or npm install

React Native on Linux

You will need Node, Watchman, the React Native command line interface, a JDK, and Android Studio.

While you can use any editor of your choice to develop your app, you will need to install Android Studio in order to set up the necessary tooling to build your React Native app for Android.

Node

Follow theinstallation instructions for your Linux distributionto install Node 16 or newer.

Java Development Kit

React Native currently recommends version 11 of the Java SE Development Kit (JDK). You may encounter problems using higher JDK versions. You may download and installOpenJDKfrom AdoptOpenJDK or your system packager.

Android development environment

Setting up your development environment can be somewhat tedious if you're new to Android development. If you're already familiar with Android development, there are a few things you may need to configure. In either case, please make sure to carefully follow the next few steps.

1. Install Android Studio

Download and install Android Studio. While on Android Studio installation wizard, make sure the boxes next to all of the following items are checked:

  • Android SDK
  • Android SDK Platform
  • Android Virtual Device

Then, click "Next" to install all of these components.

Once setup has finalized and you're presented with the Welcome screen, proceed to the next step.

2. Install the Android SDK

Android Studio installs the latest Android SDK by default. Building a React Native app with native code, however, requires the Android 13 (Tiramisu) SDK in particular. Additional Android SDKs can be installed through the SDK Manager in Android Studio.

To do that, open Android Studio, click on "More Actions" button and select "SDK Manager".

The SDK Manager can also be found within the Android Studio "Settings" dialog, under Languages & Frameworks → Android SDK.

Select the "SDK Platforms" tab from within the SDK Manager, then check the box next to "Show Package Details" in the bottom right corner. Look for and expand the Android 13 (Tiramisu) entry, then make sure the following items are checked:

  • Android SDK Platform 33
  • Intel x86 Atom_64 System Image or Google APIs Intel x86 Atom System Image

Next, select the "SDK Tools" tab and check the box next to "Show Package Details" here as well. Look for and expand the Android SDK Build-Tools entry, then make sure that 33.0.0 is selected.

Finally, click "Apply" to download and install the Android SDK and related build tools.

3. Configure the ANDROID_HOME environment variable

The React Native tools require some environment variables to be set up in order to build apps with native code.

Add the following lines to your $HOME/.bash_profile or $HOME/.bashrc (if you are using zsh then ~/.zprofile or ~/.zshrc) config file:

  • export ANDROID_HOME=$HOME/Android/Sdk
  • export PATH=$PATH:$ANDROID_HOME/emulator
  • export PATH=$PATH:$ANDROID_HOME/platform-tools

.bash_profile is specific to bash. If you're using another shell, you will need to edit the appropriate shell-specific config file.

Type source $HOME/.bash_profile for bash or source $HOME/.zprofile to load the config into your current shell. Verify that ANDROID_HOME has been set by running echo $ANDROID_HOME and the appropriate directories have been added to your path by running echo $PATH.

Please make sure you use the correct Android SDK path. You can find the actual location of the SDK in the Android Studio "Settings" dialog, under Languages & Frameworks → Android SDK.

Watchman

Follow theWatchman installation guide to compile and install Watchman from source.

Watchmanis a tool by Facebook for watching changes in the filesystem. It is highly recommended you install it for better performance and increased compatibility in certain edge cases (translation: you may be able to get by without installing this, but your mileage may vary; installing this now may save you from a headache later).

React Native setup on Linux machine Video Tutorial

You can also watch the video given below to setup react native environment on your Linux machine:

Start- React-Native project

Now if you complete the above steps & successfully added path variable then download the zip file of the WashFleet. To run the WashFleet you need to follow steps below :

  • Open the WashFleet project folder into VSCode
  • Go to the Project folder by cd "CURRENT_FOLDER"
  • Run npm install to install dependency.
  • To install dependency for IOS you need to do "cd ios" then run "pod install" after successfully install dependencies you can go back to the project folder by "cd .." command.
  • For the Androidrun : npx react-native run-android
  • For the IOS run : npx react-native run-ios

Login Page View

After successfully run the application, it will start into the emulator which you have selected.


Above illustration demonstrates the login page in IOS and Android of the WashFleet.

Congratulations! You have successfully run WashFleet on your machine.

Now you can use the application or if you want to change or build new user interfaces of WashFleet with React Native you can make changes into the code that will show you into the app.

Dashboard Page View

Above illustration demonstrates the Home Page of the WashFleet in IOS and ANDROID.

Install React Native Dependencies

Install all React Native dependencies from reference these video:

Error

  • Input Errors:
    • Information provided by the user is unacceptable for some reason. This includes errors from form validation, duplicate actions, uniqueness issues, resources not found, etc.
  • Authorization Errors:
    • A user is attempting to perform an action to which he/she does not have permission
  • Availability Errors
    • A resource that is needed to complete the user's action is unavailable for some reason. This may be expected (scheduled maintenance) or unexpected (server crash!).
  • Unexpected Errors:
    • These are errors that likely indicate a bug in the application, such as unhandled exceptions.

And More information go to the WashFleet README.md file and Read more information to these projects