# U2LA1 Mini Project: JavaScript Essentials

### Teacher Notes

This vanilla javascript lab is located exclusively in the [`script.js`](https://github.com/nycdoe-cs4all/interactive-web/blob/main/unit-2-intro-to-dom-manipulation-basics/U2LAB1/U2LAB1-Starter/script.js) ([repl.it version](https://replit.com/@qrtnycs4all/U2LA1-Mini-Project-Starter-Code#index.html)) is a series of challenges for students to get familiar with javascript essential topics from variable arithmetics to functions with conditional statements. The extensions are included but not labeled at the bottom of the `script.js`. They require researching the Pythagorean theorem formula and researching recursive functions to be completed.

**Students should utilize the Starter Code (**[**repl.it**](https://replit.com/@qrtnycs4all/U2LA1-Mini-Project-Starter-Code) **|** [**github**](https://github.com/nycdoe-cs4all/interactive-web/tree/main/unit-2-intro-to-dom-manipulation-basics/U2LAB1/U2LAB1-Starter)**) for this project.** 

### Prompt

For this lab, put together what you know so far about javascript and try the challenges in the ). Use the resources below under [Extra Help](#extra-help) if you get stuck. When the time's up come back here for some reflection questions.

### Exemplar (teacher's view only)

Take a look at [this finished example](https://github.com/nycdoe-cs4all/interactive-web/tree/main/unit-2-intro-to-dom-manipulation-basics/U2LAB1/U2LAB1-Exemplar) for the answer key to the javascript challenges.

### Culturally Responsive Best Practice

In the previous unit, students learned to build and add style to websites that they were, unfortunately, unable to interact with. Consider starting this unit by having students look for websites that they **can** interact with. Have them identify what is happening in their own words and why they enjoy interacting with the website they found. In this way, students can find something they can relate to that will demonstrate how vanilla javascript can potentially add value to the websites they build in the near future.

### Extra Help?

Use the following resources to see examples of how to implement the methods, functions and other concepts in the `script.js`:

* `Math.floor()`, `Math.sqrt()`, and [other Math methods](https://www.w3schools.com/js/js_math.asp).
* [String methods](https://www.w3schools.com/js/js_string_methods.asp)
* Converting to [Arrow functions](https://www.w3schools.com/js/js_arrow_function.asp)
* [Template Literals](https://www.w3schools.com/js/js_string_templates.asp) (aka Formatted Strings)
* [Recursive Functions](https://www.javascripttutorial.net/javascript-recursive-function/) \[Super Challenge]

**Reflection Questions:**

* What was the most challenging part of the lab? What was the part you're most proud of?
* What was one point in the challenges you got stuck? What did you do to unstick?
* Why might what you've learned today be useful for making websites in the future?


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://cs4all-icm.gitbook.io/js-the-interactive-web/unit-2-intro-to-dom-manipulation-basics/u2la1-mini-project-javascript-essentials.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.