Understanding Paths in Terminals and Websites

This video explains how you can write accurate paths in the Terminal as well as in your HTML, CSS, and JavaScript files so they work locally as well as on Github Pages.
Code from video: github.com/pro...
The github repo has had the path that starts with "/" fixed to work in the final version.

[@shahinza]

Thanks

[@amircahyadi9219]

Thanxs sir ❤👍👍

[@Mahmoud_A999]

I didn't understand the /img is it referring to the root of the file or the system? I have misunderstanding to this point

[@SteveGriffith-Prof3ssorSt3v3]

Web Servers have a root folder that they point to. They can access anything inside that folder but not outside of it. "/" points to that root folder.

[@Mahmoud_A999]

@@SteveGriffith-Prof3ssorSt3v3 ok thanks

[@mkm_]

So when loading images (or other files) inside the html, is there a convention on when to use "img/puppy.webp" or "./img/puppy.webp"? Because I'm never sure which one is more _appropriate._

[@SteveGriffith-Prof3ssorSt3v3]

Both are absolutely fine.

[@aleksandr2245]

In my humble opinion, it is better to use absolute paths in HTML. This way, when you deploy your frontend app or return static files using Express, users cannot break everything by specifying incorrect paths and hitting reload. For example, if a user tries to access domain/bla-bla/nothing-here, all our assets, styles, and images will still be bound to the root.

[@SteveGriffith-Prof3ssorSt3v3]

@Aleksandr it will depend on the location of the asset. For external ones you have to use absolute. With relative paths your code can run in your dev, staging, and production environments without changing the paths even when the folder location relative to the root changes between environments

[@aleksandr2245]

@@SteveGriffith-Prof3ssorSt3v3 Thank you for clarifying!