반딧불 수업 과제!
!
수입 반응하다 에서 ‘반응’;
수입 ‘./App.css’;
수입 ‘./global-style.css’;
수입 { 더미 트윗 } 에서 ‘./정적/dummyData’;
// !
위의 코드는 변경하지 않습니다.
위의 코드는 변경하지 않습니다.
콘솔.규약(더미 트윗); // 개발 단계에서 사용되는 더미 데이터.
끊임없는 사이드바 =() => {
돌려 주다 (
<부분 클래스 이름=“사이드바”>
<나 클래스 이름=‘far fa 주석 점’>나> // 원하는 아이콘 가져오기(단, 가져오려는 아이콘에 대한 링크가 HTML 헤드에 있어야 함)
부분>
);
};
'추천 관련글,
끊임없는 스위치 =() => {
돌려 주다 (
<다양한 클래스 이름=“tweetForm__input”>
<다양한 클래스 이름=“tweetForm__inputWrapper”>
<다양한 클래스 이름=“tweetForm__count” 역할=“상태”>
전체적으로: {더미 트윗.길이} // dummyTweets 번호는 객체의 배열입니다.
길이는 숫자입니다.
길이는 숫자입니다.
다양한>
다양한>
다양한>
);
};
끊임없는 보행인 =() => {
돌려 주다 (
<보행인> // 바닥글의 div를 시맨틱 요소로 변환해야 함
<그림 ID=“심벌 마크” 원천={`${소송 절차.아마도.PUBLIC_URL}/codestates-logo.png`} />
저작권 @ 2022 코드 상태
보행인>
);
};
// TODO: 바닥글 기능 구성 요소를 만듭니다.
바닥글 의미 요소가 포함되어야 합니다.
바닥글 의미 요소가 포함되어야 합니다.
끊임없는 트윗 =() => {
돌려 주다 (
<울 클래스 이름=“트위터”>
{더미 트윗.지도((트위터) => {
끊임없는 isParkHacker = 트위터.사용자 이름 === ‘주차 해커’ // ‘parkhacker’와 사용자 이름이 같은 변수 선언
끊임없는 트윗 사용자 이름 클래스 = isParkHacker // 삼항 연산자 사용, 같으면 보라색, 다르면 그대로
? ‘tweet__username tweet__username – 보라색’
: ‘tweet_username’;
돌려 주다 (
<왼쪽 클래스 이름=“트위터” 단추={트위터.ID}>
<다양한 클래스 이름=“트윗_프로필”>
<그림 원천 = {트위터.그림}/> // 트윗 객체에서 이미지 속성에 대한 속성 값을 가져옵니다.
다양한>
<다양한 클래스 이름=“트윗_콘텐츠”>
<다양한 클래스 이름=“tweet__userInfo”>
<기간 클래스 이름={트윗 사용자 이름 클래스}>{트위터.사용자 이름}기간> // 위 변수와 삼항 연산자로 적용된 사용자 이름
<기간 클래스 이름=‘tweet__createdAt’>{트위터.만든}기간> // Tweet 객체에서 createdAt 속성에 대한 속성 값을 가져옵니다.
다양한>
<다양한 클래스 이름=“트윗__메시지”>
{트위터.내용물} // 트윗 객체에서 content 속성에 대한 속성 값을 가져옵니다.
다양한>
다양한>
왼쪽>
);
})}
울>
);
};
끊임없는 형질 =() => {
돌려 주다 (
<부분 클래스 이름=“형질”>
<다양한 클래스 이름=“tweetForm__container”>
<다양한 클래스 이름=“tweetForm__wrapper”>
<다양한 클래스 이름=“tweetForm__프로필”>다양한>
<스위치 />
다양한>
다양한>
<트윗 />
<보행인/> // 위에서 만든 바닥글 컴포넌트 가져오기
부분>
);
};
끊임없는 아파트 =() => {
돌려 주다 (
<다양한 클래스 이름=“애플리케이션”>
<주로>
<사이드바/>// 위에서 생성한 사이드바 컴포넌트 가져오기
<형질 />
주로>
다양한>
);
};
// !
다음 코드는 변경하지 않습니다.
다음 코드는 변경하지 않습니다.
내보내다 { 아파트, 사이드바, 스위치, 트윗, 형질, 보행인 };
종합퀴즈 끝나면 2번은 틀려요 ㅠㅠ