Skip to content

Prueba técnica Claudia Muñoz #34

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

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
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
1 change: 1 addition & 0 deletions .eslintcache
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
[{"C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\index.js":"1","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\App.js":"2","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\reportWebVitals.js":"3","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\components\\Search.js":"4","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\components\\Title.js":"5","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\pages\\Welcome.js":"6","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\pages\\User.js":"7","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\components\\Navbar.js":"8","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\pages\\Notfound.js":"9","C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\index.js":"10","C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\App.js":"11","C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\reportWebVitals.js":"12","C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\pages\\User.js":"13","C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\pages\\Welcome.js":"14","C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\pages\\Notfound.js":"15","C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\components\\Search.js":"16","C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\components\\Title.js":"17","C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\components\\Navbar.js":"18"},{"size":269,"mtime":1607637212353,"results":"19","hashOfConfig":"20"},{"size":462,"mtime":1607705673418,"results":"21","hashOfConfig":"20"},{"size":362,"mtime":499162500000,"results":"22","hashOfConfig":"20"},{"size":1389,"mtime":1607699560553,"results":"23","hashOfConfig":"20"},{"size":380,"mtime":1607700164976,"results":"24","hashOfConfig":"20"},{"size":376,"mtime":1607658569505,"results":"25","hashOfConfig":"20"},{"size":1389,"mtime":1607705267878,"results":"26","hashOfConfig":"20"},{"size":368,"mtime":1607701538339,"results":"27","hashOfConfig":"20"},{"size":395,"mtime":1607707856206,"results":"28","hashOfConfig":"20"},{"size":269,"mtime":1607637212353,"results":"29","hashOfConfig":"30"},{"size":513,"mtime":1607711822466,"results":"31","hashOfConfig":"30"},{"size":362,"mtime":499162500000,"results":"32","hashOfConfig":"30"},{"size":1704,"mtime":1607715361596,"results":"33","hashOfConfig":"30"},{"size":376,"mtime":1607658569505,"results":"34","hashOfConfig":"30"},{"size":395,"mtime":1607707856206,"results":"35","hashOfConfig":"30"},{"size":1417,"mtime":1607715176548,"results":"36","hashOfConfig":"30"},{"size":380,"mtime":1607700164976,"results":"37","hashOfConfig":"30"},{"size":368,"mtime":1607701538339,"results":"38","hashOfConfig":"30"},{"filePath":"39","messages":"40","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"41","usedDeprecatedRules":"42"},"1vp41h5",{"filePath":"43","messages":"44","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"45","usedDeprecatedRules":"42"},{"filePath":"46","messages":"47","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"42"},{"filePath":"48","messages":"49","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"50","usedDeprecatedRules":"42"},{"filePath":"51","messages":"52","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"42"},{"filePath":"53","messages":"54","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"42"},{"filePath":"55","messages":"56","errorCount":0,"warningCount":6,"fixableErrorCount":0,"fixableWarningCount":0,"source":"57","usedDeprecatedRules":"42"},{"filePath":"58","messages":"59","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"60","messages":"61","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"42"},{"filePath":"62","messages":"63","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"41","usedDeprecatedRules":"64"},"ca0pob",{"filePath":"65","messages":"66","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"64"},{"filePath":"67","messages":"68","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"64"},{"filePath":"69","messages":"70","errorCount":0,"warningCount":6,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"71","messages":"72","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"64"},{"filePath":"73","messages":"74","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"64"},{"filePath":"75","messages":"76","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"77","usedDeprecatedRules":"64"},{"filePath":"78","messages":"79","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"64"},{"filePath":"80","messages":"81","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"64"},"C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\index.js",["82"],"import React from 'react';\nimport ReactDOM from 'react-dom';\nimport './index.css';\nimport App from './App';\nimport reportWebVitals from './reportWebVitals';\n\nReactDOM.render(\n <React.StrictMode>\n <App />\n </React.StrictMode>,\n document.getElementById('root')\n);\n ",["83","84"],"C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\App.js",["85"],"\nimport './App.css';\nimport Welcome from './pages/Welcome'\nimport User from './pages/User'\nimport Notfound from './pages/Notfound'\nimport { BrowserRouter,Route, Switch} from 'react-router-dom';\n\nfunction App() {\n return (\n <BrowserRouter>\n <Route exact path=\"/\" component={Welcome}/>\n <Route exact path=\"/user\" component={User}/>\n <Route exact path=\"/notfound\" component={Notfound}/>\n \n </BrowserRouter>\n \n );\n}\n\nexport default App;\n","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\reportWebVitals.js",[],"C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\components\\Search.js",["86"],"import React from 'react'\r\nimport './../styles/search.css';\r\nimport search from '../assets/img/Search.svg';\r\nimport {Link} from 'react-router-dom'\r\n\r\n\r\n\r\nclass Search extends React.Component{\r\n \r\n state ={\r\n user: ''\r\n }\r\n onChange=async e => {\r\n e.persist();\r\n await this.setState ( {user:e.target.value}); \r\n \r\n \r\n }\r\n searchU() {\r\n fetch('https://api.github.com/users/' + this.state.user)\r\n .then(response => {\r\n return response.json();\r\n })\r\n .then(response => {\r\n console.log(response);\r\n })\r\n }\r\n \r\n render () {\r\n return(\r\n <div className=\"search-container\">\r\n \r\n <input \r\n name=\"user\"\r\n className=\"search-input\"\r\n type=\"text\"\r\n placeholder=\"ingrese usuario de busqueda\"\r\n value={this.state.user}\r\n onChange={this.onChange}\r\n />\r\n <button\r\n onClick={()=>{this.searchU()}}\r\n className=\"search\"\r\n >\r\n <Link to=\"/user\"><img src={search} /> </Link>\r\n </button>\r\n \r\n </div>\r\n ) \r\n \r\n \r\n }\r\n}\r\n\r\nexport default Search ","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\components\\Title.js",[],"C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\pages\\Welcome.js",[],"C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\pages\\User.js",["87","88","89","90","91","92"],"import React from \"react\";\r\nimport Navbar from './../components/Navbar'\r\nimport './../styles/user.css'\r\nimport organization from './../assets/img/organization.svg';\r\nimport location from './../assets/img/location.svg';\r\nimport star from './../assets/img/star.svg';\r\nimport repositorie from './../assets/img/repositorie.svg';\r\nimport followers from './../assets/img/followers.png';\r\nclass User extends React.Component {\r\n\r\n render() {\r\n return (\r\n <div>\r\n <Navbar/>\r\n <div className=\"info-container\">\r\n <div className=\"user-container\">\r\n <div className=\"avatar\">\r\n <img src='https://avatars2.githubusercontent.com/u/3306019?v=4'/>\r\n </div>\r\n <h1> Nombre </h1>\r\n <h2> biography</h2>\r\n <h4><img src={organization}/> &nbsp; blabla </h4>\r\n <h4><img src={location} />&nbsp; blabla </h4>\r\n <h4><img src= {star} /> &nbsp; blabla </h4>\r\n <h4><img src={repositorie} /> &nbsp; blabla </h4>\r\n <h4><img src={followers} /> &nbsp; blabla </h4>\r\n </div>\r\n <div className=\"repos-container\">\r\n <div className=\"repos\"> \r\n <h1>REPO'S NAME</h1>\r\n <h4> detalle</h4>\r\n <h5> 342</h5>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n \r\n );\r\n }\r\n}\r\n\r\nexport default User;\r\n","C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\components\\Navbar.js",[],"C:\\Users\\Usuario\\Desktop\\prueb\\git\\src\\pages\\Notfound.js",[],"C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\index.js",["93"],["94","95"],"C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\App.js",[],"C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\reportWebVitals.js",[],"C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\pages\\User.js",["96","97","98","99","100","101"],"C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\pages\\Welcome.js",[],"C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\pages\\Notfound.js",[],"C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\components\\Search.js",["102"],"import React from 'react'\r\nimport './../styles/search.css';\r\nimport search from '../assets/img/Search.svg';\r\nimport {Link} from 'react-router-dom'\r\n\r\n\r\n\r\nclass Search extends React.Component{\r\n \r\n state ={\r\n user: ''\r\n }\r\n onChange=async e => {\r\n e.persist();\r\n await this.setState ( {user:e.target.value}); \r\n \r\n \r\n }\r\n searchU() {\r\n fetch('https://api.github.com/users/' + this.state.user)\r\n .then(response => {\r\n return response.json();\r\n })\r\n .then(response => {\r\n console.log(response);\r\n })\r\n }\r\n \r\n render () {\r\n return(\r\n <div className=\"search-container\">\r\n \r\n <input \r\n name=\"user\"\r\n className=\"search-input\"\r\n type=\"text\"\r\n placeholder=\"ingrese usuario de busqueda\"\r\n value={this.state.user}\r\n onChange={this.onChange}\r\n />\r\n <Link to={`/user?${ this.state.user}`}>\r\n <button\r\n \r\n className=\"search\"\r\n >\r\n <img src={search} /> \r\n </button>\r\n </Link>\r\n \r\n </div>\r\n ) \r\n \r\n \r\n }\r\n}\r\n\r\nexport default Search ","C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\components\\Title.js",[],"C:\\Users\\Usuario\\Desktop\\prueb\\frontend-recruiting-hsa\\src\\components\\Navbar.js",[],{"ruleId":"103","severity":1,"message":"104","line":5,"column":8,"nodeType":"105","messageId":"106","endLine":5,"endColumn":23},{"ruleId":"107","replacedBy":"108"},{"ruleId":"109","replacedBy":"110"},{"ruleId":"103","severity":1,"message":"111","line":6,"column":31,"nodeType":"105","messageId":"106","endLine":6,"endColumn":37},{"ruleId":"112","severity":1,"message":"113","line":45,"column":39,"nodeType":"114","endLine":45,"endColumn":59},{"ruleId":"112","severity":1,"message":"113","line":18,"column":15,"nodeType":"114","endLine":18,"endColumn":80},{"ruleId":"112","severity":1,"message":"113","line":22,"column":16,"nodeType":"114","endLine":22,"endColumn":41},{"ruleId":"112","severity":1,"message":"113","line":23,"column":16,"nodeType":"114","endLine":23,"endColumn":38},{"ruleId":"112","severity":1,"message":"113","line":24,"column":16,"nodeType":"114","endLine":24,"endColumn":35},{"ruleId":"112","severity":1,"message":"113","line":25,"column":16,"nodeType":"114","endLine":25,"endColumn":41},{"ruleId":"112","severity":1,"message":"113","line":26,"column":16,"nodeType":"114","endLine":26,"endColumn":39},{"ruleId":"103","severity":1,"message":"104","line":5,"column":8,"nodeType":"105","messageId":"106","endLine":5,"endColumn":23},{"ruleId":"107","replacedBy":"115"},{"ruleId":"109","replacedBy":"116"},{"ruleId":"112","severity":1,"message":"113","line":34,"column":15,"nodeType":"114","endLine":34,"endColumn":80},{"ruleId":"112","severity":1,"message":"113","line":38,"column":16,"nodeType":"114","endLine":38,"endColumn":41},{"ruleId":"112","severity":1,"message":"113","line":39,"column":16,"nodeType":"114","endLine":39,"endColumn":38},{"ruleId":"112","severity":1,"message":"113","line":40,"column":16,"nodeType":"114","endLine":40,"endColumn":35},{"ruleId":"112","severity":1,"message":"113","line":41,"column":16,"nodeType":"114","endLine":41,"endColumn":41},{"ruleId":"112","severity":1,"message":"113","line":42,"column":16,"nodeType":"114","endLine":42,"endColumn":39},{"ruleId":"112","severity":1,"message":"113","line":46,"column":22,"nodeType":"114","endLine":46,"endColumn":42},"no-unused-vars","'reportWebVitals' is defined but never used.","Identifier","unusedVar","no-native-reassign",["117"],"no-negated-in-lhs",["118"],"'Switch' is defined but never used.","jsx-a11y/alt-text","img elements must have an alt prop, either with meaningful text, or an empty string for decorative images.","JSXOpeningElement",["117"],["118"],"no-global-assign","no-unsafe-negation"]
54 changes: 3 additions & 51 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@

# Desafío Front End

## Propuesta

Implemente una aplicación cliente, visualice la API de GitHub y vea los repositorios de un usuario específico.

Esta aplicación debe funcionar en los navegadores más recientes del mercado.
Se inicializó una aplicación de busqueda de usuarios en gitHub el cual se está trabajando con estos recursos

### API

Expand Down Expand Up @@ -34,52 +33,5 @@ Not Found
Al buscar un usuario por el login de búsqueda de github, acceda a la página de resultados de la búsqueda con los detalles del usuario, de lo contrario, mostrará la página de Not Found (Layout NotFound).

### Requisitos


- Yo, como usuario, quiero buscar un usuario de GitHub;
- Yo, como usuario, deseo ver los detalles de aquel usuario que fue buscado (número de seguidores, imagen del avatar, e-mail y bio);
- Yo, como usuario, en la pantalla de detalhes puedo hacer una nueva busca;
- Yo, como usuario, deseo ver la lista de repositorios de aquel usuario que fue buscado, ordenada por el número decreciente de estrellas;
- Yo, como usuario, en la pantalla de detalhes puedo hacer click en nombre de repositorio e ir para pantalla del repositorio en github;
- Yo, como usuario, en la pantalla de detalhes puedo hacer click en nombre usuariio y imagem del perfil, y ir para pantalla de perfil en github;

**Definición de listo**

El proyecto debe ser implementado de acuerdo con las especificaciones de Zeplin, no es obligatorio usar una estructura, pero recomendamos el React.js, Angular, Vue, o algún FW más actual. El uso de rutas es obligatorio (Ex: / users / {username} / repos).

### Criterios de evaluación

Buscamos personas que buscan siempre aprender cosas nuevas y estar actualizadas con el Mercado, disfrutar de buenas prácticas y calidad.

- Organización del proyecto: La estructura del proyecto, documentación y uso del control de versión;
- Innovación tecnológica: el uso de nuevas tecnologías, siempre que sean estables;
- Consistencia: Si se cumplen los requisitos;
- Buenas prácticas: Si el proyecto sigue buenas prácticas de desarrollo, incluyendo seguridad, optimización, código limpio y reutilizable, etc;
- Control de Calidad: Si el proyecto tiene calidad asegurada por pruebas unitarias (por ejemplo, Jasmine, Mocha, Chai, Jest, etc).
- No utilice Frameworks CSS (Boostrap, Material Angular, etc). Queremos entender cuál es su conocimiento con CSS.
- El uso de preprocesador es muy bienvenido (Sass, Less) y ganará puntos.
- El layout propuesto es bastante simple, pero tiene puntos que pueden ser reutilizados, reflexione sobre lo que se puede crear como componente. Analice bien el diseño y lo que se repite. Monte su biblioteca de componentes. Sugerencia, un término muy utilizado es webcomponent.
- Documentación del proyecto, en el README.md debe ser creado y explicadar como se puede levantar la aplicacion en ambiente local, ejecutar pruebas unitarias, etc.
- Git, el control de versión se analizará también, por lo que los commits, descripciones que se hizo en aquel commit también contará en el análisis.
- Nomenclatura, el idioma para el código base debe estar en inglés y el idioma dirigido para el usuario en Español.
- Requerimiento obligatorio: la página de busqueda debe pertenecer a un modulo diferente de la página de detalle.
- El layout que esta en Zeplin se comparte cuando nuestro Recursos Humanos entran en contacto, y el css que es generado por él no debe ser utilizado. El foco es crear algo de cero y pensando en los webcomponentes reutilizables.

Cada ítem arriba será evaluado y contará puntos en la evaluación final, por lo tanto aplique todo su conocimiento.

### Entrega

Siga los siguientes pasos para implementar y enviar este desafío:
- Haga un **Fork** a este repositorio. Puedes mirar esta guía para mayores informaciones: [Como hacer fork de un repositorio](https://help.github.com/en/articles/fork-a-repo).
- Implemente el desafío.
- Después de completar el desafío, realice un **Pull Request** a este repositorio, utilizando la interface de **Github**. [Creando un Pull Request](https://help.github.com/en/articles/creating-a-pull-request-from-a-fork).
- Si es posible, deja tu repositorio publico para hacer la revisión de código más sencilla.

Ademas de eso, la aplicación debe alojarse (Heroku, Netlify, Firebase, Plunker, etc.) y cumplir con los requerimientos. Las direcciones URL deben ser agregadas a el README del proyecto.

### Plazo

El tiempo de entrega de 7 días.

Si el equipo de Recursos Humanos no te ha contactado, escribe a [email protected]

¡Buena suerte!
Binary file removed img/details.png
Binary file not shown.
Binary file removed img/home.png
Binary file not shown.
Binary file removed img/notfound.png
Binary file not shown.
Loading