You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
**[Create React App](https://github.com/facebookincubator/create-react-app)**is a new officially supported way to create single-page React applications. It offers a modern build setup with no configuration.
6
+
**[Create React App](https://github.com/facebookincubator/create-react-app)**é a nova forma oficialmente suportada para criar aplicativos React de página única. Ele oferece um ambiente moderno sem configurações.
7
7
8
-
## Getting Started {#getting-started}
8
+
## Começando {#getting-started}
9
9
10
-
### Installation {#installation}
10
+
### Instalação {#installation}
11
11
12
-
First, install the global package:
12
+
Primeiro, instale o pacote global:
13
13
14
14
```sh
15
15
npm install -g create-react-app
16
16
```
17
17
18
-
Node.js 4.x or higher is required.
18
+
Node.js 4.x ou superior é nescessário.
19
19
20
-
### Creating an App {#creating-an-app}
20
+
### Criando um App {#creating-an-app}
21
21
22
-
Now you can use it to create a new app:
22
+
Agora você pode usá-lo para criar um novo app:
23
23
24
24
```sh
25
25
create-react-app hello-world
26
26
```
27
27
28
-
This will take a while as npm installs the transitive dependencies, but once it’s done, you will see a list of commands you can run in the created folder:
28
+
Isso levará algum tempo, já que o npm instala as dependências transitivas, mas, depois de concluído, você verá uma lista de comandos que podem ser executados na pasta criada:
ESLint is also integrated so lint warnings are displayed right in the console:
43
+
O ESLint também é integrado, de modo que os avisos de lint são exibidos diretamente no console:
44
44
45
-

45
+

46
46
47
-
We only picked a small subset of lint rules that often lead to bugs.
47
+
Nós só escolhemos um pequeno subconjunto de regras de lint que muitas vezes levam a bugs.
48
48
49
-
### Building for Production {#building-for-production}
49
+
### Contruindo para Produção {#building-for-production}
50
50
51
-
To build an optimized bundle, run`npm run build`:
51
+
Para construir um pacote otimizado, execute`npm run build`:
52
52
53
53

54
54
55
-
It is minified, correctly envified, and the assets include content hashes for caching.
55
+
Ele é minificado, montado corretamente e os recursos incluem hashes de conteúdo para armazenamento em cache.
56
56
57
-
### One Dependency {#one-dependency}
57
+
### Uma Dependência {#one-dependency}
58
58
59
-
Your`package.json`contains only a single build dependency and a few scripts:
59
+
Seu`package.json`contém apenas uma única dependência de compilação e alguns scripts:
60
60
61
61
```js
62
62
{
@@ -76,11 +76,11 @@ Your `package.json` contains only a single build dependency and a few scripts:
76
76
}
77
77
```
78
78
79
-
We take care of updating Babel, ESLint, and webpack to stable compatible versions so you can update a single dependency to get them all.
79
+
Nós cuidamos de atualizar o Babel, o ESLint e o Webpack para versões compatíveis estáveis, para que você possa atualizar uma única dependência para obter todas elas.
80
80
81
-
### Zero Configuration {#zero-configuration}
81
+
### Configuração Zero {#zero-configuration}
82
82
83
-
It is worth repeating: there are no configuration files or complicated folder structures. The tool only generates the files you need to build your app.
83
+
Vale a pena repetir: não há arquivos de configuração ou estruturas de pastas complicadas. A ferramenta gera apenas os arquivos necessários para você criar seu aplicativo.
84
84
85
85
```
86
86
hello-world/
@@ -97,68 +97,68 @@ hello-world/
97
97
logo.svg
98
98
```
99
99
100
-
All the build settings are preconfigured and can’t be changed. Some features, such as testing, are currently missing. This is an intentional limitation, and we recognize it might not work for everybody. And this brings us to the last point.
100
+
Todas as configurações de criação são pré-configuradas e não podem ser alteradas. Alguns recursos, como testes, estão ausentes no momento. Esta é uma limitação intencional e reconhecemos que pode não funcionar para todos. E isso nos leva ao último ponto.
101
101
102
-
### No Lock-In {#no-lock-in}
102
+
### Sem Bloqueio {#no-lock-in}
103
103
104
-
We first saw this feature in [Enclave](https://github.com/eanplatter/enclave), and we loved it. We talked to[Ean](https://twitter.com/EanPlatter), and he was excited to collaborate with us. He already sent a few pull requests!
104
+
Nós vimos esse recurso pela primeira vez em [Enclave](https://github.com/eanplatter/enclave), e nós adoramos. Nós conversamos com[Ean](https://twitter.com/EanPlatter), e ele estava animado para colaborar conosco. Ele já enviou alguns pull requests!
105
105
106
-
“Ejecting” lets you leave the comfort of Create React App setup at any time. You run a single command, and all the build dependencies, configs, and scripts are moved right into your project. At this point you can customize everything you want, but effectively you are forking our configuration and going your own way. If you’re experienced with build tooling and prefer to fine-tune everything to your taste, this lets you use Create React App as a boilerplate generator.
106
+
"Ejetar" permite que você deixe o conforto da configuração do Create React App a qualquer momento. Você executa um único comando e todas as dependências, configurações e scripts de compilação são movidos diretamente para o seu projeto. Neste ponto, você pode personalizar tudo o que quiser, mas efetivamente você está bifurcando nossa configuração e seguindo seu próprio caminho. Se você tem experiência com ferramentas de construção e prefere ajustar tudo ao seu gosto, isso permite usar o Create React App como um gerador geral.
107
107
108
-
We expect that at early stages, many people will “eject” for one reason or another, but as we learn from them, we will make the default setup more and more compelling while still providing no configuration.
108
+
Esperamos que, nos estágios iniciais, muitas pessoas “ejetem” por um motivo ou outro, mas à medida que aprendermos com elas, tornaremos a configuração padrão cada vez mais atraente, sem fornecer configuração.
109
109
110
-
## Try It Out! {#try-it-out}
110
+
## Experimente! {#try-it-out}
111
111
112
-
You can find [**Create React App**](https://github.com/facebookincubator/create-react-app)with additional instructions on GitHub.
112
+
Você pode encontrar o [**Create React App**](https://github.com/facebookincubator/create-react-app)com instruções adicionais sobre o GitHub.
113
113
114
-
This is an experiment, and only time will tell if it becomes a popular way of creating and building React apps, or fades into obscurity.
114
+
Este é um experimento, e só o tempo dirá se ele irá se torna uma maneira popular de criar aplicativos React ou desaparecer na obscuridade.
115
115
116
-
We welcome you to participate in this experiment. Help us build the React tooling that more people can use. We are always [open to feedback](https://github.com/facebookincubator/create-react-app/issues/11).
116
+
Convidamos você a participar desta experiência. Ajude-nos a construir o conjunto de ferramentas React que mais pessoas podem usar. Estamos sempre [abertos ao feedback](https://github.com/facebookincubator/create-react-app/issues/11).
117
117
118
-
## The Backstory {#the-backstory}
118
+
## A História por Trás {#the-backstory}
119
119
120
-
React was one of the first libraries to embrace transpiling JavaScript. As a result, even though you can [learn React without any tooling](https://github.com/facebook/react/blob/3fd582643ef3d222a00a0c756292c15b88f9f83c/examples/basic-jsx/index.html), the React ecosystem has commonly become associated with an overwhelming explosion of tools.
120
+
O React foi uma das primeiras bibliotecas a adotar o JavaScript transpilado. Como resultado, mesmo que você possa [aprender React sem qualquer ferramenta](https://github.com/facebook/react/blob/3fd582643ef3d222a00a0c756292c15b88f9f83c/examples/basic-jsx/index.html), o ecossistema React se tornou comumente associado com uma esmagadora explosão de ferramentas.
121
121
122
-
Eric Clemmons called this phenomenon the “[JavaScript Fatigue](https://medium.com/@ericclemmons/javascript-fatigue-48d4011b6fc4)”:
122
+
Eric Clemmons chamou esse fenômeno de "[JavaScript fadiga](https://medium.com/@ericclemmons/javascript-fatigue-48d4011b6fc4)":
123
123
124
-
>Ultimately, the problem is that by choosing React (and inherently JSX), you’ve unwittingly opted into a confusing nest of build tools, boilerplate, linters, & time-sinks to deal with before you ever get to create anything.
124
+
>Em última análise, o problema é que, escolhendo React (e inerentemente JSX), você inadvertidamente optou por um ninho confuso de ferramentas de construção, boilerplate, linters e time-pinks para lidar antes mesmo de criar algo.
125
125
126
-
It is tempting to write code in ES2015 and JSX. It is sensible to use a bundler to keep the codebase modular, and a linter to catch the common mistakes. It is nice to have a development server with fast rebuilds, and a command to produce optimized bundles for production.
126
+
É tentador escrever código no ES2015 e no JSX. É sensato usar um bundler para manter a base de código modular e um linter para capturar os erros comuns. É bom ter um servidor de desenvolvimento com reconstruções rápidas e um comando para produzir pacotes otimizados para produção.
127
127
128
-
Combining these tools requires some experience with each of them. Even so, it is far too easy to get dragged into fighting small incompatibilities, unsatisfied peerDependencies, and illegible configuration files.
128
+
Combinar essas ferramentas requer alguma experiência com cada uma delas. Mesmo assim, é muito fácil ser arrastado para combater pequenas incompatibilidades, peerDependencies não-satisfeitas e arquivos de configuração ilegíveis.
129
129
130
-
Many of those tools are plugin platforms and don’t directly acknowledge each other’s existence. They leave it up to the users to wire them together. The tools mature and change independently, and tutorials quickly get out of date.
130
+
Muitas dessas ferramentas são plataformas de plugins e não reconhecem diretamente a existência umas das outras. Eles deixam para os usuários conectá-los juntos. As ferramentas amadurecem e mudam de forma independente, e os tutoriais ficam rapidamente desatualizados.
131
131
132
-
<blockquoteclass="twitter-tweet"data-lang="en"><plang="en"dir="ltr">Marc was almost ready to implement his "hello world" React app <ahref="https://t.co/ptdg4yteF1">pic.twitter.com/ptdg4yteF1</a></p>— Thomas Fuchs (@thomasfuchs) <ahref="https://twitter.com/thomasfuchs/status/708675139253174273">March 12, 2016</a></blockquote>
132
+
<blockquoteclass="twitter-tweet"data-lang="pt"><plang="pt"dir="ltr">Marc estava quase pronto para implementar o seu "hello world"Aplicativo React <ahref="https://t.co/ptdg4yteF1">pic.twitter.com/ptdg4yteF1</a></p>— Thomas Fuchs (@thomasfuchs) <ahref="https://twitter.com/thomasfuchs/status/708675139253174273"> 12 de março de 2016</a></blockquote>
133
133
134
-
This doesn’t mean those tools aren’t great. To many of us, they have become indispensable, and we very much appreciate the effort of their maintainers. They already have too much on their plates to worry about the state of the React ecosystem.
134
+
Isso não significa que essas ferramentas não sejam ótimas. Para muitos de nós, eles se tornaram indispensáveis, e nós apreciamos muito o esforço de seus mantenedores. Eles já têm muito em seus pratos para se preocupar com o estado do ecossistema React.
135
135
136
-
Still, we knew it was frustrating to spend days setting up a project when all you wanted was to learn React. We wanted to fix this.
136
+
Mesmo assim, sabíamos que era frustrante passar dias montando um projeto quando tudo que você queria era aprender React. Nós queríamos consertar isso.
137
137
138
-
## Could We Fix This? {#could-we-fix-this}
138
+
## Poderíamos Corrigir Isso? {#could-we-fix-this}
139
139
140
-
We found ourselves in an unusual dilemma.
140
+
Nós nos encontramos em um dilema incomum.
141
141
142
-
So far, [our strategy](/docs/design-principles.html#dogfooding)has been to only release the code that we are using at Facebook. This helped us ensure that every project is battle-tested and has clearly defined scope and priorities.
142
+
Até agora, [nossa estratégia](/docs/design-principles.html#dogfooding)foi apenas liberar o código que estamos usando no Facebook. Isso nos ajudou a garantir que todos os projetos sejam testados em batalha e tenham um escopo e prioridades claramente definidos.
143
143
144
-
However, tooling at Facebook is different than at many smaller companies. Linting, transpilation, and packaging are all handled by powerful remote development servers, and product engineers don’t need to configure them. While we wish we could give a dedicated server to every user of React, even Facebook cannot scale that well!
144
+
No entanto, ferramentas no Facebook é diferente do que em muitas empresas menores. O linting, o transpilation e o empacotamento são todos gerenciados por poderosos servidores remotos de desenvolvimento, e os engenheiros de produtos não precisam configurá-los. Apesar de desejarmos dar um servidor dedicado a todos os usuários do React, mesmo o Facebook não pode escalar tão bem!
145
145
146
-
The React community is very important to us. We knew that we couldn’t fix the problem within the limits of our open source philosophy. This is why we decided to make an exception, and to ship something that we didn’t use ourselves, but that we thought would be useful to the community.
146
+
A comunidade React é muito importante para nós. Sabíamos que não poderíamos resolver o problema dentro dos limites da nossa filosofia de código aberto. É por isso que decidimos abrir uma exceção e enviar algo que não usamos, mas achamos que seria útil para a comunidade.
147
147
148
-
## The Quest for a React <abbrtitle="Command Line Interface">CLI</abbr> {#the-quest-for-a-react-abbr-titlecommand-line-interfacecliabbr}
148
+
## A Busca por um React <abbrtitle="Interface de Linha de Comando">CLI</abbr> {#the-quest-for-a-react-abbr-titlecommand-line-interfacecliabbr}
149
149
150
-
Having just attended [EmberCamp](http://embercamp.com/)a week ago, I was excited about [Ember CLI](https://ember-cli.com/). Ember users have a great “getting started” experience thanks to a curated set of tools united under a single command-line interface. I have heard similar feedback about[Elm Reactor](https://github.com/elm-lang/elm-reactor).
150
+
Tendo acabado de assistir a [EmberCamp](http://embercamp.com/)há uma semana, fiquei animado com [Ember CLI](https://ember-cli.com/). Os usuários da Ember têm uma ótima experiência de "introdução" graças a um conjunto de ferramentas unidas sob uma única interface de linha de comando. Eu ouvi comentários semelhantes sobre[Elm Reactor](https://github.com/elm-lang/elm-reactor).
151
151
152
-
Providing a cohesive curated experience is valuable by itself, even if the user could in theory assemble those parts themselves. Kathy Sierra [explains it best](http://seriouspony.com/blog/2013/7/24/your-app-makes-me-fat):
152
+
Proporcionar uma experiência coesa e curada é valioso por si só, mesmo que o usuário possa, em teoria, montar essas partes. Kathy Sierra [explica melhor](http://seriouspony.com/blog/2013/7/24/your-app-makes-me-fat):
153
153
154
154
>If your UX asks the user to make *choices*, for example, even if those choices are both clear and useful, the act of *deciding* is a cognitive drain. And not just *while* they’re deciding... even *after* we choose, an unconscious cognitive background thread is slowly consuming/leaking resources, “Was *that* the right choice?”
155
155
156
-
I never tried to write a command-line tool for React apps, and neither has [Christopher](https://twitter.com/vjeux). We were chatting on Messenger about this idea, and we decided to work together on it for a week as a hackathon project.
156
+
Eu nunca tentei escrever uma ferramenta de linha de comando para aplicativos React, e nem [Christopher](https://twitter.com/vjeux). Estávamos conversando sobre o Messenger sobre essa ideia e decidimos trabalhar juntos por uma semana como um projeto de hackathon.
157
157
158
-
We knew that such projects traditionally haven’t been very successful in the React ecosystem. Christopher told me that multiple “React CLI” projects have started and failed at Facebook. The community tools with similar goals also exist, but so far they have not yet gained enough traction.
158
+
Sabíamos que tais projetos tradicionalmente não tiveram muito sucesso no ecossistema React. Christopher me disse que vários projetos “React CLI” começaram e falharam no Facebook. As ferramentas da comunidade com objetivos similares também existem, mas até agora elas ainda não ganharam tração suficiente.
159
159
160
-
Still, we decided it was worth another shot. Christopher and I created a very rough proof of concept on the weekend, and[Kevin](https://twitter.com/lacker)soon joined us.
160
+
Ainda assim, decidimos que valeria outra chance. Christopher e eu criamos uma prova de conceito muito difícil no fim de semana, e[Kevin](https://twitter.com/lacker)logo se juntou a nós.
161
161
162
-
We invited some of the community members to collaborate with us, and we have spent this week working on this tool. We hope that you’ll enjoy using it! [Let us know what you think.](https://github.com/facebookincubator/create-react-app/issues/11)
162
+
Convidamos alguns membros da comunidade para colaborar conosco e passamos essa semana trabalhando nessa ferramenta. Esperamos que você goste de usá-lo! [Deixe-nos saber o que você pensa.](https://github.com/facebookincubator/create-react-app/issues/11)
163
163
164
-
We would like to express our gratitude to [Max Stoiber](https://twitter.com/mxstbr), [Jonny Buchanan](https://twitter.com/jbscript), [Ean Platter](https://twitter.com/eanplatter), [Tyler McGinnis](https://github.com/tylermcginnis), [Kent C. Dodds](https://github.com/kentcdodds), and[Eric Clemmons](https://twitter.com/ericclemmons)for their early feedback, ideas, and contributions.
164
+
Gostaríamos de expressar nossa gratidão a [Max Stoiber](https://twitter.com/mxstbr), [Jonny Buchanan](https://twitter.com/jbscript), [Ean Platter](https://twitter.com/eanplatter), [Tyler McGinnis](https://github.com/tylermcginnis), [Kent C. Dodds](https://github.com/kentcdodds) e[Eric Clemmons](https://twitter.com/ericclemmons)pelo feedback, ideias e contribuições iniciais.
0 commit comments