chore(i18n,curriculum): processed translations (#44319)
This commit is contained in:
camperbot
GitHub
@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 589a69f5f9fc0f352b528e71
|
||||
title: Implementation of Social Authentication II
|
||||
title: Implementación de la autentificación social II
|
||||
challengeType: 2
|
||||
forumTopicId: 301557
|
||||
dashedName: implementation-of-social-authentication-ii
|
||||
@ -8,11 +8,11 @@ dashedName: implementation-of-social-authentication-ii
|
||||
|
||||
# --description--
|
||||
|
||||
The last part of setting up your GitHub authentication is to create the strategy itself. For this, you will need to add the dependency of `passport-github@~1.1.0` to your project and require it in your `auth.js` as `GithubStrategy` like this: `const GitHubStrategy = require('passport-github').Strategy;`. Do not forget to require and configure `dotenv` to use your environment variables.
|
||||
La última parte de configurar tu autentificación de GitHub es crear la propia estrategia. Para esto, necesitarás agregar la dependencia de `passport-github@~1.1.0` a tu proyecto y requiérelo en tu `auth.js` como `GithubStrategy` así: `const GitHubStrategy = require('passport-github').Strategy;`. No olvides requerir y configurar `dotenv` para usar tus variables de entorno.
|
||||
|
||||
To set up the GitHub strategy, you have to tell Passport to use an instantiated `GitHubStrategy`, which accepts 2 arguments: an object (containing `clientID`, `clientSecret`, and `callbackURL`) and a function to be called when a user is successfully authenticated, which will determine if the user is new and what fields to save initially in the user's database object. This is common across many strategies, but some may require more information as outlined in that specific strategy's GitHub README. For example, Google requires a *scope* as well which determines what kind of information your request is asking to be returned and asks the user to approve such access. The current strategy we are implementing has its usage outlined [here](https://github.com/jaredhanson/passport-github/), but we're going through it all right here on freeCodeCamp!
|
||||
Para configurar la estrategia de GitHub, debes decirle a Passport que utilice una instancia de `GitHubStrategy`, que acepta 2 argumentos: un objeto (que contiene `clientID`, `clientSecret`, y `callbackURL`) y una función a ser llamada cuando un usuario es autentificado con éxito, que determinará si el usuario es nuevo y qué campos guardar inicialmente en el objeto de base de datos del usuario. Esto es común en muchas estrategias, pero algunas pueden requerir más información como se indica en el README de GitHub de esa estrategia específica. Por ejemplo, Google requiere un *ámbito* también que determina qué tipo de información está pidiendo que se le devuelva y pide al usuario que apruebe dicho acceso. La estrategia actual que estamos implementando tiene su uso descrito [aquí](https://github.com/jaredhanson/passport-github/), ¡pero estamos pasando por todo aquí mismo en freeCodeCamp!
|
||||
|
||||
Here's how your new strategy should look at this point:
|
||||
Así es como debe ser tu nueva estrategia en este punto:
|
||||
|
||||
```js
|
||||
passport.use(new GitHubStrategy({
|
||||
@ -27,13 +27,13 @@ passport.use(new GitHubStrategy({
|
||||
));
|
||||
```
|
||||
|
||||
Your authentication won't be successful yet, and it will actually throw an error without the database logic and callback, but it should log your GitHub profile to your console if you try it!
|
||||
Tu autentificación no tendrá éxito todavía, y de hecho lanzará un error sin la lógica de la base de datos y el callback, ¡pero debería registrar tu perfil de GitHub en tu consola si lo intentas!
|
||||
|
||||
Submit your page when you think you've got it right. If you're running into errors, you can check out the project completed up to this point [here](https://gist.github.com/camperbot/ff3a1166684c1b184709ac0bee30dee6).
|
||||
Envía tu página cuando creas que lo has hecho bien. Si te encuentras con errores, puedes revisar el proyecto completado hasta este punto [aquí](https://gist.github.com/camperbot/ff3a1166684c1b184709ac0bee30dee6).
|
||||
|
||||
# --hints--
|
||||
|
||||
passport-github dependency should be added.
|
||||
debe añadirse la dependencia passport-github.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -52,7 +52,7 @@ passport-github dependency should be added.
|
||||
);
|
||||
```
|
||||
|
||||
passport-github should be required.
|
||||
passport-github debe ser requerido.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -70,7 +70,7 @@ passport-github should be required.
|
||||
);
|
||||
```
|
||||
|
||||
GitHub strategy should be setup correctly thus far.
|
||||
La estrategia de GitHub debe configurarse correctamente hasta ahora.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -88,12 +88,12 @@ GitHub strategy should be setup correctly thus far.
|
||||
);
|
||||
assert.match(
|
||||
data,
|
||||
/process.env.GITHUB_CLIENT_SECRET/g,
|
||||
/process\.env(\.GITHUB_CLIENT_SECRET|\[(?<q>"|')GITHUB_CLIENT_SECRET\k<q>\])/g,
|
||||
'You should use process.env.GITHUB_CLIENT_SECRET'
|
||||
);
|
||||
assert.match(
|
||||
data,
|
||||
/process.env.GITHUB_CLIENT_ID/g,
|
||||
/process\.env(\.GITHUB_CLIENT_ID|\[(?<q>"|')GITHUB_CLIENT_ID\k<q>\])/g,
|
||||
'You should use process.env.GITHUB_CLIENT_ID'
|
||||
);
|
||||
},
|
||||
@ -107,8 +107,8 @@ GitHub strategy should be setup correctly thus far.
|
||||
|
||||
```js
|
||||
/**
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Backend challenges don't need solutions,
|
||||
because they would need to be tested against a full working project.
|
||||
Please check our contributing guidelines to learn more.
|
||||
*/
|
||||
```
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 589a8eb3f9fc0f352b528e72
|
||||
title: Implementation of Social Authentication III
|
||||
title: Implementación de la autentificación social III
|
||||
challengeType: 2
|
||||
forumTopicId: 301558
|
||||
dashedName: implementation-of-social-authentication-iii
|
||||
@ -8,7 +8,7 @@ dashedName: implementation-of-social-authentication-iii
|
||||
|
||||
# --description--
|
||||
|
||||
The final part of the strategy is handling the profile returned from GitHub. We need to load the user's database object if it exists, or create one if it doesn't, and populate the fields from the profile, then return the user's object. GitHub supplies us a unique *id* within each profile which we can use to search with to serialize the user with (already implemented). Below is an example implementation you can use in your project--it goes within the function that is the second argument for the new strategy, right below where `console.log(profile);` currently is:
|
||||
La parte final de la estrategia es la gestión del perfil devuelto por GitHub. Necesitamos cargar el objeto de la base de datos del usuario si existe, o crear uno si no existe, y rellenar los campos del perfil, luego devolver el objeto del usuario. GitHub nos proporciona un *id* único dentro de cada perfil con el que podemos buscar para serializar el usuario (ya implementado). A continuación hay un ejemplo de implementación que puedes usar en tu proyecto: se incluye dentro de la función que es el segundo argumento de la nueva estrategia, justo debajo de donde está actualmente `console.log(profile);`:
|
||||
|
||||
```js
|
||||
myDataBase.findOneAndUpdate(
|
||||
@ -38,15 +38,15 @@ myDataBase.findOneAndUpdate(
|
||||
);
|
||||
```
|
||||
|
||||
`findOneAndUpdate` allows you to search for an object and update it. If the object doesn't exist, it will be inserted and made available to the callback function. In this example, we always set `last_login`, increment the `login_count` by `1`, and only populate the majority of the fields when a new object (new user) is inserted. Notice the use of default values. Sometimes a profile returned won't have all the information filled out or the user will keep it private. In this case, you handle it to prevent an error.
|
||||
`findOneAndUpdate` te permite buscar un objeto y actualizarlo. Si el objeto no existe, será insertado y puesto a disposición de la función callback. En este ejemplo, siempre establecemos `last_login`, incrementamos el `login_count` por `1`, y sólo rellenamos la mayoría de los campos cuando se inserta un nuevo objeto (nuevo usuario). Ten en cuenta el uso de valores predeterminados. A veces un perfil devuelto no tendrá toda la información rellenada o el usuario la mantendrá privada. En este caso, lo gestionas para prevenir un error.
|
||||
|
||||
You should be able to login to your app now--try it!
|
||||
Deberías ser capaz de iniciar sesión en tu aplicación ahora... ¡pruébalo!
|
||||
|
||||
Submit your page when you think you've got it right. If you're running into errors, you can check out the project completed up to this point [here](https://gist.github.com/camperbot/183e968f0e01d81dde015d45ba9d2745).
|
||||
Envía tu página cuando creas que lo has hecho bien. Si te encuentras con errores, puedes revisar el proyecto completado hasta este punto [aquí](https://gist.github.com/camperbot/183e968f0e01d81dde015d45ba9d2745).
|
||||
|
||||
# --hints--
|
||||
|
||||
GitHub strategy setup should be complete.
|
||||
La configuración de la estrategia de GitHub debe estar completa.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 58965611f9fc0f352b528e6c
|
||||
title: Logging a User Out
|
||||
title: Cierra la sesión de un usuario
|
||||
challengeType: 2
|
||||
forumTopicId: 301560
|
||||
dashedName: logging-a-user-out
|
||||
@ -8,9 +8,9 @@ dashedName: logging-a-user-out
|
||||
|
||||
# --description--
|
||||
|
||||
Creating the logout logic is easy. The route should just unauthenticate the user and redirect to the home page instead of rendering any view.
|
||||
Crear la lógica de cierre de sesión es fácil. La ruta sólo debe desautentificar al usuario y redirigir a la página principal en lugar de mostrar cualquier vista.
|
||||
|
||||
In passport, unauthenticating a user is as easy as just calling `req.logout();` before redirecting.
|
||||
En passport, desautentificar un usuario es tan fácil como llamar a `req.logout();` antes de redireccionar.
|
||||
|
||||
```js
|
||||
app.route('/logout')
|
||||
@ -20,7 +20,7 @@ app.route('/logout')
|
||||
});
|
||||
```
|
||||
|
||||
You may have noticed that we're not handling missing pages (404). The common way to handle this in Node is with the following middleware. Go ahead and add this in after all your other routes:
|
||||
Puede que hayas notado que no estamos manejando páginas faltantes (404). La forma común de manejar esto en Node es con el siguiente middleware. Sigue adelante y añade esto después de todas tus rutas:
|
||||
|
||||
```js
|
||||
app.use((req, res, next) => {
|
||||
@ -30,11 +30,11 @@ app.use((req, res, next) => {
|
||||
});
|
||||
```
|
||||
|
||||
Submit your page when you think you've got it right. If you're running into errors, you can check out the project completed up to this point [here](https://gist.github.com/camperbot/c3eeb8a3ebf855e021fd0c044095a23b).
|
||||
Envía tu página cuando creas que lo has hecho bien. Si te encuentras con errores, puedes revisar el proyecto completado hasta este punto [aquí](https://gist.github.com/camperbot/c3eeb8a3ebf855e021fd0c044095a23b).
|
||||
|
||||
# --hints--
|
||||
|
||||
`req.Logout` should be called in your `/logout` route.
|
||||
`req.Logout` debe ser llamado en la ruta `/logout`.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -52,7 +52,7 @@ Submit your page when you think you've got it right. If you're running into erro
|
||||
);
|
||||
```
|
||||
|
||||
Logout should redirect to the home page.
|
||||
Cerrar sesión debe redirigir a la página de inicio.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 58966a17f9fc0f352b528e6d
|
||||
title: Registration of New Users
|
||||
title: Registro de nuevos usuarios
|
||||
challengeType: 2
|
||||
forumTopicId: 301561
|
||||
dashedName: registration-of-new-users
|
||||
@ -8,11 +8,11 @@ dashedName: registration-of-new-users
|
||||
|
||||
# --description--
|
||||
|
||||
Now we need to allow a new user on our site to register an account. On the `res.render` for the home page add a new variable to the object passed along--`showRegistration: true`. When you refresh your page, you should then see the registration form that was already created in your `index.pug` file! This form is set up to **POST** on `/register`, so this is where we should set up to accept the **POST** and create the user object in the database.
|
||||
Ahora tenemos que permitir que un nuevo usuario en nuestro sitio registre una cuenta. En el `res.render` de la página de inicio agrega una nueva variable al objeto pasado: `showRegistration: true`. Cuando actualices tu página, ¡debes ver el formulario de registro que ya fue creado en tu archivo `index.pug`! Este formulario está configurado para hacer una petición **POST** en `/register`, así que aquí es donde debemos configurar para aceptar el **POST** y crear el objeto usuario en la base de datos.
|
||||
|
||||
The logic of the registration route should be as follows: Register the new user > Authenticate the new user > Redirect to /profile
|
||||
La lógica de la ruta de registro debe ser la siguiente: Registrar al nuevo usuario > Autentificar al nuevo usuario > Redirigir a /profile
|
||||
|
||||
The logic of step 1, registering the new user, should be as follows: Query database with a findOne command > if user is returned then it exists and redirect back to home *OR* if user is undefined and no error occurs then 'insertOne' into the database with the username and password, and, as long as no errors occur, call *next* to go to step 2, authenticating the new user, which we've already written the logic for in our POST */login* route.
|
||||
La lógica del paso 1, el registro del nuevo usuario, debe ser la siguiente: Consultar la base de datos con un comando findOne > si el usuario es devuelto entonces existe y redirige de nuevo a la página de inicio *OR* si el usuario es indefinido y no se produce ningún error entonces 'insertOne' en la base de datos con el nombre de usuario y la contraseña, y, siempre que no se produzcan errores, llamar a *next* para ir al paso 2, autentificar al nuevo usuario, para lo que ya hemos escrito la lógica en nuestra ruta POST */login*.
|
||||
|
||||
```js
|
||||
app.route('/register')
|
||||
@ -47,13 +47,13 @@ app.route('/register')
|
||||
);
|
||||
```
|
||||
|
||||
Submit your page when you think you've got it right. If you're running into errors, you can check out the project completed up to this point [here](https://gist.github.com/camperbot/b230a5b3bbc89b1fa0ce32a2aa7b083e).
|
||||
Envía tu página cuando creas que lo has hecho bien. Si te encuentras con errores, puedes revisar el proyecto completado hasta este punto [aquí](https://gist.github.com/camperbot/b230a5b3bbc89b1fa0ce32a2aa7b083e).
|
||||
|
||||
**NOTE:** From this point onwards, issues can arise relating to the use of the *picture-in-picture* browser. If you are using an online IDE which offers a preview of the app within the editor, it is recommended to open this preview in a new tab.
|
||||
**NOTA:** A partir de este punto, pueden surgir problemas relacionados con el uso del navegador *picture-in-picture*. Si está utilizando un IDE en línea que ofrece una vista previa de la aplicación dentro del editor, se recomienda abrir esta vista previa en una nueva pestaña.
|
||||
|
||||
# --hints--
|
||||
|
||||
You should register route and display on home.
|
||||
Debes registrar la ruta y mostrarla en la página de inicio.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -76,7 +76,7 @@ You should register route and display on home.
|
||||
);
|
||||
```
|
||||
|
||||
Registering should work.
|
||||
El registro debe funcionar.
|
||||
|
||||
```js
|
||||
async (getUserInput) => {
|
||||
@ -104,7 +104,7 @@ async (getUserInput) => {
|
||||
};
|
||||
```
|
||||
|
||||
Login should work.
|
||||
El inicio de sesión debe funcionar.
|
||||
|
||||
```js
|
||||
async (getUserInput) => {
|
||||
@ -153,7 +153,7 @@ async (getUserInput) => {
|
||||
};
|
||||
```
|
||||
|
||||
Logout should work.
|
||||
El cierre de sesión debe funcionar.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -171,7 +171,7 @@ Logout should work.
|
||||
);
|
||||
```
|
||||
|
||||
Profile should no longer work after logout.
|
||||
El perfil ya no debe funcionar después de cerrar la sesión.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 589fc832f9fc0f352b528e79
|
||||
title: Send and Display Chat Messages
|
||||
title: Envía y muestra mensajes de chat
|
||||
challengeType: 2
|
||||
forumTopicId: 301562
|
||||
dashedName: send-and-display-chat-messages
|
||||
@ -8,7 +8,7 @@ dashedName: send-and-display-chat-messages
|
||||
|
||||
# --description--
|
||||
|
||||
It's time you start allowing clients to send a chat message to the server to emit to all the clients! In your `client.js` file, you should see there is already a block of code handling when the message form is submitted.
|
||||
¡Es hora de que empieces a permitir que los clientes envíen un mensaje de chat al servidor para emitir a todos los clientes! En tu archivo `client.js`, debes ver que ya hay un bloque de gestión de código cuando se envía el formulario de mensaje.
|
||||
|
||||
```js
|
||||
$('form').submit(function() {
|
||||
@ -16,23 +16,23 @@ $('form').submit(function() {
|
||||
});
|
||||
```
|
||||
|
||||
Within the form submit code, you should emit an event after you define `messageToSend` but before you clear the text box `#m`. The event should be named `'chat message'` and the data should just be `messageToSend`.
|
||||
Dentro del código de envío del formulario, debes emitir un evento después de definir `messageToSend` pero antes de borrar el cuadro de texto `#m`. El evento debe llamarse `'chat message'` y los datos deben ser `messageToSend`.
|
||||
|
||||
```js
|
||||
socket.emit('chat message', messageToSend);
|
||||
```
|
||||
|
||||
Now, on your server, you should be listening to the socket for the event `'chat message'` with the data being named `message`. Once the event is received, it should emit the event `'chat message'` to all sockets `io.emit` with the data being an object containing `name` and `message`.
|
||||
Ahora, en tu servidor, debes estar escuchando el socket para el evento `'chat message'` con los datos que se llaman `message`. Una vez que el evento sea recibido, debe emitir el evento `'chat message'` a todos los sockets `io.emit` siendo los datos un objeto que contiene `name` y `message`.
|
||||
|
||||
In `client.js`, you should now listen for event `'chat message'` and, when received, append a list item to `#messages` with the name, a colon, and the message!
|
||||
En `client.js`, ahora debes escuchar el evento `'chat message'` y, una vez recibido, ¡Añade un elemento de lista a `#messages` con el nombre, los dos y el mensaje!
|
||||
|
||||
At this point, the chat should be fully functional and sending messages across all clients!
|
||||
En este punto, ¡el chat debe ser totalmente funcional y enviar mensajes a todos los clientes!
|
||||
|
||||
Submit your page when you think you've got it right. If you're running into errors, you can check out the project completed up to this point [here](https://gist.github.com/camperbot/d7af9864375207e254f73262976d2016).
|
||||
Envía tu página cuando creas que lo has hecho bien. Si te encuentras con errores, puedes revisar el proyecto completado hasta este punto [aquí](https://gist.github.com/camperbot/d7af9864375207e254f73262976d2016).
|
||||
|
||||
# --hints--
|
||||
|
||||
Server should listen for `'chat message'` and then emit it properly.
|
||||
El servidor debe escuchar `'chat message'` y luego emitirlo correctamente.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -50,7 +50,7 @@ Server should listen for `'chat message'` and then emit it properly.
|
||||
);
|
||||
```
|
||||
|
||||
Client should properly handle and display the new data from event `'chat message'`.
|
||||
El cliente debe gestionar y mostrar correctamente los nuevos datos del evento `'chat message'`.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 5895f70cf9fc0f352b528e66
|
||||
title: Serialization of a User Object
|
||||
title: Serialización de un objeto de usuario
|
||||
challengeType: 2
|
||||
forumTopicId: 301563
|
||||
dashedName: serialization-of-a-user-object
|
||||
@ -8,11 +8,11 @@ dashedName: serialization-of-a-user-object
|
||||
|
||||
# --description--
|
||||
|
||||
Serialization and deserialization are important concepts in regards to authentication. To serialize an object means to convert its contents into a small *key* that can then be deserialized into the original object. This is what allows us to know who has communicated with the server without having to send the authentication data, like the username and password, at each request for a new page.
|
||||
Serialización y deserialización son conceptos importantes en lo que respecta a la autentificación. Para serializar un objeto significa convertir su contenido en una pequeña *key* que puede ser deserializada en el objeto original. Esto es lo que nos permite saber quién se ha comunicado con el servidor sin tener que enviar los datos de autentificación, como el nombre de usuario y la contraseña, en cada petición de una nueva página.
|
||||
|
||||
To set this up properly, we need to have a serialize function and a deserialize function. In Passport, we create these with `passport.serializeUser( OURFUNCTION )` and `passport.deserializeUser( OURFUNCTION )`
|
||||
Para configurarlo correctamente, necesitamos tener una función serializada y una función deserializada. En Passport los creamos con `passport.serializeUser( OURFUNCTION )` y `passport.deserializeUser( OURFUNCTION )`
|
||||
|
||||
The `serializeUser` is called with 2 arguments, the full user object and a callback used by passport. A unique key to identify that user should be returned in the callback, the easiest one to use being the user's `_id` in the object. It should be unique as it is generated by MongoDB. Similarly, `deserializeUser` is called with that key and a callback function for passport as well, but, this time, we have to take that key and return the full user object to the callback. To make a query search for a Mongo `_id`, you will have to create `const ObjectID = require('mongodb').ObjectID;`, and then to use it you call `new ObjectID(THE_ID)`. Be sure to add `mongodb@~3.6.0` as a dependency. You can see this in the examples below:
|
||||
El `serializeUser` es llamado con 2 argumentos, el objeto de usuario completo y un callback usado por passport. Una clave única para identificar que el usuario debe ser devuelto en el callback, el más fácil de usar es el `_id` del usuario en el objeto. Debe ser único ya que es generado por MongoDB. De manera similar, `deserializeUser` es llamado con esa clave y también una función de callback para passport, pero, esta vez, tenemos que tomar esa clave y devolver el objeto de usuario completo al callback. Para hacer una consulta de búsqueda para Mongo `_id`, tendrás que crear `const ObjectID = require('mongodb').ObjectID;`, y para usarlo llama a `new ObjectID(THE_ID)`. Asegúrate de agregar `mongodb@~3.6.0` como una dependencia. Puedes ver esto en los ejemplos siguientes:
|
||||
|
||||
```js
|
||||
passport.serializeUser((user, done) => {
|
||||
@ -26,13 +26,13 @@ passport.deserializeUser((id, done) => {
|
||||
});
|
||||
```
|
||||
|
||||
NOTE: This `deserializeUser` will throw an error until we set up the DB in the next step, so for now comment out the whole block and just call `done(null, null)` in the function `deserializeUser`.
|
||||
NOTA: Este `deserializeUser` arrojará un error hasta que establezcamos la BD en el siguiente paso, así que por ahora comenta todo el bloque y simplemente llama a `done(null, null)` en la función `deserializeUser`.
|
||||
|
||||
Submit your page when you think you've got it right. If you're running into errors, you can check out the project completed up to this point [here](https://gist.github.com/camperbot/7068a0d09e61ec7424572b366751f048).
|
||||
Envía tu página cuando creas que lo has hecho bien. Si te encuentras con errores, puedes revisar el proyecto completado hasta este punto [aquí](https://gist.github.com/camperbot/7068a0d09e61ec7424572b366751f048).
|
||||
|
||||
# --hints--
|
||||
|
||||
You should serialize user function correctly.
|
||||
Debes serializar correctamente la función de usuario.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -55,7 +55,7 @@ You should serialize user function correctly.
|
||||
);
|
||||
```
|
||||
|
||||
You should deserialize user function correctly.
|
||||
Debes deserializar correctamente la función de usuario.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -78,7 +78,7 @@ You should deserialize user function correctly.
|
||||
);
|
||||
```
|
||||
|
||||
MongoDB should be a dependency.
|
||||
MongoDB debe ser una dependencia.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -97,7 +97,7 @@ MongoDB should be a dependency.
|
||||
);
|
||||
```
|
||||
|
||||
Mongodb should be properly required including the ObjectId.
|
||||
Mongodb debe ser requerido correctamente, incluyendo el ObjectId.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
---
|
||||
id: 5895f700f9fc0f352b528e63
|
||||
title: Set up a Template Engine
|
||||
title: Configura un motor de plantillas
|
||||
challengeType: 2
|
||||
forumTopicId: 301564
|
||||
dashedName: set-up-a-template-engine
|
||||
@ -8,31 +8,31 @@ dashedName: set-up-a-template-engine
|
||||
|
||||
# --description--
|
||||
|
||||
Working on these challenges will involve you writing your code using one of the following methods:
|
||||
Trabajar en estos desafíos implica escribir tu código usando uno de los siguientes métodos:
|
||||
|
||||
- Clone [this GitHub repo](https://github.com/freeCodeCamp/boilerplate-advancednode/) and complete these challenges locally.
|
||||
- Use [our Replit starter project](https://replit.com/github/freeCodeCamp/boilerplate-advancednode) to complete these challenges.
|
||||
- Use a site builder of your choice to complete the project. Be sure to incorporate all the files from our GitHub repo.
|
||||
- Clona [este repositorio de GitHub](https://github.com/freeCodeCamp/boilerplate-advancednode/) y completa estos desafíos localmente.
|
||||
- Usa [nuestro proyecto inicial de Replit](https://replit.com/github/freeCodeCamp/boilerplate-advancednode) para completar estos desafíos.
|
||||
- Utiliza un constructor de sitios de tu elección para completar el proyecto. Asegúrate de incorporar todos los archivos de nuestro repositorio de GitHub.
|
||||
|
||||
When you are done, make sure a working demo of your project is hosted somewhere public. Then submit the URL to it in the `Solution Link` field.
|
||||
Cuando hayas terminado, asegúrate de que un demo funcional de tu proyecto esté alojado en algún lugar público. Luego, envía la URL en el campo `Solution Link`.
|
||||
|
||||
A template engine enables you to use static template files (such as those written in *Pug*) in your app. At runtime, the template engine replaces variables in a template file with actual values which can be supplied by your server. Then it transforms the template into a static HTML file that is sent to the client. This approach makes it easier to design an HTML page and allows for displaying variables on the page without needing to make an API call from the client.
|
||||
Un motor de plantillas te permite usar plantillas estáticas (como las escritas en *Pug*) en tu aplicación. En tiempo de ejecución, el motor de plantillas reemplaza variables en un archivo de plantilla con valores reales que pueden ser suministrados por tu servidor. Luego transforma la plantilla en un archivo HTML estático que se envía al cliente. Este enfoque hace más fácil el diseño de una página HTML y permite mostrar variables en la página sin necesidad de hacer una llamada API desde el cliente.
|
||||
|
||||
Add `pug@~3.0.0` as a dependency in your `package.json` file.
|
||||
Añade `pug@~3.0.0` como una dependencia en tu archivo `package.json`.
|
||||
|
||||
Express needs to know which template engine you are using. We will use the `set` method to assign `pug` as the `view engine` property's value: `app.set('view engine', 'pug')`
|
||||
Express necesita saber qué motor de plantillas está utilizando. Utilizaremos el método `set` para asignar `pug` como el valor de `view engine` de la propiedad: `app.set('view engine', 'pug')`
|
||||
|
||||
Your page will not load until you correctly render the index file in the `views/pug` directory.
|
||||
La página no se cargará hasta que procese correctamente el archivo de índice en el directorio `views/pug`.
|
||||
|
||||
Change the argument of the `res.render()` declaration in the `/` route to be the file path to the `views/pug` directory. The path can be a relative path (relative to views), or an absolute path, and does not require a file extension.
|
||||
Cambia el argumento de la sentencia `res.render()` en la ruta `/` para que sea la ruta del archivo al directorio `views/pug`. La ruta puede ser una ruta relativa (relativa a las vistas), o una ruta absoluta, y no requiere una extensión de archivo.
|
||||
|
||||
If all went as planned, your app home page will stop showing the message "`Pug template is not defined.`" and will now display a message indicating you've successfully rendered the Pug template!
|
||||
Si todo ha ido según lo previsto, ¡la página de inicio de tu aplicación dejará de mostrar el mensaje "`Pug template is not defined.`" y ahora mostrará un mensaje indicando que has renderizado con éxito la plantilla Pug!
|
||||
|
||||
Submit your page when you think you've got it right. If you're running into errors, you can check out the project completed up to this point [here](https://gist.github.com/camperbot/3515cd676ea4dfceab4e322f59a37791).
|
||||
Envía tu página cuando creas que lo has hecho bien. Si te encuentras con errores, puedes revisar el proyecto completado hasta este punto [aquí](https://gist.github.com/camperbot/3515cd676ea4dfceab4e322f59a37791).
|
||||
|
||||
# --hints--
|
||||
|
||||
Pug should be a dependency.
|
||||
Pug debe ser una dependencia.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -51,7 +51,7 @@ Pug should be a dependency.
|
||||
);
|
||||
```
|
||||
|
||||
View engine should be Pug.
|
||||
El motor de vistas debe ser Pug.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -69,7 +69,7 @@ View engine should be Pug.
|
||||
);
|
||||
```
|
||||
|
||||
Use the correct ExpressJS method to render the index page from the response.
|
||||
Utiliza el método de ExpressJS correcto para renderizar la página de índice de la respuesta.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
@ -87,7 +87,7 @@ Use the correct ExpressJS method to render the index page from the response.
|
||||
);
|
||||
```
|
||||
|
||||
Pug should be working.
|
||||
Pug debe estar funcionando.
|
||||
|
||||
```js
|
||||
(getUserInput) =>
|
||||
|
||||
@ -110,8 +110,12 @@ assert(
|
||||
test.insert(700);
|
||||
test.insert(32);
|
||||
test.insert(51);
|
||||
let result = test.print();
|
||||
return result.length == 5 ? result[0] == 700 : result[1] == 700;
|
||||
test.insert(800);
|
||||
const result = test.print();
|
||||
const solution = JSON.stringify([null,800,51,700,32,50,100]);
|
||||
const solutionWithoutNull = JSON.stringify([800,51,700,32,50,100]);
|
||||
|
||||
return (result.length == 6) ? (JSON.stringify(result) == solutionWithoutNull) : (JSON.stringify(result) == solution);
|
||||
})()
|
||||
);
|
||||
```
|
||||
|
||||
@ -9,7 +9,7 @@ dashedName: create-a-more-complex-shape-using-css-and-html
|
||||
|
||||
# --description--
|
||||
|
||||
Uma das formas mais populares do mundo é a forma de coração e, neste desafio, você criará um usando CSS puro. Mas primeiro, você precisa entender os pseudo-elementos `::before` e `::after`. ::before cria um pseudoelemento que é o primeiro filho do elemento selecionado; ::after cria um pseudoelemento que é o último filho do elemento selecionado. No exemplo a seguir, um pseudo-elemento `::before` é usado para adicionar um retângulo a um elemento com a classe `heart`:
|
||||
Uma das formas mais populares do mundo é a forma de coração e, neste desafio, você criará um usando CSS puro. Mas primeiro, você precisa entender os pseudo-elementos `::before` e `::after`. `::before` cria um pseudoelemento que é o primeiro filho do elemento selecionado; `::after` cria um pseudoelemento que é o último filho do elemento selecionado. No exemplo a seguir, um pseudo-elemento `::before` é usado para adicionar um retângulo a um elemento com a classe `heart`:
|
||||
|
||||
```css
|
||||
.heart::before {
|
||||
|
||||
@ -8,13 +8,58 @@ dashedName: demographic-data-analyzer
|
||||
|
||||
# --description--
|
||||
|
||||
Neste desafio você deve analisar dados demográficos usando o Pandas. Você receberá um conjunto de dados relativos aos dados demográficos que foram extraídos do banco de dados do censo de 1994.
|
||||
Você [trabalhará neste projeto com nosso código inicial do Replit](https://replit.com/github/freeCodeCamp/boilerplate-demographic-data-analyzer).
|
||||
|
||||
Você pode acessar [a descrição completa do projeto e o código inicial no Replit](https://replit.com/github/freeCodeCamp/boilerplate-demographic-data-analyzer).
|
||||
Ainda estamos desenvolvendo a parte instrucional interativa do currículo Python. Por enquanto, aqui estão alguns vídeos no canal do freeCodeCamp.org do YouTube que ensinarão tudo o que você precisa saber para completar este projeto:
|
||||
|
||||
Depois de ir para esse link, faça fork no projeto. Depois que você completar o projeto com base nas instruções do 'README.md', envie o link do seu projeto abaixo.
|
||||
- [Curso de Python em vídeo para todos](https://www.freecodecamp.org/news/python-for-everybody/) (14 horas)
|
||||
- [Curso Aprenda Python em vídeo](https://www.freecodecamp.org/news/learn-python-video-course/) (10 horas)
|
||||
|
||||
Ainda estamos desenvolvendo a parte instrucional interativa do currículo de análise de dados com Python. Por enquanto, você terá que usar outros recursos para aprender a vencer este desafio.
|
||||
# --instructions--
|
||||
|
||||
Neste desafio você deve analisar dados demográficos usando o Pandas. Você receberá um conjunto de dados relativos aos dados demográficos que foram extraídos do banco de dados do censo de 1994. Aqui está um exemplo de como os dados ficariam:
|
||||
|
||||
```markdown
|
||||
| | age | workclass | fnlwgt | education | education-num | marital-status | occupation | relationship | race | sex | capital-gain | capital-loss | hours-per-week | native-country | salary |
|
||||
|---:|------:|:-----------------|---------:|:------------|----------------:|:-------------------|:------------------|:---------------|:-------|:-------|---------------:|---------------:|-----------------:|:-----------------|:---------|
|
||||
| 0 | 39 | State-gov | 77516 | Bachelors | 13 | Never-married | Adm-clerical | Not-in-family | White | Male | 2174 | 0 | 40 | United-States | <=50K |
|
||||
| 1 | 50 | Self-emp-not-inc | 83311 | Bachelors | 13 | Married-civ-spouse | Exec-managerial | Husband | White | Male | 0 | 0 | 13 | United-States | <=50K |
|
||||
| 2 | 38 | Private | 215646 | HS-grad | 9 | Divorced | Handlers-cleaners | Not-in-family | White | Male | 0 | 0 | 40 | United-States | <=50K |
|
||||
| 3 | 53 | Private | 234721 | 11th | 7 | Married-civ-spouse | Handlers-cleaners | Husband | Black | Male | 0 | 0 | 40 | United-States | <=50K |
|
||||
| 4 | 28 | Private | 338409 | Bachelors | 13 | Married-civ-spouse | Prof-specialty | Wife | Black | Female | 0 | 0 | 40 | Cuba | <=50K |
|
||||
```
|
||||
|
||||
Você deve usar o Pandas para responder as seguintes questões:
|
||||
|
||||
- Quantas pessoas de cada raça estão representadas neste dataset? Esta deve ser uma série Pandas com nomes das raças como rótulos de índice. (coluna `race`)
|
||||
- Qual é a média de idade dos homens?
|
||||
- Qual é a porcentagem de pessoas que têm um diploma de bacharel?
|
||||
- Qual é a porcentagem de pessoas com educação superior (`Bachelors`, `Masters`, ou `Doctorate` - graduados, mestres e doutores, respectivamente) que ganham mais de 50 mil?
|
||||
- Qual é a porcentagem de pessoas sem educação superior que ganham mais de 50 mil?
|
||||
- Qual é o número mínimo de horas que uma pessoa trabalha por semana?
|
||||
- Qual é a porcentagem das pessoas que trabalham o número mínimo de horas por semana e que têm um salário superior a 50 mil?
|
||||
- Qual país tem a maior porcentagem de pessoas que ganham > 50mil e qual é essa porcentagem?
|
||||
- Identifique a ocupação mais popular entre aqueles que ganham > 50 mil na Índia.
|
||||
|
||||
Use o código inicial do arquivo `demographic_data_analyzer`. Atualize o código para que todas as variáveis definidas como "None" sejam definidas com o cálculo ou código apropriado. Arredonde todos os números decimais para o décimo mais próximo.
|
||||
|
||||
Os testes unitários foram escritos para você no `test_module.py`.
|
||||
|
||||
## Desenvolvimento
|
||||
|
||||
Para o desenvolvimento, você pode usar `main.py` para testar suas funções. Clique no botão "Run" e `main.py` será executado.
|
||||
|
||||
## Testes
|
||||
|
||||
Importamos os testes de `test_module.py` em `main.py` para a sua conveniência. Os testes serão executados automaticamente sempre que você clicar no botão "Run".
|
||||
|
||||
## Envio
|
||||
|
||||
Copie o URL do seu projeto e envie-o para o freeCodeCamp.
|
||||
|
||||
## Fonte do dataset
|
||||
|
||||
Dua, D. e Graff, C. (2019). [UCI Machine Learning Repository](http://archive.ics.uci.edu/ml). Irvine, CA: University of California, School of Information and Computer Science.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@ -8,13 +8,60 @@ dashedName: mean-variance-standard-deviation-calculator
|
||||
|
||||
# --description--
|
||||
|
||||
Crie uma função que use o NumPy para retornar a média, variação e o desvio-padrão das linhas, colunas e elementos em uma matriz de 3 x 3.
|
||||
Você [trabalhará neste projeto com nosso código inicial do Replit](https://replit.com/github/freeCodeCamp/boilerplate-mean-variance-standard-deviation-calculator).
|
||||
|
||||
Você pode acessar [a descrição completa do projeto e o código inicial no Replit](https://replit.com/github/freeCodeCamp/boilerplate-mean-variance-standard-deviation-calculator).
|
||||
Ainda estamos desenvolvendo a parte instrucional interativa do currículo Python. Por enquanto, aqui estão alguns vídeos no canal do freeCodeCamp.org do YouTube que ensinarão tudo o que você precisa saber para completar este projeto:
|
||||
|
||||
Depois de ir para esse link, faça fork no projeto. Depois que você completar o projeto com base nas instruções do 'README.md', envie o link do seu projeto abaixo.
|
||||
- [Curso de Python em vídeo para todos](https://www.freecodecamp.org/news/python-for-everybody/) (14 horas)
|
||||
- [Curso Aprenda Python em vídeo](https://www.freecodecamp.org/news/learn-python-video-course/) (10 horas)
|
||||
|
||||
Ainda estamos desenvolvendo a parte instrucional interativa do currículo de análise de dados com Python. Por enquanto, você terá que usar outros recursos para aprender a vencer este desafio.
|
||||
# --instructions--
|
||||
|
||||
Crie uma função chamada `calculate()` em `mean_var_std.py` que use o Numpy para produzir a média, variância, desvio-padrão, máximo, mínimo e soma das linhas, colunas e elementos em uma matriz de 3 x 3.
|
||||
|
||||
A entrada da função deve ser uma lista com 9 algarismos. A função deve converter a lista em um array 3 x 3 do Numpy e, em seguida, retornar um dicionário contendo a média, variância, desvio padrão, máximo, mínimo e soma ao longo de ambos os eixos e para a matriz nivelada.
|
||||
|
||||
O dicionário retornado deve seguir esse formato:
|
||||
|
||||
```py
|
||||
{
|
||||
'mean': [axis1, axis2, flattened],
|
||||
'variance': [axis1, axis2, flattened],
|
||||
'standard deviation': [axis1, axis2, flattened],
|
||||
'max': [axis1, axis2, flattened],
|
||||
'min': [axis1, axis2, flattened],
|
||||
'sum': [axis1, axis2, flattened]
|
||||
}
|
||||
```
|
||||
|
||||
Se uma lista que contiver menos de 9 elementos for passada para a função, ela deve criar uma exceção `ValueError` com a mensagem: "List must contain nine numbers." (A lista deve conter nove números). Os valores do dicionário retornado devem ser listas e não matrizes do Numpy.
|
||||
|
||||
Por exemplo, `calculate([0,1,2,3,4,5,6,7,8])` deve retornar:
|
||||
|
||||
```py
|
||||
{
|
||||
'mean': [[3.0, 4.0, 5.0], [1.0, 4.0, 7.0], 4.0],
|
||||
'variance': [[6.0, 6.0, 6.0], [0.6666666666666666, 0.6666666666666666, 0.6666666666666666], 6.666666666666667],
|
||||
'standard deviation': [[2.449489742783178, 2.449489742783178, 2.449489742783178], [0.816496580927726, 0.816496580927726, 0.816496580927726], 2.581988897471611],
|
||||
'max': [[6, 7, 8], [2, 5, 8], 8],
|
||||
'min': [[0, 1, 2], [0, 3, 6], 0],
|
||||
'sum': [[9, 12, 15], [3, 12, 21], 36]
|
||||
}
|
||||
```
|
||||
|
||||
Os testes unitários para este projeto estão em `test_module.py`.
|
||||
|
||||
## Desenvolvimento
|
||||
|
||||
Para o desenvolvimento, você pode usar `main.py` para testar sua função `calculate()`. Clique no botão "Run" e `main.py` será executado.
|
||||
|
||||
## Testes
|
||||
|
||||
Importamos os testes de `test_module.py` em `main.py` para a sua conveniência. Os testes serão executados automaticamente sempre que você clicar no botão "Run".
|
||||
|
||||
## Envio
|
||||
|
||||
Copie o URL do seu projeto e envie-o para o freeCodeCamp.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@ -8,13 +8,70 @@ dashedName: medical-data-visualizer
|
||||
|
||||
# --description--
|
||||
|
||||
Neste projeto, você vai visualizar e fazer cálculos a partir de dados dos exames médicos usando o matplotlib, o seaborn e o pandas.
|
||||
Você [trabalhará neste projeto com nosso código inicial do Replit](https://replit.com/github/freeCodeCamp/boilerplate-medical-data-visualizer).
|
||||
|
||||
Você pode acessar [a descrição completa do projeto e o código inicial no Replit](https://replit.com/github/freeCodeCamp/boilerplate-medical-data-visualizer).
|
||||
Ainda estamos desenvolvendo a parte instrucional interativa do currículo Python. Por enquanto, aqui estão alguns vídeos no canal do freeCodeCamp.org do YouTube que ensinarão tudo o que você precisa saber para completar este projeto:
|
||||
|
||||
Depois de ir para esse link, faça fork no projeto. Depois que você completar o projeto com base nas instruções do 'README.md', envie o link do seu projeto abaixo.
|
||||
- [Curso de Python em vídeo para todos](https://www.freecodecamp.org/news/python-for-everybody/) (14 horas)
|
||||
- [Curso Aprenda Python em vídeo](https://www.freecodecamp.org/news/learn-python-video-course/) (10 horas)
|
||||
|
||||
Ainda estamos desenvolvendo a parte instrucional interativa do currículo de análise de dados com Python. Por enquanto, você terá que usar outros recursos para aprender a vencer este desafio.
|
||||
# --instructions--
|
||||
|
||||
Neste projeto, você vai visualizar e fazer cálculos a partir de dados dos exames médicos usando o matplotlib, o seaborn e o pandas. Os valores do dataset foram coletados durante exames médicos.
|
||||
|
||||
## Descrição dos dados
|
||||
|
||||
As linhas do dataset representam os pacientes e as colunas representam informações como as medições corporais, os resultados de várias análises de sangue e escolhas de estilo de vida. Você usará o dataset para explorar a relação entre a doença cardíaca, medição corporal, marcadores sanguíneos e escolhas de estilo de vida.
|
||||
|
||||
Nome do arquivo: medical_examination.csv
|
||||
|
||||
| Funcionalidade | Tipo de variável | Variável | Tipo de valor |
|
||||
|:------------------------------------------------:|:-----------------:|:-----------:|:-----------------------------------------------------:|
|
||||
| Idade | Recurso objetivo | age | int (dias) |
|
||||
| Altura | Recurso objetivo | height | int (cm) |
|
||||
| Peso | Recurso objetivo | weight | float (kg) |
|
||||
| Gênero | Recurso objetivo | gender | código categórico |
|
||||
| Pressão arterial sistólica | Recurso de exame | ap_hi | int |
|
||||
| Pressão arterial diastólica | Recurso de exame | ap_lo | int |
|
||||
| Colesterol | Recurso de exame | cholesterol | 1: normal, 2: acima do normal, 3: bem acima do normal |
|
||||
| Glicose | Recurso de exame | gluc | 1: normal, 2: acima do normal, 3: bem acima do normal |
|
||||
| Fumar | Recurso subjetivo | smoke | binário |
|
||||
| Consumo de álcool | Recurso subjetivo | alco | binário |
|
||||
| Atividade física | Recurso subjetivo | active | binário |
|
||||
| Presença ou ausência de doenças cardiovasculares | Variável alvo | cardio | binário |
|
||||
|
||||
## Tarefas
|
||||
|
||||
Crie um gráfico semelhante a `examples/Figure_1.png`, onde mostramos a contagem de resultados bons e ruins para as variáveis `cholesterol`, `gluc`, `alco`, `active` e `smoke` para pacientes com cardio=1 e cardio=0 em painéis diferentes.
|
||||
|
||||
Use os dados para completar as seguintes tarefas em `medical_data_visualizer.py`:
|
||||
|
||||
- Adicione uma coluna de `overweight` (excesso de peso) aos dados. Para determinar se uma pessoa tem excesso de peso, primeiro calcule sua IMC dividindo seu peso em quilogramas pelo quadrado de sua altura em metros. Se esse valor é > 25, a pessoa está com excesso de peso. Use o valor 0 para NÃO ter excesso de peso e o valor 1 para tê-lo.
|
||||
- Normalize os dados, tornando 0 sempre bom e 1 sempre ruim. Se o valor de `cholesterol` ou de `gluc` for 1, torne o valor 0. Se o valor for maior que 1, torne o valor 1.
|
||||
- Converta os dados em um formato long e crie uma tabela que mostra as contagens de valor dos recursos categóricas usando o `catplot()` do Seaborn. O dataset deve ser dividido por 'Cardio', de modo que haja uma tabela para cada valor de `cardio`. O gráfico deve parecer com `examples/Figure_1.png`.
|
||||
- Limpe os dados. Filtrar os seguintes segmentos de pacientes que representam dados incorretos:
|
||||
- pressão diastólica é maior do que a sistólica (Manter os dados corretos com `(df['ap_lo'] <= df['ap_hi'])`)
|
||||
- a altura é menor que o percentil 2,5 (Manter os dados corretos com `(df['height'] >= df['height'].quantile(0.025))`)
|
||||
- a altura é maior que o percentil 97,5
|
||||
- o peso é menor que o percentil 2,5
|
||||
- o peso é maior que o percentil 97,5
|
||||
- Crie uma matriz de correlação usando o dataset. Faça o gráfico da matriz de correlação usando o `heatmap()` do seaborn. Mascare o triângulo superior. O gráfico deve parecer com `examples/Figure_2.png`.
|
||||
|
||||
Quando uma variável for definida como `None`, certifique-se de configurá-la com o código correto.
|
||||
|
||||
Os testes unitários foram escritos para você no `test_module.py`.
|
||||
|
||||
## Desenvolvimento
|
||||
|
||||
Para o desenvolvimento, você pode usar `main.py` para testar suas funções. Clique no botão "Run" e `main.py` será executado.
|
||||
|
||||
## Testes
|
||||
|
||||
Importamos os testes de `test_module.py` em `main.py` para a sua conveniência. Os testes serão executados automaticamente sempre que você clicar no botão "Run".
|
||||
|
||||
## Envio
|
||||
|
||||
Copie o URL do seu projeto e envie-o para o freeCodeCamp.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@ -8,13 +8,40 @@ dashedName: page-view-time-series-visualizer
|
||||
|
||||
# --description--
|
||||
|
||||
Para este projeto, você vai visualizar dados de série de tempo usando um gráfico de linha, um gráfico de barras e diagramas de caixa. Você usará o Pandas, o matplotlib e o seaborn para visualizar um conjunto de dados contendo o número de visualizações de páginas todos os dias no fórum do freeCodeCamp.org de 09/05/2016 a 03/12/2019. As visualizações de dados ajudarão você a entender os padrões nas visitas e a identificar o crescimento anual e mensal.
|
||||
Você [trabalhará neste projeto com nosso código inicial do Replit](https://replit.com/github/freeCodeCamp/boilerplate-page-view-time-series-visualizer).
|
||||
|
||||
Você pode acessar [a descrição completa do projeto e o código inicial no Replit](https://replit.com/github/freeCodeCamp/boilerplate-page-view-time-series-visualizer).
|
||||
Ainda estamos desenvolvendo a parte instrucional interativa do currículo Python. Por enquanto, aqui estão alguns vídeos no canal do freeCodeCamp.org do YouTube que ensinarão tudo o que você precisa saber para completar este projeto:
|
||||
|
||||
Depois de ir para esse link, faça fork no projeto. Depois que você completar o projeto com base nas instruções do 'README.md', envie o link do seu projeto abaixo.
|
||||
- [Curso de Python em vídeo para todos](https://www.freecodecamp.org/news/python-for-everybody/) (14 horas)
|
||||
- [Curso Aprenda Python em vídeo](https://www.freecodecamp.org/news/learn-python-video-course/) (10 horas)
|
||||
|
||||
Ainda estamos desenvolvendo a parte instrucional interativa do currículo de análise de dados com Python. Por enquanto, você terá que usar outros recursos para aprender a vencer este desafio.
|
||||
# --instructions--
|
||||
|
||||
Para este projeto, você vai visualizar dados de série de tempo usando um gráfico de linha, um gráfico de barras e diagramas de caixa. Você usará o Pandas, o Matplotlib e o Seaborn para visualizar um dataset contendo o número de visualizações de páginas todos os dias no fórum do freeCodeCamp.org de 09/05/2016 a 03/12/2019. As visualizações de dados ajudarão você a entender os padrões nas visitas e a identificar o crescimento anual e mensal.
|
||||
|
||||
Use os dados para completar as seguintes tarefas:
|
||||
|
||||
- Use o Pandas para importar os dados de "fcc-forum-pageviews.csv". Define o índice para que seja a coluna "date".
|
||||
- Limpe os dados filtrando os dias em que as visualizações de página estavam nos 2,5% maiores ou nos 2,5% menores do dataset.
|
||||
- Crie uma função `draw_line_plot` que use o Matplotlib para desenhar um gráfico de linhas semelhante a "examples/Figure_1.png". O título deve ser "Daily freeCodeCamp Forum Page Views 5/2016-12/2019". O rótulo no eixo x deve ser "Date" e o rótulo no eixo y deve ser "Page Views".
|
||||
- Crie uma função `draw_bar_plot` para desenhar um gráfico de barras semelhante a "examples/Figure_2.png". Ele deve mostrar as médias de visualizações de página diárias para cada mês agrupadas por ano. A legenda deve mostrar os rótulos dos meses e ter o título "Months". No gráfico, o rótulo no eixo x deve ser "Years" e o rótulo no eixo y deve ser "Average Page Views".
|
||||
- Crie uma função `draw_box_plot` que use o Seaborn para desenhar dois diagramas de caixa semelhantes a "examples/Figure_3.png". Esses diagramas de caixa devem mostrar como os valores são distribuídos dentro de um determinado ano ou mês e como são comparados ao longo do tempo. O título do primeiro diagrama deve ser "Year-wise Box Plot (Trend)" (Diagrama de caixas do ano (Tendência)) e o título do segundo gráfico deve ser "Month-wise Box Plot (Seasonality)" (Diagrama de caixas do mês (Sazonalidade)). Certifique-se de que as etiquetas do mês na parte inferior comecem em "Jan" e que o eixos x e y estejam rotulados corretamente. O boilerplate inclui comandos para preparar os dados.
|
||||
|
||||
Para cada gráfico, certifique-se de usar uma cópia do data frame. Os testes unitários foram escritos para você no `test_module.py`.
|
||||
|
||||
O boilerplate também inclui comandos para salvar e retornar a imagem.
|
||||
|
||||
## Desenvolvimento
|
||||
|
||||
Para o desenvolvimento, você pode usar `main.py` para testar suas funções. Clique no botão "Run" e `main.py` será executado.
|
||||
|
||||
## Testes
|
||||
|
||||
Importamos os testes de `test_module.py` em `main.py` para a sua conveniência. Os testes serão executados automaticamente sempre que você clicar no botão "Run".
|
||||
|
||||
## Envio
|
||||
|
||||
Copie o URL do seu projeto e envie-o para o freeCodeCamp.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@ -8,13 +8,44 @@ dashedName: sea-level-predictor
|
||||
|
||||
# --description--
|
||||
|
||||
Neste projeto, você analisará um conjunto de dados da mudança média do nível do mar global desde 1880. Você utilizará os dados para prever a mudança do nível do mar até ao ano de 2050.
|
||||
Você [trabalhará neste projeto com nosso código inicial do Replit](https://replit.com/github/freeCodeCamp/boilerplate-sea-level-predictor).
|
||||
|
||||
Você pode acessar [a descrição completa do projeto e o código inicial no Replit](https://replit.com/github/freeCodeCamp/boilerplate-sea-level-predictor).
|
||||
Ainda estamos desenvolvendo a parte instrucional interativa do currículo Python. Por enquanto, aqui estão alguns vídeos no canal do freeCodeCamp.org do YouTube que ensinarão tudo o que você precisa saber para completar este projeto:
|
||||
|
||||
Depois de ir para esse link, faça fork no projeto. Depois que você completar o projeto com base nas instruções do 'README.md', envie o link do seu projeto abaixo.
|
||||
- [Curso de Python em vídeo para todos](https://www.freecodecamp.org/news/python-for-everybody/) (14 horas)
|
||||
- [Curso Aprenda Python em vídeo](https://www.freecodecamp.org/news/learn-python-video-course/) (10 horas)
|
||||
|
||||
# --instructions--
|
||||
|
||||
Você analisará um dataset da mudança média do nível do mar global desde 1880. Você utilizará os dados para prever a mudança do nível do mar até ao ano de 2050.
|
||||
|
||||
Use os dados para completar as seguintes tarefas:
|
||||
|
||||
- Use o Pandas para importar os dados de `epa-sea-level.csv`.
|
||||
- Use a matplotlib para criar um diagrama de dispersão usando a coluna "Year" como eixo x e a coluna "CSIRO Adjusted Sea Level" (Nível do mar ajustado) como o eixo y.
|
||||
- Use a função `linregress` do `scipy.stats` para obter o coeficiente angular e o ponto de interceptação da linha de y do melhor ajuste. Trace a linha de melhor ajuste na parte superior do diagrama de dispersão. Faça a linha passar pelo ano 2050 para prever o aumento do nível do mar em 2050.
|
||||
- Trace uma nova linha do melhor ajuste utilizando apenas os dados do ano 2000 ao longo do último ano no dataset. Faça com que a linha passe também pelo ano 2050 para prever o aumento do nível do mar em 2050 se a taxa de crescimento continuar como está desde o ano 2000.
|
||||
- O rótulo de x deve ser "Year" e o rótulo de y deve ser "Sea Level (inches)" (Nível do mar, em polegadas), e o título deve ser "Rise in Sea Level" (Aumento do nível do mar).
|
||||
|
||||
Os testes unitários foram escritos para você no `test_module.py`.
|
||||
|
||||
O boilerplate também inclui comandos para salvar e retornar a imagem.
|
||||
|
||||
## Desenvolvimento
|
||||
|
||||
Para o desenvolvimento, você pode usar `main.py` para testar suas funções. Clique no botão "Run" e `main.py` será executado.
|
||||
|
||||
## Testes
|
||||
|
||||
Importamos os testes de `test_module.py` em `main.py` para a sua conveniência. Os testes serão executados automaticamente sempre que você clicar no botão "Run".
|
||||
|
||||
## Envio
|
||||
|
||||
Copie o URL do seu projeto e envie-o para o freeCodeCamp.
|
||||
|
||||
## Fonte dos dados
|
||||
[Global Average Absolute Sea Level Change](https://datahub.io/core/sea-level-rise), 1880-2014 da Agência de Proteção Ambiental dos EUA, usando dados do CSIRO, 2015; NOAA, 2015.
|
||||
|
||||
Ainda estamos desenvolvendo a parte instrucional interativa do currículo de análise de dados com Python. Por enquanto, você terá que usar outros recursos para aprender a vencer este desafio.
|
||||
|
||||
# --hints--
|
||||
|
||||
|
||||
@ -110,8 +110,12 @@ assert(
|
||||
test.insert(700);
|
||||
test.insert(32);
|
||||
test.insert(51);
|
||||
let result = test.print();
|
||||
return result.length == 5 ? result[0] == 700 : result[1] == 700;
|
||||
test.insert(800);
|
||||
const result = test.print();
|
||||
const solution = JSON.stringify([null,800,51,700,32,50,100]);
|
||||
const solutionWithoutNull = JSON.stringify([800,51,700,32,50,100]);
|
||||
|
||||
return (result.length == 6) ? (JSON.stringify(result) == solutionWithoutNull) : (JSON.stringify(result) == solution);
|
||||
})()
|
||||
);
|
||||
```
|
||||
|
||||
@ -8,7 +8,7 @@ dashedName: problem-124-ordered-radicals
|
||||
|
||||
# --description--
|
||||
|
||||
O radical de $n, rad(n)$, é o produto dos fatores primos distintos de $n$. Por exemplo, $504 = 2^3 × 3^2 × 7$, então $rad(504) = 2 × 3 × 7 = 42$.
|
||||
O radical de $n$, $rad(n)$, é o produto dos fatores primos distintos de $n$. Por exemplo, $504 = 2^3 × 3^2 × 7$, então $rad(504) = 2 × 3 × 7 = 42$.
|
||||
|
||||
Se calcularmos $rad(n)$ para $1 ≤ n ≤ 10$ e, em seguida, ordená-los em $rad(n)$, e ordená-los novamente em $n$ se os valores dos radicais forem iguais, obtemos:
|
||||
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
---
|
||||
id: 5900f4881000cf542c50ff9a
|
||||
title: >-
|
||||
Problema 283: Triângulos com lados de números inteiros para os quais a proporção de área * perímetro é um número inteiro
|
||||
Problema 283: Triângulos com lados de números inteiros para os quais a proporção de área / perímetro é um número inteiro
|
||||
challengeType: 5
|
||||
forumTopicId: 301934
|
||||
dashedName: >-
|
||||
|
||||
Reference in New Issue
Block a user