AI‐11 - Code-the-Dream-School/intro-to-programming-2025 GitHub Wiki

  1. Create a folder called js at the same level as your index.html, readme.md, and your css folder.
  2. Inside the js folder, create a JavaScript file called index.js.

On the index.html file:

  1. Before the closing </body> tag, insert a <script> element with a src attribute that specifies the relative path to your JavaScript file (i.e. js/index.js).
  2. On the Skills <section> element: After the <h2> element, add an empty unordered list <ul> element.

On the index.css file:

  1. Use flexbox or grid to organize and adjust the layout of your list of skills. Remember to include any adjustments in your media query sections.

On the index.js file:

  1. Using DOM manipulation, add a footer child element to your index.html.
  2. Create a variable named today and assign it a new date object.
  3. Create a variable named thisYear and assign it the current year from your date object. Use a method to do this.
  4. Create a variable named footer and assign it the footer element by using DOM Selection to select the element from the DOM.
  5. Create a variable named copyright and use it to create a new paragraph <p> element.
  6. Set the inner HTML of your copyright element to display your name and the current year. Use the copyright variable and the thisYear variable from earlier.
  7. Append the copyright element to the footer using DOM Manipulation.
  8. As a stretch goal (optional): Use unicode to also include the copyright symbol ( © ) in your footer content.
  9. List your technical skills by creating an Array of String values and store it in a variable named skills.
  10. Create a variable named skillsSection and use DOM Selection to select the skills section by id.
  11. Create a variable named skillsList and use DOM Selection to query the skillsSection (instead of the entire document) to select the <ul> element you created earlier in this assignment.
  12. Create a for loop to iterate over your skills Array.
  13. Inside the loop, create a variable named skill to create a new list item <li> element.
  14. Still inside the loop, use the skill variable to set the inner text to the current Array element.
  15. Still inside the loop, append the skill element to the skillsList element.
⚠️ **GitHub.com Fallback** ⚠️