Refactoring Youtube Player to use Flux — Part 3
Welcome to Part 3 and here we will add the functionality to click on a video, in the list to select it and display it in player.
Now the flow will be —
* We will have a click handler in video_list_item.js on each video.
* Which will fire a new action in yTSearch_action.js
* Through the dispatcher, this video will be passed to ytSearch_store.js. It will emit the video then.
* Then video_detail.js will receive this specific video and show it in player.
Let’s now start with video_list_item.js and add the onClick() handler. Here we have imported the YTSearchAction first and then in li (which will hold a single video in list), added an onClick() handler which will fire an action in actions file. The line key={video.etag}, is to identify this video uniquely as etag for each video from youtube is unique. It is required to do in React when handling arrays, or else it throws a big red warning.
You can read rest of the blog from my blog site. The link is below.
This concludes our series. Hope you enjoyed it. The github repo is here.
