JS_Slideshow

JS Slideshow for WordPress Posts: live website

Requirements can also be seen here

Problem Statement

Please understands you must do this assignment using core JS & CSS. No frameworks. Not even jQuery. Not even for AJAX. You are free to Google as much as you want!

Now please accomplish following:

1. Please create a Single Page App using CSS/JS which fetches data using WP REST API using a WordPress site. You can use WPTavern (REST API endpoint).
2. Once you fetch data, please display data as a slideshow. Make sure your slideshow covers post title, post featured image, post date, and any other meta-data you can find. Clicking on title/image should open the original post link.
3. Every slide in slideshow must wait for 5 seconds before automatically moving to next slide (post). Besides, please add “buttons” to move to the next and previous slide.
4. The slideshow must support keyboard navigation. The right arrow key to move to the next slide and left arrow key to move to the previous slide.
5. The slideshow must be responsive.
6. Further, on mobile devices, a viewer should be able to swipe with a thumb to move between the next and previous slides.
7. When your page loads, it will display a slideshow for the latest WPTavern’s post, but the interface must provide a text-field to accept any website URL and be with a click of button change slideshow content from this website. As an example, we will input rtcamp.com and click-a-button which should change slideshow to display rtCamp’s latest blog post.

Submission Guidelines

1. Source Code Hosting ➞ You must use Github (recommended) or Gitlab for source code hosting.
2. Web Hosting for demo ➞ As your app work doesn’t have any server-side component development — besides using data from WordPress sites which are already publicly hosted — you should be able to use Github pages for hosting. You can even try Vercel or any other hosting of your choice.