delete every rows in comment table from TutorialDB

and add a username (.model/Comments)

Caution

• i should stopped server first. ^c
• 1. delete all comments in Comments table
• 2. drop the Comment table
• 3. and edit code in Comments.js
  • add username field
• 4. restart server npm start
• 5. check DB tables

AuthMiddleware.js

• for access the username ,
  • in try ,
    • const username = validToken.username
      • this is the payload the data that we stored in out token

• why is that important because since this middleware is executed in every request, i can create request variables instead of this that are accessible in every single request which i pass middleware.

• so if i want to create a user some sort of variable that stores the user infomation, i can say req.user = "hunsman"
  • i can technically access this in every single endpoint or every single request which i pass this middleware.(validToken)
    

Comments.js

• when i want to access the username whenever we make any requests, all i have to do is i have to come server/routes/Comments.js and in post request add codes
  const username = req.user.username. Because req.user now it's an object containing the username and the id.(validtoken is exactly req.user)

• i used to just send comment but since i adding a new field to this object that i want to add to my TutorialDB, i dont want to pass it as just a single object anymore.

• so adding the field username to the comment object and set it equal to username comment.username = username

• comment object now has a username field which is equal to the useranme that i got from the authenticated user.

• and now when i pass this it should create the comment in my TutorialDB with the username for the user who is logged in.

when i create comment

first comment is former comment , second one is comment after edit codes.

so first one doesnt have username. Besides, second one has username.

for display username at Comment section

Post.js (Client)

• whenever i am displaying comments which is line 66 in Post.js , list mapping over here. map through every single element and i get the comment the specific comment as an object.

• so all i have to do if i want to add the username, edit code here.

• when i edit like this,

• there is username

Problem 1

• when i added third comment, it didnt display a username

• but when i refreshed the page, it worked.
  

• why is happening? because of optimistic rendering. so if i recall this isnt being filled by the database. this is something that i add when i write my comment.but if i refresh the page, the username will be here.

• how do i fix this?

• the reason why that's happening is here(Post.js line 33) when i actually have the comment done, here just adding the comment to my page. but i dont have the username with me.

• technically i just have to grab the username from response.
  because incomments route in server folder it just returning the full comment that i created.
  

res.json(comment) -> this includes the comment body and it also includes the username that i added.

• so if i want to have access to that username, i can grab it from the response.

• just add a username field to the comment to add object

Post.js (Client)

• username: response.data.username add this
  

result

• and now if i refresh the page and just try to add new comment, it has username automatically.