FevenSeyfu/coding-bootcamp-testimonials-slider

This is a solution to the Coding bootcamp testimonials slider challenge on Frontend Mentor.

Frontend Mentor - Coding bootcamp testimonials slider solution

This is a solution to the Coding bootcamp testimonials slider challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

Table of contents

• Overview
  • The challenge
  • Links
• My process
  • Built with
  • What I learned
• Author
• Acknowledgments

Overview

The challenge

Users should be able to:

• View the optimal layout for the component depending on their device's screen size
• Navigate the slider using either their mouse/trackpad or keyboard

Links

• Solution URL: Solution URL
• Live Site URL: Live site URL

My process

Built with

• Semantic HTML5 markup
• CSS custom properties
• Mobile-first workflow

What I learned

Fetch data from json and use slider button to loop through and show testimonials

btnNext.addEventListener('click', () => {
  currentTestimonial = (currentTestimonial + 1) % data.length;
  updateTestimonial(currentTestimonial);
});

btnPrev.addEventListener('click', () => {
  currentTestimonial = (currentTestimonial - 1 + data.length) % data.length;
  updateTestimonial(currentTestimonial);
});

Author

• Website - Feven Seyfu
• Frontend Mentor - @FevenSeyfu
• Linkedin - Feven Seyfu

Acknowledgments

I would like to thank all who have reviewed my solution and given me feedback and Frontend mentors for providing the assets and design files I have used for the project.