유튜브와 함께한 리액트 학습

학습하며 알게된 리액트 지식을 정리한 글입니다.

react에서 jquery 사용하기

npm i jquery.cookie

• react에서는 import만 한다고 라이브러리를 사용할 수 있는 것이 아니라 따로 install 과정을 거쳐야한다. 이 과정이 없으면 오류 문자가 뜨면서 페이지가 실행되지 않는다.

react에서 CKEditor 4 사용하기

// CKEditor5 리액트 설치
npm install --save @ckeditor/ckeditor5-react

// CKEditor 에디터 테마 설치 ( 기호에 따라 선택하여 설치 )
npm install --save @ckeditor/ckeditor5-build-classic
npm install --save @ckeditor/ckeditor5-build-inline
npm install --save @ckeditor/ckeditor5-build-balloon
npm install --save @ckeditor/ckeditor5-build-balloon-block
npm install --save @ckeditor/ckeditor5-build-decoupled-document

[코드 출처] CKEditor5 + React 시작하기|작성자 지니용

• CKEditor4는 게시판을 만들 때 필요한 다양한 기능들을 담고 있는 라이브러리이다.

react에서 react-recaptcha 사용하기

npm i react-recaptcha-v3

• 이 라이브러리의 작동 원리는 테스트를 진행하고 토큰을 생성해줍니다. 이 토큰은 백엔드로 전달하고 백엔드에서 구글 api로 보내서 검증한다. 그러면 결과를 다시 클라이언트로 보내주는데 이용된다.
• 로봇인지 사람인지 확인하는 작업도 이 라이브러리의 역할이다.
• react-recaptcha 관련된 라이브러리들이 다양한데, 그 차이점의 아래의 페이지에서 정보를 얻을 수 있었다.

https://www.libtrends.info/npm-compare/react-captcha-vs-react-google-recaptcha-vs-react-recaptcha-vs-react-recaptcha-google-vs-react-recaptcha-v3-vs-recaptcha

• 이 부분의 오류를 해결하지 못하였다.