Skip to content

[DONE] Update tools-jsx.md #157

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Aug 17, 2019
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
90 changes: 45 additions & 45 deletions content/community/tools-jsx.md
Original file line number Diff line number Diff line change
@@ -1,53 +1,53 @@
---
id: jsx-integrations
title: JSX Integrations
title: إضافات JSX
layout: community
permalink: community/jsx-integrations.html
---

## Editor Integrations {#editor-integrations}
* **[Sublime Text: babel-sublime](https://github.com/babel/babel-sublime):** Snippets, syntax highlighting and optimized color schemes for Sublime Text
* **[Atom: language-babel](https://atom.io/packages/language-babel)** Support for es2016, JSX and Flow.
* **[Visual Studio Code](https://code.visualstudio.com/updates/vFebruary#_languages-javascript)** Visual Studio Code supports JSX directly.
* **[JetBrains WebStorm](https://www.jetbrains.com/webstorm/):** Syntax highlighting, code completion, error detection for JSX
* **[JetBrains IDE Live Templates](https://github.com/Minwe/jetbrains-react):** React live templates for JetBrains editors (e.g. WebStorm, PHPStorm, etc.)
* **[javascript-jsx.tmbundle](https://github.com/jjeising/javascript-jsx.tmbundle)** Syntax for TextMate
* **[web-mode.el](http://web-mode.org):** An autonomous emacs major mode that indents and highlights JSX. No support for Automatic Semicolon Insertion.
* **[vim-jsx](https://github.com/mxw/vim-jsx):** Syntax highlighting and indenting for JSX
## إضافات محرر النصوص {#editor-integrations}
* **[Sublime Text: babel-sublime](https://github.com/babel/babel-sublime):** مقتطفات و إبراز الصيغ و مخططات الألوان الأمثل لـSublime Text.
* **[Atom: language-babel](https://atom.io/packages/language-babel)** يدعم es2016 و JSX و التنسيق.
* **[Visual Studio Code](https://code.visualstudio.com/updates/vFebruary#_languages-javascript):** يدعم JSX مباشرة.
* **[JetBrains WebStorm](https://www.jetbrains.com/webstorm/):** إبراز الصيغ و تكملة الشيفرة و تقصي الأخطاء لـJSX.
* **[JetBrains IDE Live Templates](https://github.com/Minwe/jetbrains-react):** <span dir='rtl'>React</span> نماذج حية لمحررات JetBrains (مثل: WebStorm، PHPStorm، إلخ).
* **[javascript-jsx.tmbundle](https://github.com/jjeising/javascript-jsx.tmbundle)** الصيغ لمحرر TextMate.
* **[web-mode.el](http://web-mode.org):** حالة (mode) للمحرر emacs يقوم أليا بإضافة المسافات وإبراز صيغ JSX.لا يدعم إدراج الفاصلة المنقوطة ألياً.
* **[vim-jsx](https://github.com/mxw/vim-jsx):** إبراز الصيغ و مسافة البدء لـJSX.

## Build Tools {#build-tools}
## أدوات البناء {#build-tools}

* **[Create React App](https://github.com/facebookincubator/create-react-app):** An **officially supported** way to create React apps with no configuration.
* **[nwb](https://github.com/insin/nwb)**: A toolkit for React, Preact & Inferno apps, React libraries and other npm modules for the web, with no configuration (until you need it)
* **[Neutrino](https://neutrino.js.org/)**: Create and build modern JavaScript applications with zero initial configuration. Neutrino combines the power of webpack with the simplicity of presets.
* **[ESLint](https://eslint.org/):** A pluggable JavaScript linter that natively supports JSX syntax. Be sure to download [eslint-plugin-react](https://npmjs.com/package/eslint-plugin-react) for React-specific rules.
* **[Structor](https://www.npmjs.com/package/structor):** This tool is a user interface builder for node.js Web applications with React UI. Structor replaces the now deprecated React UI Builder. Watch [Structor Video Tutorials](https://youtu.be/z96xYa51EWI?list=PLAcaUOtEwjoR_U6eE2HQEXwkefeVESix1)
* **[react-jsx](https://github.com/bigpipe/react-jsx):** Compile and use JSX as stand-alone templates that can run server-side and client side!
* **[cjsx-codemod](https://github.com/jsdf/cjsx-codemod):** Write JSX code within Coffeescript!
* **[ReactScript](https://github.com/1j01/react-script):** Write React code within Coffeescript without JSX!
* **[jsxhint](https://npmjs.org/package/jsxhint):** [JSHint](http://jshint.com/) (linting) support. (JSX compilation doesn't affect line numbers so lint can also be run directly on the compiled JS.)
* **[reactify](https://npmjs.org/package/reactify):** [Browserify](http://browserify.org/) transform.
* **[Babel](https://babeljs.io/):** Standalone & [Browserify](http://browserify.org/) transform (formerly known as **6to5**).
* **[node-jsx](https://npmjs.org/package/node-jsx):** Native [Node](https://nodejs.org/) support.
* **[react-hot-loader](https://gaearon.github.io/react-hot-loader/):** Loader for [webpack](https://webpack.github.io/) that lets you edit JSX and have changes appear immediately in the browser without reloading the page.
* **[jsx-loader](https://npmjs.org/package/jsx-loader):** Loader for [webpack](https://webpack.github.io/).
* **[express-jsxtransform](https://www.npmjs.org/package/express-jsxtransform):** Middleware for [Express](https://www.npmjs.org/package/express).
* **[gradle-react-plugin](https://github.com/ehirsch/gradle-react-plugin):** Transform jsx sources during a gradle build.
* **[grunt-react](https://npmjs.org/package/grunt-react):** [GruntJS](https://gruntjs.com/) task.
* **[gulp-react](https://npmjs.org/package/gulp-react):** [GulpJS](https://gulpjs.com/) plugin.
* **[brunch-react](https://www.npmjs.org/package/react-brunch):** [Brunch](https://brunch.io/) plugin.
* **[jsx-requirejs-plugin](https://github.com/philix/jsx-requirejs-plugin):** [RequireJS](https://requirejs.org/) plugin.
* **[react-meteor](https://github.com/benjamn/react-meteor):** [Meteor](https://www.meteor.com/) plugin.
* **[pyReact](https://github.com/facebook/react-python):** [Python](https://www.python.org/) bridge to JSX.
* **[react-rails](https://github.com/facebook/react-rails):** Ruby gem for using JSX with [Ruby on Rails](https://rubyonrails.org/).
* **[react-laravel](https://github.com/talyssonoc/react-laravel):** PHP package for using ReactJS with [Laravel](https://laravel.com/).
* **[ReactJS.NET](https://reactjs.net/):** .NET library for React and JSX.
* **[sbt-reactjs](https://github.com/ddispaltro/sbt-reactjs)** SBT/Play/Scala JSX compiler plugin
* **[mimosa-react](https://github.com/dbashford/mimosa-react):** [Mimosa](http://mimosa.io) plugin.
* **[react-grails-asset-pipeline](https://github.com/peh/react-grails-asset-pipeline):** Assets for react and precompilation of jsx files in [Grails](https://grails.org/).
* **[gore-gulp](https://github.com/goreutils/gore-gulp):** Wrapper around [webpack](https://webpack.github.io/), [eslint](https://eslint.org/), [mocha](https://mochajs.org/) for ease of use and zero configuration.
* **[webpack](https://github.com/webpack/webpack):** Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jade, coffee, css, less, ... and your custom stuff.
* **[webpack-bbq](https://github.com/wenbing/webpack-bbq):** transform your src to lib, supports server rendering and static rendering.
* **[jsxtransformer](https://github.com/cronn-de/jsxtransformer):** Compile pipeline for jsx files in Java
* **[babylon-jsx](https://github.com/marionebl/babylon-jsx)**: Transform JSX to ES2015 with babylon sans babel
* **[CRA Universal CLI](https://github.com/antonybudianto/cra-universal)** - A simple CLI to create and build Express server for your create-react-app projects, featuring Server-side rendering and Code-splitting.
* **[Create React App](https://github.com/facebookincubator/create-react-app):** طريقة **مدعومة رسميًا** لإنشاء تطبيقات React بدون إعدادات.
* **[nwb](https://github.com/insin/nwb)**: عُدّة لـReact و Preact و تطيبقات Inferno و مكتبات React و وحدات npm أخرى للويب وبدون إعدادات (إﻻ إذا احتجت لذلك).
* **[Neutrino](https://neutrino.js.org/)**: إنشاء وبناء تطبيقات JavaScript متقدمة بدون إعدادات أولية. يجمع Neutrino بين قوة webpack مع بساطة المسبقة (presets).
* **[ESLint](https://eslint.org/):** تدقيق JavaScript قابل للإضافة يدعم اصلا صيغة JSX. تأكد من تحميل [eslint-plugin-react](https://npmjs.com/package/eslint-plugin-react) لقواعد React-specific.
* **[Structor](https://www.npmjs.com/package/structor):** هذه الأداة لواجهة المسخدم لبناء تطبيقات الويب بـNode.js مع React UI. استبدلت Structor بـReact UI Builder (المهملة). شاهد [الفيديو التعليمي لـStructor](https://youtu.be/z96xYa51EWI?list=PLAcaUOtEwjoR_U6eE2HQEXwkefeVESix1).
* **[react-jsx](https://github.com/bigpipe/react-jsx):** إعادة الصياغة وإستعمال JSX كنموذج مستقل يمكن إستعماله في جهة الخادم أو المستخدم!
* **[cjsx-codemod](https://github.com/jsdf/cjsx-codemod):** كتابة الشفرة JSX من خلال Coffeescript!
* **[ReactScript](https://github.com/1j01/react-script):** كتابة الشفرة React من خلال Coffeescript وبدون JSX!
* **[jsxhint](https://npmjs.org/package/jsxhint):** يدعم [JSHint](http://jshint.com/) (linting). (إعادة صياغة JSX ولا تؤثر على ترقيم الأسطر لذا يمكنك تشغيله مباشرة من JS.)
* **[reactify](https://npmjs.org/package/reactify):** تحويل[Browserify](http://browserify.org/).
* **[Babel](https://babeljs.io/):** مستقل و تحويل [Browserify](http://browserify.org/) (معروف سابقا بإسم **6to5**).
* **[node-jsx](https://npmjs.org/package/node-jsx):** حزمة أصيلة (native) لدعم [Node](https://nodejs.org/).
* **[react-hot-loader](https://gaearon.github.io/react-hot-loader/):** مُحَمّل لـ[webpack](https://webpack.github.io/) يتيح لك تحرير JSX وتغيير دون إعادة تحميل صفحة المتصفح على الإطلاق.
* **[jsx-loader](https://npmjs.org/package/jsx-loader):** مُحَمّل لـ[webpack](https://webpack.github.io/).
* **[express-jsxtransform](https://www.npmjs.org/package/express-jsxtransform):** أدوات وسيطية لـ[Express](https://www.npmjs.org/package/express).
* **[gradle-react-plugin](https://github.com/ehirsch/gradle-react-plugin):** تحويل مصادر JSX أثناء بناء Gradle.
* **[grunt-react](https://npmjs.org/package/grunt-react):** منفذ مهام [GruntJS](https://gruntjs.com/).
* **[gulp-react](https://npmjs.org/package/gulp-react):** إضافة [GulpJS](https://gulpjs.com/).
* **[brunch-react](https://www.npmjs.org/package/react-brunch):** إضافة [Brunch](https://brunch.io/).
* **[jsx-requirejs-plugin](https://github.com/philix/jsx-requirejs-plugin):** إضافة [RequireJS](https://requirejs.org/).
* **[react-meteor](https://github.com/benjamn/react-meteor):** إضافة [Meteor](https://www.meteor.com/).
* **[pyReact](https://github.com/facebook/react-python):** جسر [Python](https://www.python.org/) لـJSX.
* **[react-rails](https://github.com/facebook/react-rails):** مدير حزم Ruby ( gem ) لإستعمال JSX مع [Ruby on Rails](https://rubyonrails.org/).
* **[react-laravel](https://github.com/talyssonoc/react-laravel):** حزمة PHP لإستعمال ReactJS مع [Laravel](https://laravel.com/).
* **[ReactJS.NET](https://reactjs.net/):** مكتبة .NET مع React و JSX.
* **[sbt-reactjs](https://github.com/ddispaltro/sbt-reactjs):** <span dir='rtl'>SBT/Play/Scala JSX</span> إضافة إعادة الصياغة.
* **[mimosa-react](https://github.com/dbashford/mimosa-react):** إضافة [Mimosa](http://mimosa.io).
* **[react-grails-asset-pipeline](https://github.com/peh/react-grails-asset-pipeline):** ملفات تحكم لـ React و إعادة صياغة ملفات JSX في [Grails](https://grails.org/).
* **[gore-gulp](https://github.com/goreutils/gore-gulp):** غلاف يحيط بـ[webpack](https://webpack.github.io/)، [mocha](https://mochajs.org/) لتسهيل الإستعماله وبدون إعدادات.
* **[webpack](https://github.com/webpack/webpack):** <span dir='rtl'>CommonJs/AMD</span> مجموعة من وحدات حزم للمتصفح. تسمح بقسيم الشيفرة لى عدة حُزم حيث يمكن إستدعائها وتحميلها وتدعم عمليات تحميل الملفات مثل تنسيق json, jade, coffee, css, less, ... وتخصصها لأغراضك.
* **[webpack-bbq](https://github.com/wenbing/webpack-bbq):** تحويل src إلى lib، يدعم التصيير من جهة الخادم وتصيير الملفات الثابتة.
* **[jsxtransformer](https://github.com/cronn-de/jsxtransformer):** إعادة صياغة و إمداد لملفات JSX بإستعمالJava.
* **[babylon-jsx](https://github.com/marionebl/babylon-jsx)**: تحويل JSX إلى ES2015 بإستعمال Babylon وبدون Babel.
* **[CRA Universal CLI](https://github.com/antonybudianto/cra-universal):** - واجهة سطر الأوامر بسيطة لإنشاء وبناء ExpressJS لمشاريعك بـReact، يميزه تحميل جهة الخادم وتقسيم الشيقرة.