React.js 14 Ferramentas e recursos para desenvolvedores da Web

o popularidade do React.js foi crescendo rapidamente desde que o Facebook lançou a biblioteca em 2013. É o quinto projeto de código aberto com mais frequência no Github, e os anúncios de emprego para os desenvolvedores do React também estão em alta. Reagir é um estrutura JavaScript leve para construindo interfaces de usuário - os exemplos mais proeminentes são o Facebook e o Instagram.

React oferece um alternativa para frameworks MVC, como Angular ou Backbone, com um estrutura mais direta e um foco na otimização de desempenho. Como React certamente estará definindo o cenário de desenvolvimento web nos próximos anos, neste artigo gostaríamos de lhe fornecer um kit de ferramentas do desenvolvedor para ajudá-lo a colocar os pés no reino do desenvolvimento de React.

Documentos oficiais do React.js do Facebook

O Facebook fornece aos desenvolvedores um documentação detalhada no principais conceitos do React. Além dos documentos, você também pode encontrar aqui um ótimo tutorial sobre como construir um jogo interativo de jogo-da-velha com React e um Fórum de discussão para desenvolvedores do React. Enquanto o docs são de código aberto, você pode até editá-los se quiser.

Repositório React.js Github

No repositório React Github, você pode Confira o código-fonte do React sempre que você precisar. Se você quiser se manter informado sobre o estado atual do desenvolvimento, também pode dar uma olhada no problemas, a Milestones, e a últimos pedidos de pull. Se você ficou preso, também pode ser uma boa ideia estudar Guia de solução de problemas um pouco.

Hello star starter code

Se você quiser dar uma rápida tentativa de Reagir, você pode começar com isso “Olá Mundo” demonstração interativa em Codepen. Inclui todos os ativos necessários e a código inicial também. Como Babel também está, você pode usar tanto o ECMAScript 6 quanto a sintaxe JSX. Apenas bifurque esta caneta, e você pode ir em frente sem ter que configurar todo o ambiente por conta própria.

Reagir Starter Kit

o Reagir Starter Kit é um boilerplate app isomorfo web construído de Node.js, Express, GraphQL, Reagir, e um punhado de ferramentas de desenvolvimento web, como Webpack, Babel, e Browsersync. Ele fornece a você mesma pilha de frontend que o Facebook usa e permite que você pule desenvolvimento React full-stack sem muita trabalheira.

ReactCSS

ReactCSS torna possível adicionar estilos CSS inline em JavaScript. O ReactCSS vem com suporte para React, Redux, React Native (uma estrutura para criar aplicativos móveis nativos usando React), autoprefixing, hover, pseudo-elementos e consultas de mídia. Você pode rapidamente instale-o com npm.

Reagir integração JSFiddle (com e sem JSX)

Isto é ótimo playground online se você quiser um lugar onde você pode começar a praticar React. Está hospedado no JSFiddle, e tem duas versões: um com JSX e um sem JSX, escolha o que você está mais confortável com.

Reagir gerador de guia de estilo

Você pode rapidamente gerar um guia de estilo para o seu projeto React com este fácil de usar Reagir gerador de guia de estilo. Você só tem que adicione um pouco de documentação aos seus arquivos, e o gerador cuida do resto. A ferramenta vem com um arquivo leia-me detalhado.

Belle configurável Reagir componentes

Belle é um Reagir biblioteca de componentes que te equipa com um conjunto de componentes React você pode querer usar em seu projeto, como “Botão”, “Cartão”, “Girador”, “Alternancia”, “Avaliação”, componentes de formulários diferentes e outros. Os componentes funcionam tanto no celular quanto no desktop, e eles são Customizável também.

Belle é não é a única biblioteca de componentes do React lá fora, você pode encontrar outros ótimos no Github, como Reagir widgets ou Elementar.

Reaja ao ambiente de desenvolvimento de interface do usuário do Storybook

Se você não quiser usar a biblioteca de componentes de outra pessoa, quer construir seu próprio, vale a pena tentar Reaja com o livro de histórias que é um Ambiente de desenvolvimento de interface do usuário para componentes React. Storybook permite que você desenvolver componentes interativamente. Tem um documentação elaborada, e você pode Comece com o desenvolvimento no Hub de contos de fadas.

Reagir-Bootstrap

Reagir-Bootstrap integra Reage com o popular Bootstrap 3 framework frontend. Seus desenvolvedores basicamente reconstruíram os componentes do Bootstrap com o React.js. Isso resulta em um base de código mais limpo com menos repetição e um maior desempenho.

Observe que, como o repo está em desenvolvimento ativo, as APIs serão alteradas no futuro. Para o estado atual de desenvolvimento, Confira a roteiro do projeto.

React Developer Tools for Chrome

Reagir DevTools para o Chrome é uma extensão do Chrome Developer Tools e permite que você inspecionar hierarquia de componentes. isso foi criado pelo Facebook com o objetivo de ajudar a comunidade de desenvolvedores a criar novos aplicativos React. Você pode simplesmente adicione-o como uma extensão do Chrome para o seu navegador. Você pode navegar pelo código-fonte pertencente no Github também.

React Developer Tools para o Firefox

Isto é o Versão do Firefox do mesmo React Developer Tools criadas pelo Facebook. Apenas adicione como um complemento para o seu navegador Firefox, e comece a inspecionar a árvore de hierarquia do seu aplicativo React de uma só vez.

Pacote React.js para o Atom

Você pode adicionar Reaja o suporte ao seu editor de código Atom com este pacote Atom React. Vem com realce de sintaxe, autocomplete, snippets de código, conversão de HTML para JSX, e alguns outros recursos úteis que podem facilitar muito o desenvolvimento do React.

Fundamentos do React.js - curso on-line gratuito

Existem muitos cursos excelentes e razoavelmente baratos onde você pode aprenda o desenvolvimento de Reagir, no entanto, você pode inscrever este Fundamentos do React.js curso on-line para totalmente gratuito. É feito de 12 lições, começa com o noções básicas de Reagir, e tem um bom currículo que cobre todas as coisas importantes.