Page d'accueil » Boîte à outils » React.js 14 Outils et ressources pour les développeurs Web

    React.js 14 Outils et ressources pour les développeurs Web

    le popularité de React.js a été en croissance rapide depuis la première publication de la bibliothèque par Facebook en 2013. Il est le cinquième projet open source le plus fréquemment sélectionné sur Github, et les offres d’emploi pour les développeurs de React sont également en forte hausse. React est un framework JavaScript léger pour construction d'interfaces utilisateur - les exemples les plus importants sont Facebook et Instagram.

    React offre un alternative aux frameworks MVC, comme Angular ou Backbone, avec un structure plus simple et l'accent mis sur l'optimisation des performances. React définira sûrement le paysage du développement Web dans les années à venir. Dans cet article, nous souhaitons vous fournir une kit de développement pour vous aider à mettre le pied dans le domaine du développement de React.

    Documents officiels React.js de Facebook

    Facebook fournit aux développeurs un documentation détaillée sur le concepts principaux de React. Outre la documentation, vous pouvez également trouver ici un excellent didacticiel sur comment construire un jeu de tic-tac-toe interactif avec React, et un forum de discussion pour les développeurs de React. Comme le les documents sont open-source, vous pouvez même les éditer si vous voulez.

    React.js Github repo

    Dans le repo React Github, vous pouvez consultez le code source de React chaque fois que vous en avez besoin. Si vous souhaitez rester informé de l'état actuel du développement, vous pouvez également consulter le problèmes, la jalons, et le dernières demandes d'extraction. Si vous êtes bloqué, cela peut aussi être une bonne idée d’étudier la Guide de dépannage un peu.

    Bonjour World Code de démarrage

    Si vous voulez essayer rapidement de réagir, vous pouvez commencer par ceci “Bonjour le monde” démo interactive sur Codepen. Il comprend tous les atouts nécessaires et le code de démarrage ainsi que. Comme Babel est aussi allumé, vous pouvez utiliser ECMAScript 6 et la syntaxe JSX. Utilisez simplement ce stylo et vous pourrez continuer sans avoir à configurer vous-même l'environnement entier.

    Kit de démarrage React

    le Kit de démarrage React est un application web isomorphe passe-partout construit de Node.js, Express, GraphQL, React, et une poignée d'outils de développement Web, tels que Webpack, Babel, et Browsersync. Il vous fournit le même pile frontale utilise Facebook et vous permet de sauter dans développement React complet sans trop de soucis.

    ReactCSS

    ReactCSS permet de ajouter des styles CSS en JavaScript. ReactCSS prend en charge les requêtes React, Redux, React Native (un cadre pour la création d'applications mobiles natives à l'aide de React), le préfixe automatique, le survol, les pseudo-éléments et les requêtes multimédia. Vous pouvez rapidement installez le avec npm.

    Réaction de l'intégration JSFiddle (avec et sans JSX)

    C'est un super terrain de jeu en ligne si vous voulez un endroit où vous pouvez commencer à pratiquer React. Ses hébergé sur JSFiddle, et a deux versions: un avec JSX et un sans JSX, choisissez celui avec lequel vous êtes le plus à l'aise.

    Générateur de guides de style React

    Vous pouvez rapidement générer un guide de style pour votre projet React avec ce facile à utiliser Générateur de guides de style React. Il suffit de ajouter un peu de documentation à vos fichiers, et le générateur se charge du reste. L'outil est livré avec un fichier readme détaillé.

    Composants Belle configurables de React

    Belle est un Bibliothèque de composants React qui vous équipe un ensemble de composants React vous voudrez peut-être utiliser dans votre projet, comme “Bouton”, “Carte”, “Fileur”, “Basculer”, “Évaluation”, différents composants de forme, et d'autres. Les composants fonctionnent à la fois sur mobile et de bureau, et ils sont personnalisable ainsi que.

    Belle est pas la seule bibliothèque de composants React là-bas, vous pouvez trouver d’autres excellents sur Github, tels que Réagir les widgets ou Élémentaire.

    Environnement de développement d'interface utilisateur React Storybook

    Si vous ne voulez pas utiliser la bibliothèque de composants de quelqu'un d'autre mais vouloir construire le vôtre, ça vaut le coup d'essayer Réagir StoryBook qui est un Environnement de développement d'interface utilisateur pour les composants React. Storybook vous permet de développer des composants de manière interactive. Il a un documentation élaborée, et tu peux se lancer dans le développement dans le Storybook Hub.

    React-Bootstrap

    React-Bootstrap intègre React avec le populaire Infrastructure frontale Bootstrap 3. Ses développeurs ont essentiellement reconstruit les composants Bootstrap avec React.js. Cela se traduit par un base de code plus propre avec moins de répétition, et un performance supérieure.

    Notez que le repo étant en développement actif, les API changeront à l'avenir. Pour le état actuel de développement, Vérifiez feuille de route du projet.

    Outils de développement React pour Chrome

    Réagissez DevTools for Chrome est une extension de Chrome Developer Tools et vous permet de inspecter la hiérarchie des composants. C'était créé par Facebook pour aider la communauté des développeurs à créer de nouvelles applications React. Vous pouvez simplement ajoutez-le en tant qu'extension Chrome à votre navigateur. Vous pouvez parcourir le code source appartenant sur Github aussi.

    Outils de développement React pour Firefox

    C'est le Version de Firefox du même Outils de développement React créés par Facebook. Il suffit de l'ajouter en complément de votre navigateur Firefox, et commencez à inspecter immédiatement l'arborescence de votre application React.

    React.js Package pour Atom

    Vous pouvez ajouter Réactionnez le support de votre éditeur de code Atom avec ce paquet Atom React. Il est livré avec mise en surbrillance de la syntaxe, saisie semi-automatique, extraits de code, conversion HTML en JSX, et quelques autres fonctionnalités utiles qui peuvent grandement faciliter le développement de React.

    React.js Fundamentals - cours gratuit en ligne

    Il existe de nombreux cours excellents et peu coûteux où vous pouvez apprendre à réagir au développement, Cependant, vous pouvez vous inscrire Les fondamentaux de React.js cours en ligne totalement gratuit. Il est composé de 12 cours, commence par le bases de React, et a un bon programme qui couvre toutes les choses importantes.