[Others] 나만 몰랐던 UI 편리하게 구현하는 도구

유형: study/Others

---

계기

시간이 부족해! 남이 만든 아이콘이랑 CSS 컴포넌트 사용할거야! ... React Icons, MUI

Figma로 만든 화면에 margin과 pedding에 대한 정확한 수치가 없다면? ... Alt 단축키

내 기기와 개발 대상 기기의 화면 사이즈가 다르다면? ... Chrome개발자 모드 

---

내용

1) React Icons, MUI

https://react-icons.github.io/react-icons/

React Icons

https://mui.com/

MUI: The React component library you always wanted

 

자세한 사용법은 이후 필요 시, 추가할 예정

 

2) Figma: Alt 단축키 사용하기
 - 기준 컴포넌트를 클릭한다

 - Alt + 상대 컴포넌트를 클릭한다

 - 기준 컴포넌트와 상대 컴포넌트의 거리를 알 수 있따!

 

 

3) Chrome 개발자 모드 (F12)

 

← 이거 누르기

 

← 여기서 가로 * 세로 조정하기

 

 

 

 

 

 

---