London9-Lovelace-Boshra-Mahmoudi-Node-Week2 #273
Conversation
| </head> | ||
| <body> | ||
| <h1> | ||
| <h1 id ="heading"> |
There was a problem hiding this comment.
Remove the space between attribute name and equal operator
| Name: <input type="text" name="from" placeholder="Your Name" id ="name-id" value =""/> <br /> | ||
| Message: <input type="text" name="text" placeholder="The message..." id ="message-id" value =""/> |
There was a problem hiding this comment.
Name id attribute could be more meaningfully named in consistent manner. identifier-html control type The identifier could be the name attribute of the HTML control. so you may assign id attribute for the 1st input control as from-input and 2nd input control as text-input
|
|
||
| <div class="messages-containre" style="border:1px solid black"> | ||
| <p>all the messages</p> | ||
| <div id="message-containre" > |
| let formText = ""; | ||
|
|
||
| const fetchMessages = async() => { | ||
| const response = await fetch("http://localhost:3000/messages"); |
There was a problem hiding this comment.
use a const to store the API server host and port info. Avoid manually repeating the host info
| } | ||
|
|
||
| const fetchLatestMessages = async() => { | ||
| const response = await fetch("http://localhost:3000/messages/latest"); |
There was a problem hiding this comment.
Reference to API host and port info via a variable discussed above
| latestData.data.forEach(message => { | ||
| const textMessage=document.createElement("p"); | ||
| const fromMessage=document.createElement("h5"); | ||
| const deleteButton=document.createElement("button"); | ||
| const editButton=document.createElement("button") | ||
|
|
||
| textMessage.innerHTML=`${message.text}`; | ||
| fromMessage.innerHTML=`${message.from}`; | ||
| deleteButton.innerText='Delete' | ||
| editButton.innerText='Edit' | ||
| latestMessageContainer.appendChild(textMessage); | ||
| latestMessageContainer.appendChild(fromMessage); | ||
| latestMessageContainer.appendChild(deleteButton); | ||
| latestMessageContainer.appendChild(editButton); | ||
| }); |
There was a problem hiding this comment.
Code from line 17 to 31 repeated here. Try to factorised
| }); | ||
|
|
||
|
|
||
| app.listen(3000, () => { |
There was a problem hiding this comment.
Use a const to store the port number
2 participants
Volunteers: Are you marking this coursework? You can find a guide on how to mark this coursework in
HOW_TO_MARK.mdin the root of this repositoryYour Details
Homework Details
Notes
What did you find easy?
What did you find hard?
What do you still not understand?
Any other notes?