Skip to content

Fix inconsistencies in homepage #166

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
Feb 17, 2019
Merged
Show file tree
Hide file tree
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
8 changes: 4 additions & 4 deletions content/home/examples/a-component-using-external-plugins.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ class MarkdownEditor extends React.Component {
constructor(props) {
super(props);
this.handleChange = this.handleChange.bind(this);
this.state = { value: 'Hello, **world**!' };
this.state = { value: '¡Hola **mundo**!' };
}

handleChange(e) {
Expand All @@ -17,16 +17,16 @@ class MarkdownEditor extends React.Component {
render() {
return (
<div className="MarkdownEditor">
<h3>Input</h3>
<h3>Entrada</h3>
<label htmlFor="markdown-content">
Enter some markdown
Introduce algún texto en markdown
</label>
<textarea
id="markdown-content"
onChange={this.handleChange}
defaultValue={this.state.value}
/>
<h3>Output</h3>
<h3>Salida</h3>
<div
className="content"
dangerouslySetInnerHTML={this.getRawMarkup()}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
---
title: Un componente usando Plugins externos
title: Un componente usando plugins externos
order: 3
domid: markdown-example
---
Expand Down
2 changes: 1 addition & 1 deletion content/home/examples/a-simple-component.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ class HelloMessage extends React.Component {
render() {
return (
<div>
Hello {this.props.name}
Hola {this.props.name}
</div>
);
}
Expand Down
4 changes: 2 additions & 2 deletions content/home/examples/a-simple-component.md
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
---
title: Un Componente Simple
title: Un componente simple
order: 0
domid: hello-example
---

Los componentes de React implementan un método llamado`render()` que recibe datos de entrada y los muestra. Este ejemplo utiliza una sintaxis similar a XML llamada JSX. Puedes acceder a los datos de entrada que se pasan al componente mediante `render()` a través de `this.props`.

**JSX es opcional y no se requiere para usar React.** Prueba [Babel REPL](babel://es5-syntax-example) para ver el código JavaScript sin procesar la compilación de JSX.
**JSX es opcional y no se requiere para usar React.** Prueba [Babel REPL](babel://es5-syntax-example) para ver el código JavaScript simple producto de la compilación de JSX.
2 changes: 1 addition & 1 deletion content/home/examples/a-stateful-component.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ class Timer extends React.Component {
render() {
return (
<div>
Seconds: {this.state.seconds}
Segundos: {this.state.seconds}
</div>
);
}
Expand Down
4 changes: 2 additions & 2 deletions content/home/examples/a-stateful-component.md
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
---
title: Un Componente Con Estado
title: Un componente con estado
order: 1
domid: timer-example
---

Además de obtener datos de entrada (a los que accedes a través de `this.props`),un componente puede tener datos en su estado internamente (a los que accedes a través de `this.state`). Cuando el estado del componente cambie de datos, el cambio se representará actualizando e invocando `render()`.
Además de obtener datos de entrada (a los que accedes a través de `this.props`),un componente puede tener datos en su estado internamente (a los que accedes a través de `this.state`). Cuando el estado del componente cambie de datos, el resultado se actualiza volviendo a invocar a `render()`.
6 changes: 3 additions & 3 deletions content/home/examples/an-application.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,19 +9,19 @@ class TodoApp extends React.Component {
render() {
return (
<div>
<h3>TODO</h3>
<h3>Tareas pendientes</h3>
<TodoList items={this.state.items} />
<form onSubmit={this.handleSubmit}>
<label htmlFor="new-todo">
What needs to be done?
¿Qué se necesita hacer?
</label>
<input
id="new-todo"
onChange={this.handleChange}
value={this.state.text}
/>
<button>
Add #{this.state.items.length + 1}
Añadir #{this.state.items.length + 1}
</button>
</form>
</div>
Expand Down
2 changes: 1 addition & 1 deletion content/home/examples/an-application.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,4 +4,4 @@ order: 2
domid: todos-example
---

Usando `props` y `state`, podemos integrar todo en una pequeña aplicación de tareas pendientes. Este ejemplo usa `state` para tener un control de la lista actual de objetos así como el texto que el usuario ha ingresado. A pesar de que los event handlers parecen ser renderizados inline, serán recolectados e implementados usando delegación de eventos.
Usando `props` y `state`, podemos integrar todo en una pequeña aplicación de tareas pendientes. Este ejemplo usa `state` para tener un control de la lista actual de objetos así como el texto que el usuario ha ingresado. A pesar de que los manejadores de eventos parecen ser renderizados en línea, serán recolectados e implementados usando delegación de eventos.
4 changes: 2 additions & 2 deletions content/home/marketing/learn-once-write-anywhere.md
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
---
title: Aprende una vez, Escríbelo donde sea
title: Aprende una vez, escríbelo donde sea
order: 2
---

En React no dejamos fuera al resto de sus herramientas tecnológicas, así que podrás desarrollar nuevas características sin necesidad de volver a escribir el código existente.
En React no dejamos fuera al resto de tus herramientas tecnológicas, así que podrás desarrollar nuevas características sin necesidad de volver a escribir el código existente.

React puede también renderizar desde el servidor usando Node, así como potencializar aplicaciones móviles usando
[React Native](https://facebook.github.io/react-native/).