Create collapsible menu for landing page

[rsyoh-97]

@zstumgoren I have a confirmation/clarification question about using "fetch" for JSON file and returning the value of the JSON:

It seems that "fetch" returns a promise – to return the actual value of the JSON, would it be correct for me to use "async" and "await" keywords? I've been looking at .

Right now I have a snippet that looks like this:

async function loadJSON() {
    let requestJSON = new Request('county-data/json/json_for_search.json');
    let fetchResponse = await fetch(requestJSON);
    let jsonValue = await fetchResponse.json();
    let resolvedJSONValue = Promise.resolve(jsonValue);
    console.log(resolvedJSONValue.typeof);
}

This seems to be able to fetch the JSON file, but I get "undefined" type for resolvedJSONValue. Is this approach correct? And if so, how do I call the returned value in a different function, when I try to search for certain keys within the JSON when a user clicks on the button?

[rsyoh-97]

@zstumgoren in the "collapsible-troubleshoot" branch: line 27 to 44 (basically everything within the script tag) in index.html

I made comments within the index.html to indicate the specific issues I had as well – please let me know if anything's confusing!

[zstumgoren]

@rsyoh-97 One problem that is preventing me from fully debugging is that the JSON file the code is requesting ('county-data/json/json_for_search.json') is not stored in the repository. It appears @miguelito34 may have intentionally gitignored all files in these data directories except for the .gitkeep? If you can remove or update the gitignore and commit the JSON file to the repository, I can help debug.

Generally, you'll need to commit all supporting JSON files to the repo for the purposes of serving your app from GitHub Pages, so you'll need to loosen the restrictions on the gitignore and ensure those supporting JSON files are committed and pushed.

[miguelito34]

@zstumgoren just updated the gitignore file, so the JSON should be available within the repo now.

As context: I'd originally set up a few .gitignore/.gitkeep files to ensure folders were pushed to the repo without also pushing individual data files (like the individual html pages or the LAU data csv's), since we can just generate the data locally by running the data pipeline, which I believe is good enough for the sake up firing up a local web server and testing the site. I had assumed a lot of the data (JSON excluded) wouldn't need to live in the online repo until we actually wanted to serve the site up via Github Pages, but let me know what the best approach is.

[zstumgoren]

@miguelito34 Yep, @rsyoh-97 mentioned that you had written some scripts to generate the data in those directories, which is a very reasonable thing to do during the development process. As you get closer to the point of publication, you'll need to make sure all underlying JSON assets are committed to the expected locations. Sounds like that's the general plan of attack. If so, sounds fine to me!

[rsyoh-97]

@zstumgoren sorry for this Sunday morning help ticket – I just pushed my code to "collapsible-troubleshoot" again, and I'm mainly struggling with lines 98 – 106. Could you provide a quick feedback on whether what I'm doing is directionally correct or completely off? Thanks so much!

[zstumgoren]

@rsyoh-97 I just pushed some comments/suggested code on index.html. We can discuss during class if you still have questions