marcbendixen / capstone-project

Serientracker is a personal assistant to track your series and episodes and discover new ones. This is a capstone project for @neuefische web development bootcamp.

Hej 👋 I'm Marc Bendixen

• 👨‍💻 Working as a Web Development Coach
• 🌱 I'm currently learning more about TypeScript and Astro

📫 Let's connect

capstone-project's Issues

[US-03] Add series to watchlist

Value statement (User story)

As a user
I want to add a series to the watchlist
in order to filter between popular series and the watchlist.

Description

Acceptance criteria

• The detail view should contain a new button/icon to add the series to the watchlist
• The user should be able to switch between the popular series list and the watchlist

Tasks

• Create feature branch
• Build button component for the 'add to watchlist' icon (+ storybook)
• Write test for the component
• Add function to add a series to the watchlist
• Add function to switch the view (popular/watchlist)
• Add styles

Complexity (low, medium, high)

medium

[US-05] Highlight episode as watched

Value statement (User story)

As a user
I want to highlight an episode
in order to see which episodes i have already watched.

Description

Acceptance criteria

• Each Episode card should contain a button/icon to highlight it as watched
• It should be possible to change the status back to 'not watched'

Tasks

• Create feature branch
• Update episode card component with button/icon (+ storybook)
• Update test for the component
• Add function to change status of watched/not watched
• Add styles

Complexity (low, medium, high)

medium

[Task] Add localStorage

• Use localStorage
• save watchlist
• save watched episodes

[US-06] Add search

Value statement (User story)

As a user
I want to search for series
in order to find them and get to the details page.

Description

Acceptance criteria

• The search page should contain an input to type the search term
• While typing the results should be displayed below
• It should be possible to click on a result to get to the details
• The navigation should contain a link to the search page

Tasks

• Create feature branch
• Create the server API route
• Implement the fetch on client side
• Create a search page with input
• Connect input value with fetching data
• Add the results to search page
• Add link to get to details from results
• Update navigation & react router
• Add basic styling

Complexity (low, medium, high)

medium

[US-02] Details about series

Value statement (User story)

As a user
I want to click on a poster
in order to get some details about the series.

Description

Acceptance criteria

• The detail view should contain the poster
• The user should be able to return to the list
• It should contain the name of the series
• It should contain a brief description of the series
• It should include a list of the cast

Tasks

• Create feature branch
• Build series detail page
• Write test for the page
• Add function to get back to the list view
• Add styles

Complexity (low, medium, high)

low

[US-01] List of popular series

Value statement (User story)

As a user
I want to have a list of popular series
in order to get an overview and discover new ones.

Description

Acceptance criteria

• List should contain popular series.
• List of posters should be displayed in a grid layout.
• Poster should contain an alt-text.

Tasks

• Create feature branch
• Build poster component (+ storybook)
• Build poster list component (+ storybook)
• Write tests for both components
• Add poster list to App
• Add basic global styles

Complexity (low, medium, high)

low

[US-04] Add season to details

Value statement (User story)

As a user
I want to get the seasons of a series
in order to know how many episodes there are and to see the titles.

Description

Acceptance criteria

• The detail view should contain a list of episodes for seasons of the series
• The user should be able to see a title and description of each episode

Tasks

• Create feature branch
• Build card component for an episode (+ storybook)
• Build episodes list component (+ storybook)
• Write test for the component
• Add styles

Complexity (low, medium, high)

medium

[Task] Refactoring

• Refactor code and files

[Task] Add basic API connection to project

• Update express/server
• Add connection to API to get easier access to data
• Update components
• Add project to Heroku

[US-07] Add more details

Value statement (User story)

As a user
I want to get more details
in order to find more information about the series.

Description

Acceptance criteria

• The details page should contain a box with more information
• It should be possible to show/hide the box
• The default should be a hidden box

Tasks

• Create feature branch
• Create component for more details
• Add the component to details page
• Add function to toggle the box
• Add basic styling

Complexity (low, medium, high)

low