Skip to content

React Native mobile app for business & employee management with task tracking, work schedules, and salary management. Built with TypeScript, Redux Toolkit, and React Query.

DanielSledz03/Managment-App

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

49 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

Management App πŸ“±

React Native TypeScript Redux Toolkit React Query

Professional mobile application for business management and employee oversight, built with React Native for cross-platform compatibility.

⚠️ Project Status: This project was developed between 2023-2024 but remains incomplete. Development work has been temporarily suspended.

🌟 Features

  • Cross-Platform: Native performance on both iOS and Android
  • Modern Architecture: Built with React Native 0.74.1 and TypeScript
  • State Management: Redux Toolkit for predictable state management
  • Authentication: JWT-based authentication with automatic token refresh
  • Task Management: Complete task tracking and management system
  • Work Schedule: Employee work schedule management
  • Salary Tracking: Salary and bonus management features
  • Offline Support: Network status monitoring and offline capabilities

πŸ› οΈ Tech Stack

  • Framework: React Native 0.74.1
  • Language: TypeScript 5.4.5
  • State Management: Redux Toolkit 2.2.3, React Redux 9.1.2
  • Data Fetching: TanStack React Query 5.34.2, Axios 1.6.8
  • Navigation: React Navigation 6.1.17, Bottom Tabs 6.5.20
  • Storage: AsyncStorage 1.23.1
  • Network: NetInfo 11.3.1
  • Authentication: JWT Decode 4.0.0
  • UI Components: React Native Vector Icons 10.1.0, Linear Gradient 2.8.3
  • Forms: React Native Picker Select 9.1.3
  • SVG Support: React Native SVG 15.2.0, SVG Transformer 1.3.0
  • Testing: Jest 29.7.0, React Test Renderer 18.3.1
  • Linting: ESLint 9.2.0 with React Native config
  • Formatting: Prettier 3.2.5

πŸ“ Project Structure

β”œβ”€β”€ src/                    # Source code
β”‚   β”œβ”€β”€ assets/            # Images, icons, and static assets
β”‚   β”‚   β”œβ”€β”€ BonusBox/      # Bonus display component
β”‚   β”‚   β”œβ”€β”€ Button/        # Custom button component
β”‚   β”‚   β”œβ”€β”€ CalendarDay/   # Calendar day component
β”‚   β”‚   β”œβ”€β”€ GradientText/  # Gradient text component
β”‚   β”‚   β”œβ”€β”€ InfoCard/      # Information card component
β”‚   β”‚   β”œβ”€β”€ Input/         # Custom input component
β”‚   β”‚   β”œβ”€β”€ Modal/         # Modal dialog component
β”‚   β”‚   β”œβ”€β”€ TabButton/     # Tab button component
β”‚   β”‚   └── TaskCard/      # Task display card
β”‚   β”œβ”€β”€ constants/         # Application constants
β”‚   β”œβ”€β”€ forms/             # Form components and validation
β”‚   β”‚   └── Login/         # Login form
β”‚   β”œβ”€β”€ hooks/             # Custom React hooks
β”‚   β”œβ”€β”€ navigation/        # Navigation configuration
β”‚   β”‚   └── TabBar/        # Custom tab bar component
β”‚   β”œβ”€β”€ screens/           # Application screens
β”‚   β”‚   β”œβ”€β”€ Account.tsx    # User account management
β”‚   β”‚   β”œβ”€β”€ ChangePassword.tsx # Password change screen
β”‚   β”‚   β”œβ”€β”€ Dashboard.tsx  # Main dashboard
β”‚   β”‚   β”œβ”€β”€ Salary.tsx     # Salary information
β”‚   β”‚   β”œβ”€β”€ SuccessChangedPassword.tsx # Success screen
β”‚   β”‚   β”œβ”€β”€ Tasks.tsx      # Task management
β”‚   β”‚   └── WorkSchedule.tsx # Work schedule
β”‚   β”œβ”€β”€ store/             # Redux store configuration
β”‚   β”‚   β”œβ”€β”€ Auth/          # Authentication state
β”‚   β”‚   β”œβ”€β”€ Modal/         # Modal state management
β”‚   β”‚   └── User/          # User data state
β”‚   β”œβ”€β”€ types/             # TypeScript type definitions
β”‚   β”œβ”€β”€ utils/             # Utility functions
β”‚   └── view/              # View components
β”œβ”€β”€ android/               # Android-specific configuration
β”œβ”€β”€ ios/                   # iOS-specific configuration
β”œβ”€β”€ __tests__/             # Test files
└── public/                # Public assets

πŸš€ Getting Started

Prerequisites

  • Node.js 18+
  • React Native CLI
  • Android Studio (for Android development)
  • Xcode (for iOS development, macOS only)
  • CocoaPods (for iOS dependencies)

Installation

  1. Clone the repository

    git clone https://github.com/DanielSledz03/Managment-App.git
    cd Managment-App
  2. Install dependencies

    npm install
    # or
    yarn install
  3. iOS Setup (macOS only)

    cd ios && pod install && cd ..
  4. Start the development server

    npm start
    # or
    yarn start
  5. Run on device/simulator

    # For Android
    npm run android
    # or
    npx react-native run-android
    
    # For iOS (macOS only)
    npm run ios
    # or
    npx react-native run-ios

πŸ“ Available Scripts

  • npm start - Start React Native development server
  • npm run android - Run application on Android device/emulator
  • npm run ios - Run application on iOS device/simulator
  • npm test - Run Jest tests
  • npm run lint - Run ESLint for code quality

🎨 Customization

Environment Variables

Create a .env file in the root directory for environment-specific configuration:

# API Configuration
API_BASE_URL=your_api_base_url
API_TIMEOUT=30000

# Authentication
JWT_SECRET=your_jwt_secret
REFRESH_TOKEN_EXPIRY=7d

# App Configuration
APP_NAME=Management App
APP_VERSION=0.0.1

Styling

The application uses React Native's built-in styling system. Custom styles can be added in:

  • Individual component files
  • Shared style constants in src/constants/
  • Theme configuration for consistent design

πŸ“± Screenshots

Main Screen Tasks Screen Schedule Screen Salary Screen

πŸ”§ Development

Code Quality

The project uses ESLint and Prettier for code quality and formatting:

# Check for linting errors
npm run lint

# Auto-fix linting issues
npx eslint . --fix

Testing

Run tests using Jest:

npm test

πŸ“„ License

This project is private and proprietary. All rights reserved.

πŸ“ž Contact

Management App


Built with ❀️ for efficient business management

Modern mobile solutions for modern businesses

About

React Native mobile app for business & employee management with task tracking, work schedules, and salary management. Built with TypeScript, Redux Toolkit, and React Query.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 3

  •  
  •  
  •