Using eventChannel in React Redux-Saga, API in below link.

Overview

Redux saga

In this project, I used eventChannel in redux-saga module.

function subscriber(alphabet_index) {
    return eventChannel(emitter => {
        const iv = setInterval(async () => {
            /**
             * data includes { countries, alphabetIdx }
             */
            let data = await getAlphabetCounteries(alphabet_index ++);
            emitter(data)
        }, 15000);
        // The subscriber must return an unsubscribe function
        return () => {
          clearInterval(iv)
        }
      }
    )
  }
function* saga() {
    const chan = yield call(subscriber, 0)
    try {
        while(true) {
            let data = yield take(chan)
            yield put(PUT_COUNTRIES(data));
        }
    } finally {
        console.log("terminated");
    }
}

Country API

I get country data from https://restcountries.eu/.

{ ... });">
return axios.get("https://restcountries.eu/rest/v2/all").then((response) => {
    ...
});

Website Deployment, Visit HERE!

https://test-project-country-finder.web.app/

You might also like...
React-compress - This compress library was made with Brotli and Gzip help, for React users who want to make website more performance and reduce JS bundle code
React-compress - This compress library was made with Brotli and Gzip help, for React users who want to make website more performance and reduce JS bundle code

React-compress - This compress library was made with Brotli and Gzip help, for React users who want to make website more performance and reduce JS bundle code

React adblocker detect - Provides you with react hook to detect is an adblocker is enabled

React adblocker detect - Provides you with react hook to detect is an adblocker is enabled

A react or react native library to call functions comparing the last time that it was called
A react or react native library to call functions comparing the last time that it was called

A react or react native library to call functions comparing the last time that it was called and running it when it's really needed. Avoiding unnecessary database calls or data loads that are updated at a certain time.

👉 React Finger is a library of gesture events for React that allows developers to use a single set of events for both desktop and mobile devices.
👉 React Finger is a library of gesture events for React that allows developers to use a single set of events for both desktop and mobile devices.

👉 React Finger is a library of gesture events for React that allows developers to use a single set of events for both desktop and mobile devices.

Extended utils for ⚛️  React.Children data structure that adds recursive filter, map and more methods to iterate nested children.
Extended utils for ⚛️ React.Children data structure that adds recursive filter, map and more methods to iterate nested children.

React Children Utilities Recursive and extended utils for React children opaque data structure. Installation Available as a package and can be added t

CSS media queries for React

react-media react-media is a CSS media query component for React. A Media component listens for matches to a CSS media query and renders stuff based

A component for React that utilizes the Counterpart module to provide multi-lingual/localized text content.

React Translate Component Translate is a component for React that utilizes the Counterpart module and the Interpolate component to provide multi-lingu

A static site generator powered by Deno + React
A static site generator powered by Deno + React

A static site generator powered by Deno + React

The next generation state management library for React

The next generation state management library for React

Owner
James Johnson
@Tracsell former CTO | @RubyOnWorld Organizer
James Johnson
A small utility for constructing classnames using a variant based api.

twix ?? twix is a small utility for constructing classnames using a variant based api. The API is largely copied from stitches but works with just pla

Anthony Yarbrough 7 Nov 7, 2022
Library created to format numbers easily and quickly using the Intl.NumberFormat Constructor API.

Number Formatter number-formater is a JavaScript library built to make it faster and more efficient to use the ECMAScript (Intl) API for number format

Daniel Eduardo Almagro 2 Nov 19, 2021
Helper functions for React Context API inspired by @reduxjs/toolkit

react-ctx-toolkit is a simple, compact, uncomplicated package inspired by @reduxjs/toolkit that includes helper functions for better coding with Context API

AmirHossein Sadeqi 5 Nov 25, 2022
React-native-dotenv - Load react native environment variables using import statements for multiple env files.

react-native-dotenv Load environment variables using import statements. Installation $ npm install react-native-dotenv Breaking changes: moving from v

Kemal Ahmed 543 Dec 6, 2022
Easily create presentation board using React

React Speaker Board Easily create presentation board using React. Quick Usage It install react-speaker-board running this comand. $ yarn add react-spe

nappa 6 Sep 16, 2022
A ReactJS password recovery box component built using the FluentUI library

A ReactJS password recovery box component built using the FluentUI library

Boia Alexandru 3 Mar 18, 2022
Amplify-secure-js - A secure http only cookie based approach to using AWS Amplify

Amplify-secure-js - A secure http only cookie based approach to using AWS Amplify

nitric 25 Nov 9, 2022
Utility functions for drawing beautiful arrows using cubic bezier paths

proto-arrows A set of utility functions for drawing beautiful arrows using cubic bezier paths. Inspired by perfect-arrows. Why proto-arrows? Because c

Kristian Muñiz 68 Nov 1, 2022
A lightweight react library that converts raw HTML to a React DOM structure.

A lightweight react library that converts raw HTML to a React DOM structure.

Arve Knudsen 718 Dec 4, 2022
React-intersection-observer - Intersection observer With React

react-intersection-observer Package ?? Copy and Paste the Framer Package Usage F

null 4 Jul 10, 2022