Is there an equivalent of Chrome's DevTools' Sources panel in Firefox DevTools?

Question

In the below image, as you can see, there is a Sources tab that allows me to browse through my project files.

Also, my Firefox DevTools do not show a Storage tab. I believe that is the tab that will allow me to browse my project files. How do I enable it?

This is my actual project structure:

Answer 1

The Firefox DevTools don't have a panel that shows all files at one place the way the Chrome DevTools do it. Though there are different specialized panels showing you the same info. E.g. the Style Editor shows you all CSS sources. The Network Monitor shows all requested files with focus on network request information.

The Debugger is meant to debug JavaScript. So, it only displays JavaScript sources.

The Storage panel is enabled by default in newer versions of the Firefox DevTools. To enable the Storage panel in older versions of Firefox you need to switch to the settings and click the checkbox besides Storage:

Though the purpose of the Storage panel is to display storages like cookies, the IndexedDB, the local and session storage. It does not display files.