Top Quality Products

Coupon Offer App – React Native Theme

$43.00

Added to wishlistRemoved from wishlist 0
Add to compare

23 sales

Coupon Offer App – React Native Theme

Coupon Offer App – React Native Theme Review

Introduction

The Coupon Offer App – React Native Theme is a comprehensive and professionally designed React Native template that provides a powerful starter project for creating a mobile app. This template is suitable for developers who want to quickly build a coupon and reward app for both Android and iOS platforms.

Features

The template offers a wide range of features, including:

  • User and Merchant Applications
  • Single login for both apps
  • Customizable visual design
  • Google Maps API integration
  • Geolocation API integration
  • Support for various packages such as React Native Community packages, React Navigation, and more

Screens

The template includes a large number of screens, including:

  • Splash Screen
  • Intro Screens
  • Login Screen
  • Forgot Password Screen
  • Signup Screen
  • Home Screen
  • Offer Screen
  • Reward Screen
  • Settings Screen
  • Notification Screen
  • Merchant Details Screen
  • Experience Screen
  • Upload Experience Screen
  • Redeem Offer Screen
  • Map Screen
  • Profile Screen
  • Success Screen
  • Message Screen

Customization

The template’s visual design can be easily customized to fit your branding and style. The template uses React Native’s flexible layout system, making it easy to adjust the layout and design of the screens.

Requirements

To customize this template, you will need:

  • Code Editing Software (e.g. Visual Studio Code, etc.)
  • Devices for testing (e.g. Android)

Packages Used

The template uses a wide range of packages, including:

  • @react-native-community/datetimepicker
  • @react-native-community/masked-view
  • @react-native-picker/picker
  • and many more

Setup and Installation

To set up the template, you will need to install the required packages and follow the instructions provided in the template’s documentation.

Conclusion

The Coupon Offer App – React Native Theme is a comprehensive and well-designed template that provides a powerful starter project for building a mobile app. Its customizable design, wide range of features, and extensive documentation make it an ideal choice for developers who want to quickly build a high-quality app.

Score: 9/10

I would highly recommend this template to any developer looking to build a coupon and reward app. The template’s documentation is extensive, and its features are well-implemented. However, the template’s code could be better organized, and some features could be improved. Nevertheless, this template is a great starting point for any developer looking to build a high-quality app.

User Reviews

0.0 out of 5
0
0
0
0
0
Write a review

There are no reviews yet.

Be the first to review “Coupon Offer App – React Native Theme”

Your email address will not be published. Required fields are marked *

Introduction

Welcome to the Coupon Offer App - React Native Theme Tutorial! In this tutorial, we will be exploring how to use the Coupon Offer App - React Native Theme, a cutting-edge React Native theme that allows users to manage and redeem digital coupons.

The Coupon Offer App is designed to simplify the process of creating and managing digital coupons, making it easier for businesses to offer special deals and discounts to their customers. With this app, users can browse and select coupons that are relevant to their interests, redeem them at checkout, and keep track of their favorite brands and coupons.

In this tutorial, we will walk you through the various features and functionality of the Coupon Offer App - React Native Theme, and show you how to use it to create and manage your own digital coupons.

Tutorial

Step 1: Setting up the App

To get started, you'll need to download and install the Coupon Offer App - React Native Theme from the React Native Expo client.

Once you have installed the app, you'll see the app's main screen, which features a search bar, a list of available coupons, and a button to browse more coupons.

Step 2: Creating a New Coupon

To create a new coupon, click on the "+" button on the top-right corner of the screen. This will take you to the Coupon creation screen, where you can enter the following details:

  • Coupon Name
  • Coupon Code
  • Description
  • Expiration Date
  • Start Date
  • End Date
  • Category
  • Brand

You can also upload a logo and image for the coupon, and set the coupon type (e.g. percentage off, fixed amount off, etc.).

Once you have entered the necessary details, click "Save" to create the coupon.

Step 3: Editing a Coupon

To edit an existing coupon, navigate to the Coupon list screen and tap on the coupon you want to edit. This will take you to the Coupon edit screen, where you can make changes to the coupon details, upload a new logo and image, and set the coupon type.

Step 4: Redeeming a Coupon

To redeem a coupon, navigate to the Coupon list screen and tap on the coupon you want to redeem. This will take you to the Redeem Coupon screen, where you can enter the required information to redeem the coupon (e.g. name, email, etc.).

Once you have entered the required information, click "Redeem" to redeem the coupon.

Step 5: Managing Favorite Coupons

To manage your favorite coupons, navigate to the Favorite Coupons screen and tap on the coupon you want to remove from your favorites. This will take you to the Coupon details screen, where you can remove the coupon from your favorites.

Step 6: Searching for Coupons

To search for coupons, navigate to the Coupon list screen and use the search bar at the top of the screen to search for coupons based on keywords, categories, brands, etc.

Conclusion

In this tutorial, we have covered the basics of using the Coupon Offer App - React Native Theme. With this app, you can create and manage digital coupons, browse and redeem them, and keep track of your favorite brands and coupons.

Remember to explore the app's features and functionality to get the most out of it, and don't hesitate to reach out to us if you have any questions or need further assistance. Happy couponing!

Here is a complete settings example for the Coupon Offer App - React Native Theme:

Base URL

config.api.baseURL = 'https://api.example.com';

Authentication

config.authentication.type = 'BearerToken';
config.authentication.tokenName = 'Authorization';
config.authentication.tokenValue = 'your-token-here';

Coupon Store

config.couponStore.apiKey = 'your-api-key';
config.couponStore.url = 'https://your-coupon-store.com';

Discount Rule

config.discountRule.type = 'fixed';
config.discountRule.amount = 10;
config.discountRule.maxDiscount = 50;

Notification

config.notification.title = 'Coupon Offer App';
config.notification.message = 'Your coupon has been applied';
config.notification.sound = 'default';

Push Notification

config.pushNotification.enabled = true;
config.pushNotification.notificationTitle = 'Coupon Offer App';
config.pushNotification.notificationMessage = 'Your coupon has been applied';

API Key

config.apiKey = 'your-api-key';

Environment

config.environment = 'development';

Timezone

config.timezone = 'America/New_York';

Currency

config.currency = 'USD';

Minimum Order Value

config.minimumOrderValue = 50;

Maximum Discount

config.maximumDiscount = 50;

Coupon Code

config.couponCode = 'YOUR_COUPON_CODE';

Coupon Type

config.couponType = 'percentage';
Add all featured about this Coupon Offer App - React Native Theme, and you can extract more information from this content

This is a coupon and reward App built with React Native for android and iOS platform. There are two apps in the source-code that is User and Merchant Application

Designed to save hours of work for creating unique UI, a powerful starter project that bootstraps development of your mobile application. The application’s visual design can easily be customized.

Version: 1.0 Files Included: Full Source Code of React Native App (Android and iOS)

Theme Name : CouponOffer React Native App Template (User + Merchant App)

In case of any issue, send us your query on our email admin@devlab.works

Testing purpose

This app is a single login application that contains both User and Merchant Application

  • For Merchant App, login with the following credential
    • username: admin
    • password: admin
  • For User App, login with the following credential
    • username: user
    • password: user

Download CouponOffer React Native Android

Download CouponOffer React Native Android APK

Coupon Offer Android and iOS React Native Theme Coupon Offer Android and iOS React Native Theme Coupon Offer Android and iOS React Native Theme Coupon Offer Android and iOS React Native Theme Coupon Offer Android and iOS React Native Theme Coupon Offer Android and iOS React Native Theme Coupon Offer Android and iOS React Native Theme Coupon Offer Android and iOS React Native Theme

and many more screens….

Requirements

You will need the following sofwares to customize this template.

WHAT YOU GET IN PACKAGE

  • Source Code of Apps with Single Login
  • Project Documentation

Development Environments

Install these in order to successfully run this theme in your devices.

User App Screens
  • Splash Screen
  • 3 Intro Screen
  • Login Screen
  • Forgot Password Screen
  • Signup Screen
  • Home Screen
  • Offer Screen
  • Reward Screen
  • Settings Screen
  • Notification Screen
  • Merchant Details Screen
  • Experience Screen
  • Upload Experience Screen
  • Redeem Offer Screen
  • Map Screen
  • Profile Screen
  • Success Screen
  • Message Screen

Merchant App Screens

  • Splash Screen
  • Login Screen
  • Forgot Password Screen
  • Signup Screen
  • Business Plans Screen
  • Home Screen
  • Location Screen
  • Add Location Screen
  • Set Map Location Screen
  • Add Offers/Coupon Screen
  • View Offer Screen
  • Send Message to User Screen
  • Recent Visit User Screen
  • Notification Screen

Also Github Action is added in the .github/workflows/action.yml which will allow you to automatically build APK using Github

Added API Support

  • Google Maps API
  • Geolocation API

(Components, Screens and Assets)

File Structure

(Components)

Components

(Screens)

Screens

Packages used

  • @react-native-community/datetimepicker”: “2.6.0”,
  • “@react-native-community/masked-view”: “0.1.10”,
  • “@react-native-community/slider”: “3.0.0”,
  • “@react-native-picker/picker”: “1.15.0”,
  • “esdoc-standard-plugin”: “1.0.0”,
  • “native-base”: “2.13.12”,
  • “react”: “16.11.0”,
  • “react-native”: “0.62.2”,
  • “react-native-animatable”: “1.3.3”,
  • “react-native-app-intro-slider”: “4.0.4”,
  • “react-native-circular-progress”: “1.3.6”,
  • “react-native-datepicker”: “1.7.2”,
  • “react-native-gesture-handler”: “1.6.1”,
  • “react-native-get-location”: “1.4.2”,
  • “react-native-image-picker”: “2.3.3”,
  • “react-native-image-slider”: “2.0.3”,
  • “react-native-image-slider-box”: “1.0.12”,
  • “react-native-lightbox”: “0.8.1”,
  • “react-native-linear-gradient”: “2.5.6”,
  • “react-native-maps”: “0.27.1”,
  • “react-native-masked-view”: “0.2.0”,
  • “react-native-modal”: “11.5.6”,
  • “react-native-parallax-header”: “1.1.3”,
  • “react-native-raw-bottom-sheet”: “2.2.0”,
  • “react-native-reanimated”: “1.8.0”,
  • “react-native-safe-area-context”: “3.1.9”,
  • “react-native-screens”: “2.5.0”,
  • “react-native-simple-radio-button”: “2.7.4”,
  • “react-native-simple-toast”: “1.1.2”,
  • “react-native-slider”: “0.11.0”,
  • “react-native-svg”: “12.1.0”,
  • “react-native-swipe-list-view”: “3.1.3”,
  • “react-native-vector-icons”: “6.6.0”,
  • “react-native-video”: “5.1.0-alpha8”,
  • “react-navigation”: “4.2.2”,
  • “react-navigation-stack”: “2.3.11”,
  • “react-navigation-tabs”: “2.8.11”,
  • “react-navigation-transitions”: “1.0.12”,
  • “reanimated-bottom-sheet”: “1.0.0-alpha.19”,
  • “rn-placeholder”: “3.0.1”

Need Assistance in Setting Up?

Don’t worry. We got you covered. Checkout the following plans

Dev Plans
Coupon Offer App - React Native Theme - 1

Tools used

  • ESLINT Used for formatting
  • Well commented code<br>

Setup Google Maps API

Follow the steps present on this link https://www.wpgmaps.com/documentation/creating-a-google-maps-api-key/<br>

OR<br>

Video: How to Create a Google Maps API key<br>

(https://www.youtube.com/watch?v=nADMsw2xjyI)

Add the Google Maps API key here in android/app/src/main/AndroidManifest.xml on line 16

Generate APK for different architecture

Set the value of universalApk to false

. Each featured in different line.
Coupon Offer App – React Native Theme
Coupon Offer App – React Native Theme

$43.00

Shop.Vyeron.com
Logo
Compare items
  • Total (0)
Compare
0