Blog II: Feedback

Great job on this submission!

This feedback is not necessarily comprehensive but should give you insight into at least one aspect of the code that could be praised or enhanced.

Article Styling

Your styles are a small departure from the mockup. I don’t care so much about fonts and colors; the Cool Pics I requirements allow you to choose your own, so I won’t ding you for those. I was looking at things like borders, correct text alignment (right for article metadata and the menu), centered images (book covers), “Read More…” links, pages that span too wide/not wide enough, stacked content, etc.

This critique is nit-picky, I know, but the grading criteria do call for precision.

Beyond that, the rest looks great!

JavaScript Integration

You’re dynamically generating and rendering blog posts from the source articles array. Great job!

Book-Blog/blog.js

Lines 40 to 63 in 85ce10f

    
           function renderArticles() { 
        
             const articlesSection = document.querySelector(".articles"); 
        
             articlesSection.innerHTML = ""; // Clear any hardcoded articles 
        
             articles.forEach(article => { 
        
               const articleElement = document.createElement("article"); 
        
               articleElement.innerHTML = ` 
        
                 <div class="details"> 
        
                   <p class="date"><time>${article.date}</time></p> 
        
                   <p>${article.genre}</p> 
        
                   <p class="author">Recommended Ages: ${article.ages}</p> 
        
                 </div> 
        
                 <div class="content"> 
        
                   <h2>${article.title}</h2> 
        
                   <img src="${article.imgSrc}" alt="${article.imgAlt}" /> 
        
                   <p>${article.description}</p> 
        
                   <p>Rating: ${article.stars}</p> 
        
                 </div> 
        
               `; 
        
               articlesSection.appendChild(articleElement); 
        
             }); 
        
           } 
        
           renderArticles();

Cleanup and New Post Addition

Great job cleaning up old code from the .html. Your logic will have no trouble handling additional articles that might be added to the source array. Nice work!

Data Modification and Addition

You added at least one additional article to your JavaScript file

Navigation Menu

Repository navigation

Blog II: Feedback #2

Article Styling

JavaScript Integration

Cleanup and New Post Addition

Data Modification and Addition

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

	function renderArticles() {
	const articlesSection = document.querySelector(".articles");
	articlesSection.innerHTML = ""; // Clear any hardcoded articles

	articles.forEach(article => {
	const articleElement = document.createElement("article");
	articleElement.innerHTML = `
	<div class="details">
	<p class="date"><time>${article.date}</time></p>
	<p>${article.genre}</p>
	<p class="author">Recommended Ages: ${article.ages}</p>
	</div>
	<div class="content">
	<h2>${article.title}</h2>
	<img src="${article.imgSrc}" alt="${article.imgAlt}" />
	<p>${article.description}</p>
	<p>Rating: ${article.stars}</p>
	</div>
	`;
	articlesSection.appendChild(articleElement);
	});
	}

	renderArticles();

Blog II: Feedback #2

Description

Article Styling

JavaScript Integration

Cleanup and New Post Addition

Data Modification and Addition

Activity

Metadata

Metadata

Assignees

Labels

Projects

Milestone

Relationships

Development

Issue actions