요즘 대부분 서비스에서 사용자 경험 향상을 위해 ‘한 번의 클릭으로 특정 텍스트를 클립보드로 복사’ 기능을 지원합니다.
클립보드 복사 기능을 구현하는 데에는 대표적으로 ‘document.execCommand’ 와 ‘Navigator.Cipboard API’ 두 가지 방법이 존재합니다. ‘execCommand’ 메서드는 이전에 널리 사용되던 기술이나 현재는 Deprecated(비권장) 상태에 있습니다. 반면 Cipboard API는 execCommand를 대체하기 위해 디자인 되었으며 대신 Internet Explorer를 지원하지 않으며, Safari 13.1 버전부터는 Https 환경에서만 작동합니다.
이처럼 각 기술마다 지원하는 브라우저와 환경이 다르므로 이들의 한계와 호환성 문제를 고려하여 클립보드 복사 기능을 구현해야 합니다. 이런 복잡한 고려사항을 줄이고, 개발자가 더욱 쉽고 안정적으로 클립보드 복사 기능을 구현할 수 있도록 도와주는 라이브러리가 바로 ‘react-copy-to-clipboard’ 입니다.
'react-copy-to-clipboard` 라이브러리는 'document.execCommand' 메서드를 기본적으로 사용하지만, 해당 API 실패시 여러 폴백 메커니즘을 통해 다양한 환경에서 클립보드 복사 기능을 지원하려고 노력합니다.
따라서 위에서 언급된 기술적 한계와 호환성 문제를 크게 신경 쓰지 않고도, 클립보드 복사 기능을 손쉽게 개발할수 있습니다. 또한 코드의 복잡성을 줄이고 가독성을 향상시켜, 개발자가 더욱 직관적이고 전문적인 개발 환경에서 작업할 수 있게 도와줍니다.
https://www.npmjs.com/package/react-copy-to-clipboard