Build a slideshow app

先从 issue 中链接的 Sprint-3/slideshow 课程作业开始，并在创建 app 入口点之前阅读其规范。构建图像轮播，以满足首张图像、导航、循环以及至少四张图像的要求；将定时控件视为扩展功能。在浏览器中手动验证每项验收标准。

Link to the coursework

https://github.com/CodeYourFuture/Module-Data-Groups/tree/main/Sprint-3/slideshow

Learning Objectives

• Develop a web app according to a specification
• Combine concepts covered in previous exercises

Why are we doing this?

These challenges are designed to develop your problem-solving skills.

In this exercise you will build an app which shows one image at a time from a collection. It must meet the criteria below:

Acceptance criteria

• Given a web page with a carousel of images
  When the page loads
  Then the first image in the carousel should be displayed

• Given forward and back buttons
  When the forward button is clicked
  Then the next image in the carousel should be displayed
  And
  When the back button is clicked
  Then the previous image in the carousel should be displayed

• Given at least 4 images in the carousel
  When the user reaches the end of the carousel in either direction
  Then the carousel should loop back to the first/last image

Advanced stretch functionality

• Given auto-forward and auto-back buttons
  When the auto-forward button is clicked
  Then the images should automatically advance every 5 seconds

• When the auto-back button is clicked
  Then the images should automatically go back every 5 seconds

• Given the carousel is auto-advancing (in either direction)
  When the stop button is clicked
  Then the auto-advance/go back should stop

• Given the carousel is auto-advancing (in either direction)
  When the forward button is clicked
  Then the auto-advance should stop
  And the next image should show
  (next = stop + forward)

• Given the carousel is auto-advancing (in either direction)
  When the back button is clicked
  Then the auto-advance should stop
  And the previous image should show
  (back = stop + back)

Maximum time in hours

4

How to get help

General advice on asking for help can be found on the curriculum pages.
You can always share your blockers in your class channel and get help from your colleagues.

How to submit

1. Fork the coursework repo to your Github account.
2. Make a branch for this project.
3. Make regular small commits in this branch with clear messages.
4. When you are ready, open a PR to the CYF repo, following the instructions in the PR template.

There are several projects in this repo. Make a new branch based on main for each project.