DAY 52 <Tagged Template Literal>

Template Literal

동적인 문자열을 처리할 때 사용하며 `Hi I am ${userName}`. 의 형태로 사용된다.

Tagged Template Literals

Tagged Template Literals이란 템플릿 리터럴의 발전된 형태로써, 함수 형태로 사용할 수 있다.

React Styled-compoenets Tagged Template Literals

React의 Styled-components 안에서는 tagged template literal 문법을 사용할 수 있다.

이번 리액트 네이티브의 프로젝트에서도 tagged template literal을 사용해서 다른 팀원분이 만드어주신 inline style category color 함수를 styled-compoenents로 만들어줬다.

이렇게 카드 리스트 안에 있던 함수를 category라는 props로 내려주어 카드 styled-compoenet 안에서 사용할 수 있게 만들어 주었다.

결과적으론 확인해봤을 때 전체적으로 색상이 다르게 잘 불러와졌고 쳐음 사용해본 tagged template literals 어렵지 않게 사용할 수 있을 것 같다.