전체 글54 React에서 innerHTML을 !?!?! 결론부터 말하자면 아래 코드처럼 해주면된다. 아래 a를 각각 삽입해보면 아래 그림처럼 그냥 a변수만 출력하면 문자열 그래로 출력 되었는데 dangerouslySetInnerHTML를 사용하면 요소로 돔 트리에 추가도이었다. 하지만 이러면 XSS 공격에 취약하니 정신바짝 차리고 써야된다. 2023. 1. 24. Masonry layout(react) 벽돌을 쌓는 것처럼 레이아웃하는 방식을 말하는데 핀터레스트의 레이아웃이라고 보면 된다. 아래 그림은 핀터레스트의 사진이다.(얼굴 나온 사진은 가림) 위에 처럼 화면을 꾸며야할 부분이 생겨서 flex를 이용하여 적용해 보았다. 왼쪽은 코드 오른쪽은 결과 사진이다. 큰 박스가 SkillsContainer가 적용된 박스고 작은 박스들이 SkillsStack가 적용되었다고 보면 된다. 이렇게 하면 안 좋은 점이 max-height를 정해야줘야하고 행마다 채우는 형식이 아니라 열마다 채우는 형식이여서 많이 아쉽다. 그래서 react-masonry-css를 사용하기로 했다. yarn add react-masonry-css Masonry 컴포넌트를 불러와서 아래 코드처럼 만들고 Frontend {skillItems... 2023. 1. 23. 이전 1 ··· 11 12 13 14 다음
