{"id":3778,"date":"2023-07-18T01:26:47","date_gmt":"2023-07-18T01:26:47","guid":{"rendered":"https:\/\/nmi.cool\/advweb\/?page_id=3778"},"modified":"2026-03-02T02:13:53","modified_gmt":"2026-03-02T02:13:53","slug":"project-corona-blues","status":"publish","type":"page","link":"https:\/\/nmi.cool\/advweb\/unit-two-javascript\/week-six\/project-corona-blues\/","title":{"rendered":"Project 4: Mini Blog"},"content":{"rendered":"\n<p>Download\u00a0<a href=\"https:\/\/nmi.cool\/advweb\/wp-content\/uploads\/sites\/12\/2026\/03\/Project4-Start.zip\" data-type=\"attachment\" data-id=\"4792\">Project4-Start.zip<\/a>, unzip it, open project4-start.html and project4-start.js with VS Code, and take a look. As you can see, project4-start.html file is connected to project4-start.js inside of the js folder, which contains a great big array of objects with information about news articles I collected about the latest trends.<\/p>\n\n\n\n<p>Each object contains the title of the article, a link to an image (in most cases), the url of the article, a description of its content and more.&nbsp; Your job is to use Javascript to populate project4-start.html with the information from each of those objects.<\/p>\n\n\n\n<p>Specifically, the document that you ultimately create needs the following<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>The title of each article<\/li>\n\n\n\n<li>A link to the article that wraps around the title<\/li>\n\n\n\n<li>The description<\/li>\n\n\n\n<li>An image that is limited via css to a height of 300px (some are much larger; your job is to shrink them)<\/li>\n\n\n\n<li>Fairly nice formatting. <\/li>\n<\/ol>\n\n\n\n<p><\/p>\n\n\n\n<p>To help you get started, here&#8217;s how to get the linked article title to show up in a &lt;div&gt; with an id of #articles:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>let container = document.getElementById(\"articles\");\n\narticle.forEach(function(articleItem) {\n    let title = document.createElement(\"h2\");\n    let link = document.createElement(\"a\");\n    link.href = articleItem.link;\n    link.target = \"_blank\";\n    link.textContent = articleItem.title;\n    title.appendChild(link);\n    container.appendChild(title);<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\">Rubric<\/h2>\n\n\n\n<p><strong>A-Level Work<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Exceptional quality, originality, and\/or insight<\/li>\n\n\n\n<li>Fully meets criteria with no significant errors<\/li>\n\n\n\n<li>Polished, organized, and professional<\/li>\n<\/ul>\n\n\n\n<p><strong>B-Level Work<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Meets all criteria with minor issues<\/li>\n\n\n\n<li>Solid understanding and effort<\/li>\n\n\n\n<li>Good organization and presentation<\/li>\n<\/ul>\n\n\n\n<p><strong>C-Level Work<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Meets most criteria; notable gaps<\/li>\n\n\n\n<li>Basic or inconsistent understanding<\/li>\n\n\n\n<li>Organization or clarity needs work<\/li>\n<\/ul>\n\n\n\n<p><strong>Below C-Level (Not Passing)<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Disorganized, incomplete, or poor quality<\/li>\n\n\n\n<li>Meets few or no criteria; major errors or omissions<\/li>\n\n\n\n<li>Limited or no understanding and effort<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Download\u00a0Project4-Start.zip, unzip it, open project4-start.html and project4-start.js with VS Code, and take a look. As you can see, project4-start.html file is connected to project4-start.js inside of the js folder, which contains a great big array of objects with information about news articles I collected about the latest trends. Each object contains the title of the &hellip; <a href=\"https:\/\/nmi.cool\/advweb\/unit-two-javascript\/week-six\/project-corona-blues\/\" class=\"more-link\">Continue reading <span class=\"screen-reader-text\">Project 4: Mini Blog<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":3694,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3778","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/pages\/3778","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/comments?post=3778"}],"version-history":[{"count":12,"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/pages\/3778\/revisions"}],"predecessor-version":[{"id":4793,"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/pages\/3778\/revisions\/4793"}],"up":[{"embeddable":true,"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/pages\/3694"}],"wp:attachment":[{"href":"https:\/\/nmi.cool\/advweb\/wp-json\/wp\/v2\/media?parent=3778"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}