첫번째 질문

Footer 컴포넌트의 후손 엘리먼트로 시멘틱 엘리먼트 footer가 있어야 합니다.
시멘틱 엘리먼트 <footer>가 포함되어야 합니다.

const Footer = () => {
  return <div>
    <footer></footer>
  </div>;
};
1. 이때는 왜 세미클론으로 마무리를 해주는지 궁금하다.
2. <div><footer></footer></div>; 이렇게 해도 통과 되는건가? -> 된다

두번째 질문

  const isParkHacker = tweet.username === 'parkhacker'
        const tweetUserNameClass = isParkHacker
          ? 'tweet__username tweet__username--purple'
          : 'tweet__username';

<span className={tweetUserNameClass}>{tweet.username}</span>
{}안에 변수를 넣어준것이 이해가 잘 안되는데 지금 드는 생각은 JSX문법과 관련되어있는 것같다.
처음에 tweet.username이 'parkhacker'와 같다라는 값을 isParkHacker에 할당해줬고 , 그 값을 tweetUserNameClass에 할당해줬다.  
그러면 값이 참이면 'tweet__username tweet__username--purple'className에 
접근해서 보라색으로 출력되고 아니면 'tweet__username'으로 가서 
그냥 username만 나오는것 같다. 근데 여기선 ''안에 넣어줬고 .. 문법이 좀 헷갈리는 것 같다. 
그리고 <span>{tweet.username}</span>에서 가운데 {tweet.username}이걸 왜 넣어줬는지 좀 모르겠다.