Why do I have 404 Not Found when Clicking home wordpress

Question

The Situation

Every time I click the home button below I find thaty it takes me to 404 not found as below that:

Wordpress dashboard

Error

I am not sure why this is occuring, but it seems to be redirecting to away from the port:8080 but I have set the wp_options site_url and home_url to http://localhost:8080/wordpress within phpAdmin. How could I fix this?

====== EDIT:

The behavior when looking in the log in the console after clicking the home button is:

    Request URL: http://localhost:8080/wordpress/
    Request Method: GET
    Status Code: 301 Moved Permanently (from disk cache)
    Remote Address: [::1]:8080
    Referrer Policy: strict-origin-when-cross-origin
    Content-Length: 0
    Content-Type: text/html; charset=UTF-8
    Date: Wed, 03 Feb 2021 17:40:28 GMT
    Location: http://localhost/wordpress/
    Server: Apache/2.4.46 (Win64) OpenSSL/1.1.1h PHP/7.4.13
    X-Powered-By: PHP/7.4.13
    X-Redirect-By: WordPress
    Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9
    Accept-Encoding: gzip, deflate, br
    Accept-Language: en-ES,en-US;q=0.9,en;q=0.8
    Connection: keep-alive
    Cookie: wp-settings-1=mfold%3Do; wp-settings-time-1=1612439758; wordpress_test_cookie=WP%20Cookie%20check; wordpress_logged_in_7d02bf5d4e081af2908123233e7fb2e7=Kwsswart%7C1612681149%7C3lzaDUQayIVeJSHGTZiiOEF0IPOnAvdyMTTlSq6SP7Z%7C66c2a42cd2b27d342bd5a234fb1276e73122a06eb9761a76f336f26c5cea485e
    Host: localhost
    Referer: http://localhost:8080/
    sec-ch-ua: "Chromium";v="88", "Google Chrome";v="88", ";Not A Brand";v="99"
    sec-ch-ua-mobile: ?0
    Sec-Fetch-Dest: document
    Sec-Fetch-Mode: navigate
    Sec-Fetch-Site: same-site
    Sec-Fetch-User: ?1
    Upgrade-Insecure-Requests: 1
    User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.104 Safari/537.36

Followed by:

    Request URL: http://localhost/wordpress/
    Request Method: GET
    Status Code: 404 Not Found
    Remote Address: [::1]:80
    Referrer Policy: strict-origin-when-cross-origin
    Connection: Keep-Alive
    Content-Length: 196
    Content-Type: text/html; charset=iso-8859-1
    Date: Fri, 05 Feb 2021 06:59:33 GMT
    Keep-Alive: timeout=5, max=100
    Server: Apache/2.4.46 (Win64) PHP/7.4.13
    Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.9
    Accept-Encoding: gzip, deflate, br
    Accept-Language: en-ES,en-US;q=0.9,en;q=0.8
    Connection: keep-alive
    Cookie: wp-settings-1=mfold%3Do; wp-settings-time-1=1612439758; wordpress_test_cookie=WP%20Cookie%20check; wordpress_logged_in_7d02bf5d4e081af2908123233e7fb2e7=Kwsswart%7C1612681149%7C3lzaDUQayIVeJSHGTZiiOEF0IPOnAvdyMTTlSq6SP7Z%7C66c2a42cd2b27d342bd5a234fb1276e73122a06eb9761a76f336f26c5cea485e
    Host: localhost
    Referer: http://localhost:8080/
    sec-ch-ua: "Chromium";v="88", "Google Chrome";v="88", ";Not A Brand";v="99"
    sec-ch-ua-mobile: ?0
    Sec-Fetch-Dest: document
    Sec-Fetch-Mode: navigate
    Sec-Fetch-Site: same-site
    Sec-Fetch-User: ?1
    Upgrade-Insecure-Requests: 1
    User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like

wp_admin settings

Answer 1

You still have to call your frontend under port 8080

localhost:8080/wordpress

EDIT: Have a look here: themeisle.com/blog/install-xampp-and-wordpress-locally