Draft.js: فریم ورک ساخت Text Editor برای React

React Native: فریم ورکی متن باز از فیسبوک برای طراحی اپلیکیشن با کلیات فریم ورک React فیسبوک است که این فریم ورک این امکان را در اختیار توسعه دهندگان قرار می‌دهد تا از فریم ورک جاوا اسکریپت آن تحت عنوان React.js برای توسعه اپلیکیشن های موبایل استفاده کنند. حال این مقاله قصد داریم تا با فریم ورک Draft.js آشنا شویم که برای ساخت Text Editor های حرفه یی در فریم ورک React مورد استفاده قرار می گیرد. با سکان آکادمی همراه باشید.

توسعه دهندگان با استفاده از Draft.js خواهند توانست تا هر نوع ادیتور متنی به پروژه های خود بیفزایند؛ از ادیتورهای خیلی ساده برای ویرایش چند سطر گرفته تا ادیتورهای حرفه برای انتشار مقالات طولانی با ساختارهای پیچیده.

در Draft.js هر چیزی این قابلیت را دارا است تا شخصی سازی شود و توسعه‌دهنده این امکان را دارد تا روی تمامی بخش‌های این فریم ورک کنترل داشته باشد (در تصویر فوق، نمونه یی از یک ادیتور متن ساده که با این فریم ورک طراحی شده است را مشاهده می کنید.)

در حال حاضر، Draft.js از طریق npm در اختیار توسعه دهندگان قرار می گیرد -npm که مخفف واژگان Node Package Manager است، پکیج منجر پیش فرض برای Node.js است- که پس از نصب آن، از طریق دستور زیر می توانید فریم ورک Draft.js را دانلود نمایید:

npm install --save draft-js react react-dom

پس از نصب، کاربرد این فریم ورک به شکل زیر خواهد بود:

import React from 'react';
import ReactDOM from 'react-dom';
import {Editor, EditorState} from 'draft-js';

class MyEditor extends React.Component {
  constructor(props) {
    super(props);
    this.state = {editorState: EditorState.createEmpty()};
    this.onChange = (editorState) => this.setState({editorState});
  }
  render() {
    const {editorState} = this.state;
    return ;
  }
}

ReactDOM.render(
  <MyEditor />,
  document.getElementById('container')
);

با توجه به این که Draft.js از یونیکد پشتیبانی می کند، می بایست متا تگ زیر را نیز در بخش head فایل اچ تی ام ال خود قرار دهید:

<meta charset="utf-8" />

0


بهزاد مرادی

از جمله علائق بهزاد مرادی می توان به نشر علم،‌ سرمایه گذاری روی نسل آینده، زبان برنامه نویسی پی اچ پی و جامعه متن باز و همچنین راه اندازی استارتاپ و کارآفرینی اشاره کرد و او بر این باور است که سکان آکادمی بستری است که از آن طریق می تواند به علائق اش جامه ی عمل بپوشاند. از جمله فعالیت های وی در سکان آکامی می توان به تالیف دوره های آنلاین برنامه نویسی و ترجمه مقالات وبلاگ اشاره کرد. 






از طریق این فرم، می توانید بدون ثبت نام نظر دهید و یا اگر قبلا ثبت نام کرده اید، با ورود ناحیه ی کاربری می توانید علاوه بر ثبت نظر، به مدیریت نظرات خود نیز بپردازید.
(فیلد اجباری)
(فیلد اجباری)
(فیلد اجباری)
(فیلد اجباری)