[항해99] 4/7 React(3) TIL

< TIL >
1. immer

  • Immer 를 사용하면 우리가 상태를 업데이트 할 때, 불변성을 신경쓰지 않으면서 업데이트를 해주면 Immer 가 불변성 관리를 대신 해준다.

  • 그러나 immer를 사용하지 않는 코드가 성능적으로는 아주 조~금 더 빠르다!

2. rel 속성 - noreferrer, noopener, nofollow

  • HTML에서 a태그는 페이지(문서)와 페이지를 연결하는 역할을 한다.
    a태그의 rel 속성으로, a태그가 있는 페이지와 a태그의 href 속성으로 설정한 페이지가 어떤 관계인지 선언할 수 있다.

  • rel은 관계를 뜻하는 relationship. 웹 브라우저와 검색 엔진을 위한 속성이다. 사용자에게 미치는 영향은 거의 없다.

  • noreferrer, noopener, nofollow 등은 관계보다는 정책, 지침 성격이 강하다.

  • unfollow : 검색 엔진이 해당 링크를 크롤링하지 않을 수 있다.
    (ex. 로그인 페이지 링크)
    하지만 함정은 무시하고 검색을 진행할 수도 있다는 점.

<a href="/r/signon/login" rel="nofollow">로그인</a>
  • noreferrer : 링크를 클릭했을 때 HTTP 리퍼러 헤더(referer header)를 넘기지 않을 수 있다. (for 웹 브라우저)
    해당 요청이 어디에서 왔는지 알 수 없다.
<a href="https://www.google.com/chrome" rel="noreferrer">크롬 내려받기</a>
  • noopener : 보안을 위한 속성. target이 _blank인 링크를 클릭하면 새탭에서 페이지가 열린다. 이때 열린 쪽에서 window.opener 속성으로 window객체로 부분 접근이 가능하다.(보안 이슈) noopener를 사용하면 이를 막을 수 있다.
<a href="https://www.google.com/chrome" rel="noopener" target="_blank">크롬 내려받기</a>

< 회고 >

  • 이렇게 React에 대해 개념을 공부하고 개인 프로젝트를 진행해보는 3주의 시간이 지났다..! 벌써 3주가 지났다는 것이 정말 믿기지 않는다,,,😇
    배운 것도 많고 아직 부족한 부분도 많다고 느껴서 당장 내일부터 진행될 팀프로젝트가 걱정스럽지만ㅠㅠㅠ그래도 잘 할 수 있겠지!!!!!!!
  • 오랜만에 밖을 나가보았다...어느새 봄이었다...ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ
  • 아마 정말 힘들었을 이번주인데,,다들 고생 많으셨습니다,,👍
  • 내일부터의 진짜 프로젝트도 화이팅!!!!!!

좋은 웹페이지 즐겨찾기