This project was created using the Devextreme library which contains many other professional looking widgets. So in addition to an image gallery and thumbnail slider, you can look into using a variety of other devextreme widgets and customize them as needed. This project took less than a week from start to finish.
The two main widgets configured are the Gallery widget for the main image gallery and the Tabs widget repurposed as a thumbnail slider. The Tabs widget was recently improved (https://js.devexpress.com/React/New/23_2/#Tabs-and-TabPanel) and now has an orientation option that allows you to align the tabs horizontally or vertically, which provides a more flexible thumbnail slider depending on your use case.
Alternatively, you can allow the user to switch between the four thumbnail positions (left,right,top, and bottom) as shown in this demo and the code provided.
I separated the Options.js page from the main App.js page for two reasons, the first was to avoid overwhelming those who are new to Devextreme or React in general and just show the two main components in use in the App.js file (Gallery + Tabs widgets). The second reason is to show you how easy it is to setup and configure the "optional" widgets used in the options menu, or not use them at all.
All thumbnail positions have the added bonus of allowing users to scroll through the thumbnail list instead of having to rely on the tabs navigation buttons alone. In the horizontal position you can 'left mouse-click' and drag the thumbnails left or right. In the vertical position you can do the same, or just scroll up and down with your mouse-wheel. On mobile swipe gestures can be used as well.
To try the online demo click on the following link: https://devextreme-image-gallery-thumbnails.netlify.app/
Note: you can use this code freely (as is) however the devextreme components do require a developer license if you plan on modifying the code and using it for commercial purposes: https://js.devexpress.com/Buy/ .
I am an independent contractor and this is my 'go to' library for all client engagements. Please leave a star if you clone this repository or find the code useful.