목록react (3)

개발하는 kim-hasa

[React] Toast UI Editor , Viewer , 이미지 첨부 및 Plugin

Toast UI 란 ? NHN에서 개발한 markdown WYSIWYG editor 입니다. 마크다운 또는 위지윅 에디터를 구현하게 해주는 외부 라이브러리로 , 쉽게 에디터를 구현할 수 있습니다. 최근 프로젝트에서 사용한 후 , 어려운 점이나 사용 방법을 정리해 보았습니다. 공식 문서 : https://ui.toast.com/tui-editor TOAST UI :: Make Your Web Delicious! The TOAST UI Is Free Open-source JavaScript UI Libraries Maintained By NHN. ui.toast.com 📕 npm을 사용해 설치하기 npm install @toast-ui/react-editor 📕 import 하기 import { Editor..
study 2022. 2. 23. 17:15
[JS][REACT] 리액트 정리 2

리액트 스타일링 1. CSS Import - CSS 파일을 import 해서 사용 - 자바스크립트 파일과 코드 분리 - CSS파일만을 사용해서 편리 - 컴포넌트가 적으면 하나의 CSS파일로 코드를 관리하는 것도 가능 - CSS파일은 분리할 수 있으나 namespace를 나눌 수 없음 - 스타일이 겹칠경우 cascading rule에 따라 적용 2. CSS module - 하나의 CSS module 파일 안에 작성한 스타일을 하나의 파일 namespace로 관리 - className 뒤에 겹치지 않는 hash 작성으로 스타일이 겹치는 상황 해결 3. CSS - in - js - 별도의 CSS파일을 만들지 않고 하나의 컴포넌트 파일 안에서 스타일을 작성 - 자바스크립트 문법을 그대로 활용해서 코드를 작성 -..
study 2022. 1. 7. 20:16
[JS][REACT] 리액트 정리 1

리액트란 ? 사용자 인터페이스를 만들기 위한 js 라이브러리. Component - 리액트 서비스를 개발하는데 있어 독립적인 단위로 쪼개서 구현. Virtual DOM - 가상 DOM으로 ReactDOM과 같은 라이브러리에 의해 실제 DOM과 동기화하는 프로그래밍 개념 JSX - js 내에서 UI를 작성하기 위해 개발자에게 익숙한 환경을 제공하며 , HTML과 유사. 왜 사용하는가 ? 생산성 / 재사용성 - component, hook을 활용해서 작은 단위의 논리적인 요소로 개발하여 개발자의 생산성과 코드의 재사용성 상승 풍부한 자료 / 라이브러리 - 방대한 자료와 편리한 오픈소스 라이브러리등이 공유되고 있음 Create React App (CRA) - 리액트 프로젝트를 손쉽게 생성할 수 있게 도와주는 ..
study 2022. 1. 7. 19:46
이전 Prev 1 Next 다음