JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://rawgit.com/allensarkisyan/VideoFrame/master/VideoFrame.min.js"></script>
  <div class="frame">  
  <span id="currentFrame">0</span>
  </div>

<video height="180" width="100%" id="video"> 
  <source src="http://www.w3schools.com/html/mov_bbb.mp4"></source>
</video>

<div id="controls">
  <button id="play-pause">Play</button>
</div>

JavaScript

var currentFrame = $('#currentFrame');
var video = VideoFrame({
    id : 'video',
    frameRate: 29.97,
    callback : function(frame) {
        currentFrame.html(frame);
    }
});

$('#play-pause').click(function(){
    if(video.video.paused){
        video.video.play();
        video.listen('frame');
        $(this).html('Pause');
    }else{
        video.video.pause();
        video.stopListen();
        $(this).html('Play');
    }
});