111824 til 배포

트위터 클론 코딩 최종 

 

드디어 

 

배포하기 완료 ... 

 

배포하고 나서 , post tweet form 이 뜨지 않아서 

 

다시 코드를 수정 했다 ..

 

 

https://tweet-3e265.web.app/ 

TWEET

 

 

 

 

**님 께서 ,

 

 

닉네임 변경도 있었으면 좋겠다.

게시글 작성시간이 나타났으면 좋겠다.

게시글 수정도 있었다 update 구현해달라

이미지 트위터처럼 4개까지 업로드 할 수 있게 해달라

 

라고 하셔서 추가로 또 작업을 하는 중이다 

 

timestamp 로 

 

포스트 작성시 시간이 나오게 하고싶어서 

 

const doc = await addDoc(collection(db, "tweets"), {

tweet,

createdAt: Date.now(),

username: user.displayName || "Anonymous",

userId: user.uid,

});

 

 

createdAt 을 Date.now() → serverTimestamp()로 수정.

 

createdAt 2024년 11월 18일 오후 5시 8분 51초 UTC+9 (타임스탬프) tweet "시간 나오게해주라" (문자열) userId "3C9sBwWLsDOEEdqI3CGPakGJoIw2" (문자열) username "김춘자"

이렇게 바꾸고   firebasedata base  에서 나오긴 하는데 

 

포스트에스는 나오지 않는 것을 확인 

 

다시 수정을 해야한다는 것을 확인 .

 

gpt 를 검색해도 잘 모르겠어서 

 

튜터님께 질문 하러갔다옴 

 

export default function Tweet({ username, photo, tweet, userId, id, createdAt }: ITweet) {

console.log(createdAt);

const date = new Date(createdAt).toLocaleString(); // 타임스탬프를 Date 객체로 변환

 

new date 에서 tolocalstring();을 추가 

 

콜롬 을 추가해서 날짜를 추가 . 

 

 

return (

<Wrapper>

<Column>

<Username>{username}</Username>

<Payload>{tweet}</Payload>

{user?.uid === userId ? (

<DeleteButton onClick={onDelete}>Delete</DeleteButton>

) : null}

</Column>

<Column>{photo ? <Photo src={photo} /> : null}</Column>

<Column>{date}</Column>

</Wrapper>

);

}

 

 

날짜가 나오는것을 확인 

 

css로 오른쪽으로 가게 수정 해야함