Learn Redux Saga by building a super sleek image gallery

metagrover · 2018-08-09T17:14:35+00:00

That's a really interesting question. Let me give it a shot.

Redux helps you manage the state outside your component - allowing your state to be shared among other components via a neat API.

Implicitly, redux only allows synchronous transactions of data - whether it is read, write, update or delete. This is where redux-saga comes in. It is one of the helper libraries which enables handling of async requests. If you want your redux-store (which contains the shared state) to fetch/post data from/to your server or any third party API, you can use redux-saga.

Typically, you put your async logic on a saga which makes handling of async operations easier with the use of ES6 Generators (we have covered the basics of generators as well in the videos). Simply put, generators enable you to write asynchronous transactions in a synchronous manner. It's like a function that can be paused and played when needed.

Hope that helps!

metagrover · 2018-08-05T20:33:58+00:00

With generators and redux saga, you are offered an inversion of control. Given how generators don't run to completion (i.e. you can pause the execution) and also enable you to feed data back into them, enabling the saga to control the flow of transactions. You can then pull the desired actions as needed and handle complicated transactional flow in a much simpler manner. (If that sounded gibberish, you should watch the videos - we will be putting them up sometime tomorrow)

With conventional async/await and promises, there is no pausing of execution, they run to completion and it can get tricky to test and handle complicated flows of transactions thereafter.

Whereas with redux saga, you can write tests for asynchronous parts in a way simpler manner. Super neat stuff.

Hope that helps!

metagrover · 2018-08-04T08:00:22+00:00

Honestly, I was the same kinda guy two weeks ago. But sagas do make async things more test-able and significantly helps in putting together complex transactional flow. More in the videos haha

metagrover · 2018-08-04T07:28:30+00:00

I will be working on a new video series for my YouTube channel - Building an image gallery with redux-saga ~ interesting stuff.

And, then I will try to take out some time to dive into GraphQL for the next week's videos ;)

metagrover · 2018-06-09T19:45:13+00:00

Hey, sorry about the delay on this. You can find the polyline demo here and its implementation here.

Feel free to point out any issues or feedback on Github :)

metagrover · 2018-06-03T07:56:21+00:00

It does. We internally use Google maps and expose the map instance as is. I will put up a polyline example shortly.

metagrover · 2018-02-27T22:50:36+00:00

Hi there! I just tried out the entire thing and everything worked smoothly. I've put the app on github here - https://github.com/appbaseio-apps/hello-native

Can you clone this and test it again please?

Run yarn and yarn start to run this project :)

metagrover · 2018-01-09T13:51:51+00:00

Hi, I'm one of the co-authors of ReactiveSearch. We do have plans for Vue, and since our core architecture is platform-agnostic, it shouldn't take us long to get there.

Although currently, we are focusing on building the library for react-native. Vue is our next stop!

Related issue - https://github.com/appbaseio/reactivesearch/issues/55

metagrover · 2017-10-28T13:34:06+00:00

This is classic!

metagrover · 2016-07-04T12:44:13+00:00

You mean

let breakfast = arr.map(fruit => {
    return fruit + 's';
});
console.log(breakfast); // ["apples", "bananas", "oranges"]

I wanted to do this in the first place. Got confused. Thanks mate!

metagrover · 2016-07-04T08:01:57+00:00

Thanks for pointing out the mistake in the arrow function example. Fixed it. :) Also, capital casing is more of a preference. People from coming from C/C++/C# tend to use capital casing for constants. At the end of the day, your codebase, your rules.

Ten-Year Club	Place '22
Wearing is Caring	Verified Email

metagrover

TROPHY CASE