Create the startpage

[WinterIsCoding23]

Value proposition As a user I want to be presented a random movie (title, image) to get inspiration for movies to watch.

Description

Acceptance-criteria

• [x] The header with the app-name is shown on the starting-page
• [x] A search-button (not functional yet) is shown underneath the title
• [x] A random movie is displayed underneath the search-button
• [x] A Watchlist-component is displayed

Tasks

• [x] Create a start-page with a header (title) and a body with a Watchlist-component.
• [x] Add a footer/navigation-bar to the startpage displaying a home-button and a go-back-button (not functional yet)
• [x] Connect the app to a movie-database (API)
• [x] Add 1 random-movie to be displayed between search-button and Watchlist
• [x] Add styling
• [x] Add messages for loading, error
• [x] Wrap in SWR (only works for client-side-rendering!)

[WinterIsCoding23]

• [x] clarify: Usage of layout.js
• [x] SWR in next.js 13 - Jan: yes
• [x] delete automatic margin 8px on body
• [x] solve navBar-bug
• [x] solve error in console: "Warning: Extra attributes from the server: class" - Jan: Chrome-extensions guilty - check : no... --> Apparently "nothing to worry about" (https://github.com/muxinc/media-chrome/issues/358)