Issue with Code Project 1

[HermanBide]

PROJECT ISSUE TICKET

Copy and paste the raw MD code of this template, then replace the quote blocks with your detailed, clear descriptions.

const response = await axios.get(`https://api.spoonacular.com/mealplanner/generate?apiKey=d99bae42f1e440d599f4957c65df8ea5&targetCaleries=${calories}&diet=${diet}&exclude=${allergens}`);

not sure how to match user option values to api values and return object with similar value to output

const mealImg = document.createElement('img');
            mealImg.src = day.meals[1].sourceUrl;
            mealImg.innerText = day.meals[1].Url;

            const mealTitleEl = document.createElement('div');
            mealTitleEl.innerText = day.meals[1].title;

            const nutrientEl = document.createElement('div');
            nutrientEl.innerText = day.nutrients;

trying to get image from sourceUrl and display

Unexpected Behavior

trying to get image from sourceUrl and display as well as nutrients

Expected Behavior

addEventlistner should generate input values from form

Reproduce the Error

Describe the steps we can take to reproduce the error, i.e.:

1. Clone this repo.
2. Run `npm start`.
3. Navigate to the landing page.
4. Click on _____, which should return the API data set.
5. Scroll down to _____.
6. See the subsequent error in the console.

Documentation

Include the exact error message, and if helpful, any supplemental documentation, such as screen catures.

Copy and paste the contents of the error message here.
Uncaught TypeError: getMeal is null

Attempted Resolution

If you haven't already, Google your error message now. See if those error messages return an answer. Include at least 2 resources you've tried to consult such as walk-throughs, stack overflow articles, and other discussion threads related to your error.

https://developer.mozilla.org/en-US/docs/Web/API/Element/matches

2. Link 2