@dev park 박예빈

last update: 2020.12.21.

CONTENTS

1. Libraries

1-1. Rodal : The React Modal with Animation

0. References

Rodal: github

rodal

Rodal: A React Modal of Animations

Rodal

1. Introduction

A React Modal with animations.

React + Modal의 합성어로, 9가지 종류의 애니메이션 효과를 가진 Modal을 react로 손 쉽게 띄우고, 제어할 수 있는 라이브러리이다. 코드를 뜯어보면 각 애니메이션 별로 CSS properties 및 Keyframe Animation이 Enter/Leave의 한 쌍으로 이루어져 구현이 되어있으며, 이 CSS Stylesheet는 사용자가 입맛에 맞게 제한 없는 수정이 가능하므로 그 자유도 및 활용도가 매우 높다. 또한 설치 및 사용도 굉장히 쉬운 편이라, 각 기능 별 상세한 Documentation이 존재하지 않았는데도 React를 학습한 지 고작 3일된 나도 Zeplin으로 넘겨 받은 디자인 그대로 Modal을 수정하고, 제어할 수 있었다.