Skip to content

nevinharold90/FMV-ReactNative

Repository files navigation

📱 React Native Project Documentation

This project is built using React Native and the Expo framework. Below are detailed instructions to set up, run, and understand the project.


🚀 Project Setup

✅ Prerequisites

Make sure you have the following installed:

  • Node.js (v16 or later)
  • npm or yarn
  • Expo CLI

Install Expo CLI globally:

npm install -g expo-cli

📦 Installation

  1. Clone the repository:
git clone <repository-url>
cd <repository-folder>
  1. Install dependencies:
npm install

🧪 Available Scripts

  • Start Expo Dev Server:

    npm start
  • Run on Android:

    npm run android
  • Run on iOS (Mac only):

    npm run ios
  • Run on Web:

    npm run web

🗂️ Project Structure

.
├── src/                     # Main application source code
├── node_modules/            # Installed dependencies
├── .expo/                   # Expo project configuration
├── .gitignore               # Files to ignore in Git
├── App.tsx                  # Main entry point for the app
├── app.json                 # Application configuration
├── package.json             # Project metadata and scripts
├── tsconfig.json            # TypeScript configuration
└── tailwind.config.js       # TailwindCSS configuration

📚 Dependencies

Runtime

  • @expo-google-fonts/poppins
  • @react-native-async-storage/async-storage
  • @react-native-masked-view/masked-view
  • @react-navigation/drawer
  • @react-navigation/native
  • @react-navigation/stack
  • axios
  • expo
  • expo-app-loading
  • expo-font
  • expo-image-picker
  • expo-status-bar
  • expo-camera
  • nativewind
  • react (v18.3.1)
  • react-native (v0.76.3)
  • react-native-gesture-handler
  • react-native-image-picker
  • react-native-reanimated
  • react-native-safe-area-context
  • react-native-screens
  • react-native-vector-icons
  • tailwindcss

Development

  • @babel/core
  • @react-native-community/cli
  • @types/react
  • typescript

⚙️ Additional Configuration

💨 TailwindCSS with NativeWind

Tailwind-like styling is enabled using NativeWind.

  • tailwind.config.js
  • nativewind-env.d.ts

📺 Video Guide


🖼️ Image Picker

Image picker functionality is implemented using expo-image-picker.


🚚 Deployment

Use Expo CLI to build for each platform:

  • Android:

    expo build:android
  • iOS:

    expo build:ios
  • Web:

    expo build:web

📘 Refer to the Expo Documentation for more info.


🤝 Contributing

Feel free to submit issues or pull requests for improvements.


📝 License

This project is licensed under the MIT License.

About

This is FMV's Official React Native code with NativeWind as framework.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published