Merge branch 'main' of github.com:turingschool/curriculum-site

module1/projects/dmv/submission.md

@@ -9,9 +9,7 @@ _[Back to The DMV Home](./index)_
 When you are finished, make sure your code is pushed up to your repository on Github. All the code for your submission should be on the main branch. Then, follow these steps to submit a Pull Request to the turingschool-examples repository:
 
 1. Go to your projects Github page
-1. Click the "New pull request" button ![Imgur](https://i.imgur.com/ETh0XEY.png)
-1. Make sure the PR is from your main to the turingschool-examples main ![Imgur](https://i.imgur.com/EgWFj2U.png)
+1. Click the "Contribute" button and click "Open Pull Request"![Create Pull Request from your repository](./assets/create%20pull%20request%201.png)
+1. Make sure the PR is from your main to the turingschool-examples main
+1. Put your name as the title of the PR ![Submit Pull Request](./assets/create%20pull%20request%202.png)
 1. Click "Create pull request"
-1. Put your name as the title of the PR ![Imgur](https://i.imgur.com/Ir9i5G2.png)
-1. Click "Create pull request"
-1. Fill out the linked form in the Project Due Date calendar event including a link to your PR.

module1/projects/index.md

@@ -13,7 +13,7 @@ The project specs will be linked below as each project is assigned.
 <!-- Week 1-2 (Solo): [War or Peace](./war_or_peace/) -->
 Week 1-2 (Solo): [Flash Cards](./flashcards/)  
 <!-- Week 2-3 (Solo): [DMV](./dmv/)  -->
-Week 2-3 (Solo): TBD  
+Week 2-3 (Solo): [DMV](./dmv/)  
 <!-- Option to add more advanced option with Connect Four as other pair project -->
 <!-- Week 3-4 (Paired): [Battleship](./battleship/) -->
 Week 3-4 (Paired): TBD  

module2/projects/coupon-codes/back_end_requirements.md

@@ -37,7 +37,9 @@ rails db:migrate
 
 Below is the expected JSON response for each request. We have also outlined a few examples of Sad Paths you may consider adding in. In your project, you should take time to implement at least 2 sad paths total, but you are not limited to the examples we provide.
 
-<section class="dropdown">
+
+
+
 ### 1. Merchant Coupon Show
 
 Returns a specific coupon and shows a count of how many times that coupon has been used.

module2/projects/hang_in_there/index.md

@@ -140,7 +140,7 @@ Result after clicking Show My Poster button:
 - On the new poster form view, users should be able to fill out the three input fields and then hit the Show My Poster button
   - _Hint:
 Notice something weird happening when you click the button to submit the form? Try googling `event.preventDefault()`!_
-<p style="color: red">NOTE: Work through these bullet points in order. They'll have you update the data model first, then use that updated data model to change what is showing to the user.</p>
+<p style="color: red">NOTE: Work through these bullet points in order. They'll have you update the data model first, then ***use*** that updated data model to change what is showing to the user on the DOM. </p>
 - When the Show My Poster button is clicked, several things will happen:
   - First, use the values from the inputs to create a new, unique poster object and save it as the value of the `currentPoster` global variable (part of your data model)
   - Save the submitted data into the respective arrays (image URL into the images array, etc - all part of your data model) so that future random posters can use the user-created data
@@ -326,11 +326,28 @@ _Note: Don't worry about the layout or styling of your unmotivational posters qu
 Our product team realizes that some users will love the Unmotivational Posters feature while others might feel like it harshes the positive vibe of the application. They'd like us to add functionality so that users will be able to delete an unmotivational poster by double clicking on it.
 
 - From the unmotivational posters view, if a user double clicks a poster, it will be deleted
-  -  Users should be able to double click _anywhere_ on the poster to delete it - on the image, text or background.
-  -  HTML `onclick` attributes should not be used in any HTML code - all functionality should be through JavaScript.  
-  -  The poster should be removed from your cleaned unmotivational posters data set **_and_** should no longer be displayed on the DOM. 
   -  If the user navigates away from the Unmotivational Posters view after deleting some posters, those posters should still be gone when they navigate back to that view.  _Note: However, because we aren't implementing local storage, if a user refreshes the app, everything will be reset including deleted unmotivational posters and saved motivational posters. That's ok._
 
+<section class="note">
+### Do's and Dont's
+
+In FE development, the approach we want to follow is updating the data model (like your array) first, then ***using*** the updated data model to update what the user can see on the DOM.  
+
+You'll need to follow the same approach we used in the [DOM Manipulation II lesson](https://curriculum.turing.edu/module2/lessons/js_dom_manipulation_ii) to accomplish this delete functionality.  You'll add your event listener to the entire parent container, then use logic to isolate the specific poster that was clicked on, remove it from the data model, ***then*** use the updated data model to change what is showing on the DOM. 
+
+Don't: 
+- Don't use HTML `onclick` attributes in any code - all functionality should be through JavaScript.  
+- Don't use `.remove()` to forcibly remove the deleted poster off the DOM.
+- Don't add eventListeners to each unmotivational poster as you render them.  All eventListeners should be in one section toward the top of your file, not included in dynamically added elements. Use the approach outlined above instead.
+- Don't use querySelector to grab the poster to be deleted.  All querySelectors should be in one section at the top of your file, not sprinkled throughout your code in functions. 
+
+Do:
+- Ensure users can double click _anywhere_ on the poster to delete it - on the image, text or background.  
+  - Look into `.closest()` *hint, hint*
+- Ensure the poster is removed from your cleaned unmotivational posters data array first, **_and then_** update the DOM so that deleted poster is longer displayed.
+- Remember that you should already have a function whose job it is to simply render all the cleaned unmotivational posters from your array onto the DOM. And the point of functions is to be reusable. *hint, hint*
+</section>
+
 
 </section>
 

module2/projects/index.md

@@ -10,8 +10,8 @@ The project specs will be linked below as each project is assigned.
 
 <!-- - Week 1-2 (FE Solo): TBA -->
 - Week 1-2 (FE Solo): [Hang In There (FE)](./hang_in_there)
-- Week 3 (Paired): TBA
-<!-- - Week 3 (Paired): [Hang In There API](./hang_in_there_api/) -->
+<!-- - Week 3 (Paired): TBA -->
+- Week 3 (Paired): [Hang In There API](./hang_in_there_api/)
 - Week 4-5 (Group): TBA
 <!-- - Week 4-5 (Group): [Little Shop](./little_shop/) -->
 - Week 5-6 (Final Solo): TBA

module3/lessons/network_requests.md

@@ -69,7 +69,7 @@ Using the [fetch API docs](https://developer.mozilla.org/en-US/docs/Web/API/Fetc
 * What does `fetch` always return?  If the term is new to you, read further on what it is.
 </section>
 
-<section class="answer">
+<section class="dropdown">
 ### Key Takeaways  
 
 - The `fetch()` method takes one mandatory argument, the path to the resource you want to fetch.
@@ -168,12 +168,12 @@ fetch('some_url')
 ```
 
 Let's think about these questions:  
-<section class="answer">
+<section class="dropdown">
 ### Why doesn't data in line 4 refer to the same data in line 3?
 
 Explanation: Parameters are scoped to their function, so you cannot reference a parameter from one function in another. Each callback function defines their own scope (i.e. creates their own execution context).
 </section>
-<section class="answer">
+<section class="dropdown">
 ### Why is data in line 4 undefined?
 
 Explanation: `.then` always returns a Promise, and when that promise resolves, it evaluates to whatever the callback returns and hands it off to the next `.then`. The callback function on line 3 does not return anything, so `undefined` is the value handed off to the `.then` in line 4, stored in the `data` parameter.