/React-Native-FrontendMasters

React Native app inspired from Frontend Masters! This application is designed to showcase integration of Async Storage with React Native and using the core native API's in the app.

Primary LanguageJavaScript

React Native Application - Frontend Masters

An Application built with React native to implement the core features in two separated courses from frontend-masters.

Table of Contents

What I have Learned

  • What is React Native
  • How to build application with Expo
  • Debugging React native apps
  • Adding styles with StyleSheet
  • Using FlatList and sectionList
  • Fetching data from network requests
  • Refreshing
  • Launching modals
  • How to build forms
  • Using typescript with React Native
  • How to create bottom navigation
  • How to use React Context to store global app state
  • Persisting data across app launches
  • Rendering images locally and via network url
  • Adding custom fonts
  • Animations using LayoutAnimation
  • Animations using Reanimated Library
  • Adding app icons
  • Data visualization in application

Features

  • Async Storage: Allow users to create new data and presisted when the app launches again.
  • Navigation: Allow users to navigate through the app.
  • Delete: Allow users to delete data from Async Storage.

Demo

Installation

  1. Clone the repository:

    git clone https://github.com/Shaban-Eissa/React-Native-FrontendMasters
  2. Navigate to the project directory:

    cd React-Native-FrontendMasters
  3. Install dependencies:

    npm install

Usage

  1. Start the UI:
    npx expo start

Technologies

This project utilizes a robust stack of modern technologies for efficient development and optimal user experience:

  • React Native
  • Expo
  • Async Storage
  • Reanimated
  • React Native linear-gradient
  • Date Fns
  • React Navigation

Contributing

Contributions are welcome! Please follow these guidelines:

  1. Fork the repository.
  2. Create a new branch for your feature/bugfix: git checkout -b feature-name.
  3. Commit your changes: git commit -m 'Add some feature'.
  4. Push to the branch: git push origin feature-name.
  5. Open a pull request.