diff --git a/.eslintrc b/.eslintrc index 316d5e03..a8b6cb14 100644 --- a/.eslintrc +++ b/.eslintrc @@ -274,7 +274,7 @@ "react/jsx-sort-props": 0, "react/jsx-uses-react": 2, "react/jsx-uses-vars": 2, - "react/no-did-mount-set-state": 2, + "react/no-did-shallow-set-state": 2, "react/no-did-update-set-state": 2, "react/no-multi-comp": 0, "react/no-unknown-property": 2, diff --git a/.gitignore b/.gitignore index 67045665..829fc0e0 100644 --- a/.gitignore +++ b/.gitignore @@ -102,3 +102,4 @@ dist # TernJS port file .tern-port +.vercel diff --git a/PULL_REQUEST_TEMPLATE.md b/PULL_REQUEST_TEMPLATE.md index 67105c53..648933ab 100644 --- a/PULL_REQUEST_TEMPLATE.md +++ b/PULL_REQUEST_TEMPLATE.md @@ -2,15 +2,19 @@ Solución al reto: -Nombre: -Usuario Platzi: +Nombre: Eimer Castro +Usuario Platzi: ewcastroh ## Reto: -- [ ] Primer problema -- [ ] Segundo problema -- [ ] Tercer problema -- [ ] Cuarto Problema -- [ ] Quinto Problema -- [ ] Sexto Problema -- [ ] Septimo Problema +- [X] Primer problema +- [X] Segundo problema +- [X] Tercer problema +- [X] Cuarto Problema +- [X] Quinto Problema +- [X] Sexto Problema +- [X] Septimo Problema + +Deployments +API: https://ewcastroh.github.io/data.json +App: https://dist-ewcastroh.vercel.app/ diff --git a/data.json b/data.json index 94dbaad5..813e5e44 100644 --- a/data.json +++ b/data.json @@ -1,109 +1,245 @@ { "data": { - "name": "Melissa Walsh", - "profession": "FrontEnd Developer", - "address": "Bogotá, Colombia.", - "email": "melissa@example.com", - "website": "https://example.com", - "phone": "3042034240", - "avatar": "https://arepa.s3.amazonaws.com/melissa.jpg", - "Profile": "Ignore the squirrels, you'll never catch them anyway hack, for floof tum, tickle bum, jellybean footies curly toes climb leg roll over and sun my belly, ", + "name": "Eimer Castro", + "profession": "FullStack Developer", + "address": "Medellín, Colombia.", + "email": "ewcastroh10@gmail.com", + "website": "https://ewcastroh.com", + "phone": "3005492196", + "avatar": "https://avatars.githubusercontent.com/ewcastroh", + "Profile": "I am a Software Engineer with over five years of experience as a Full Stack Developer. I have developed web applications using Full Stack technologies like Java in Backend. HTML, JavaScript, CSS, and Angular in Frontend and working CI/CD. With knowledge in Web Automation Testing. I have worked in teams with Scrum and Kanban methodologies. I am a responsible, agile, and autodidactic developer analyzing and proposing quality solutions. I am committed to my work with a sense of belonging. I like to update my knowledge continually with cutting-edge technologies in software development. I enjoy coding and improving my skills with clean and extensible good practices.", "certificate": [ { - "date": "Jan 2021", - "description": "Hack up furballs try to jump onto window and fall while scratching at wall. ", - "institution": "Platzi", - "name": "FrontEnd Developer" + "date": "Jun 2022", + "description": "This credential helps organizations identify and develop talent with critical skills for implementing cloud initiatives. Earning AWS Certified Solutions Architect - Associate validates the ability to design and implement distributed systems on AWS.", + "institution": "Amazon Web Services (AWS)", + "name": "AWS Certified Solutions Architect – Associate" }, { - "date": "Jan 2021", - "description": "Scratch at the door then walk away wack the mini furry mouse", - "institution": "Platzi", - "name": "Backend Developer" + "date": "Dec 2021", + "description": "This credential helps organizations identify and develop talent with critical skills for implementing cloud initiatives. Earning AWS Certified Developer – Associate validates the ability to write and deploy cloud-based applications.", + "institution": "Amazon Web Services (AWS)", + "name": "AWS Certified Developer – Associate" + }, + { + "date": "Sept 2014 2021", + "description": " The Certified Scrum Developer® course is designed for product developers who are working in a Scrum environment. The goal is to expose students to the most important tools and techniques needed to build good products in the iterative and incremental fashion that Scrum requires. These ideas are central to the entire field of agile product development.", + "institution": "Ceiba Software House S.A.S.", + "name": "Certified Scrum Developer" + }, + { + "date": "Sept 2014 2021", + "description": "Candidates for this exam are developers with at least one year of experience developing with HTML in an object-based, event-driven programming model, and programming essential business logic for a variety of application types, hardware, and software platforms using JavaScript.", + "institution": "Microsoft", + "name": "Exam 480: Programming in HTML5 with JavaScript and CSS3" } ], "Academic": [ { - "degree": "Atomic Master", - "description": " I’m so hungry i’m so hungry but ew not for that pelt around the house and up and down stairs chasing phantoms", - "endDate": "Jan 2017", - "institution": "MIT", - "startDate": "Jan 2018" + "degree": "Grade: Systems and Computer Engineering", + "description": "The curricular program of Systems Engineering and Informatics aims to train upstanding and suitable professionals who can adopt, apply and innovate knowledge in the field of systems and informatics. Also, that they are capable of contributing with their organization, structuring, management, planning, modeling, development, processing, validation, transfer and communication. Information technology is applied in numerous and diverse sectors, and today, computers are present in almost all daily tasks.", + "endDate": "Apr 2014", + "institution": "Universidad Nacional de Colombia", + "startDate": "Jan 2008" }, { - "degree": "Space Engineering", - "description": "Meow in empty rooms. Find empty spot in cupboard and sleep all day check cat door for ambush 10 times before coming in for hack. ", - "endDate": "Decenber 2015", - "institution": "Harvard", - "startDate": "Jan 2017" + "degree": "High School ", + "description": "Preparation for high education.", + "endDate": "Dec 2007", + "institution": "Hernan Villa Baena High School", + "startDate": "Jan 2002" } ], "experience": [ { - "company": "PugStar", + "company": "EPAM Systems", "endDate": "Present", - "jobDescription": "scratch the furniture. Good now the other hand, too lay on arms while you're using the keyboard.", - "jobTitle": "Frontend", - "startDate": "Jan 2020" + "jobDescription": "Analysis and software development, maintenance, and support of existing custom applications in Backend using agile methodology Scrum with continuous integration.", + "jobTitle": "Software Engineer", + "startDate": "Jul 2021" + }, + { + "company": "Globant", + "endDate": "Jan 2021", + "jobDescription": "Analysis and software development in Backend using agile methodology Scrum with continuous integration.", + "jobTitle": "Java Developer", + "startDate": "Mar 2019" + }, + { + "company": "Ceiba Software", + "endDate": "Mar 2019", + "jobDescription": "Analysis, designing and software development as Full Stack developer, using agile methodology Scrum and Kanban with continuous integration and continuous delivery.", + "jobTitle": "Developer Architect", + "startDate": "Aug 2017" + }, + { + "company": "TODO1 Services Inc.", + "endDate": "Jul 2017", + "jobDescription": "Analysis, designing and software development as Full Stack developer, using agile methodology Scrum and Kanban with continuous integration and continuous delivery.", + "jobTitle": "Developer Engineer", + "startDate": "Oct 2016" + }, + { + "company": "Analyst Developer", + "endDate": "Mar 2016", + "jobDescription": "I. Survey of analysis and requirements. II. Design of custom solutions. III. Development of custom applications. IV. Maintenance and support for custom applications.", + "jobTitle": "Clínica Las Américas", + "startDate": "Aug 2015" + }, + { + "company": "TM Solutions", + "endDate": "Jul 2015", + "jobDescription": "I. Survey of analysis and requirements. II. Design of custom solutions. III. Development of custom applications. IV. Maintenance and support for custom applications.", + "jobTitle": "Systems Engineer", + "startDate": "Mar 2015" + }, + { + "company": "Softcaribbean ", + "endDate": "Feb 2015", + "jobDescription": "I. Survey of analysis and requirements. II. Design of custom solutions. III. Development of custom applications. IV. Maintenance and support for custom applications.", + "jobTitle": "Systems Engineer", + "startDate": "Oct 2014" }, { - "company": "CatStore", - "endDate": "Jan 2016", - "jobDescription": "Meow in empty rooms lick left leg for ninety minutes, still dirty.", - "jobTitle": "Backend", - "startDate": "Sept 2019" + "company": "Mitsubishi Electric de Colombia", + "endDate": "Jun 2014", + "jobDescription": "I. Helpdesk service line attention. II. Monitoring of communications equipment (backup equipment, servers, switches) and verify correct operation. III. Support in the company's technology projects.", + "jobTitle": "Systems Engineer", + "startDate": "Jun 2013" + }, + { + "company": "Universidad Nacional de Colombia", + "endDate": "Jun 2012", + "jobDescription": "Implementation of a system based on web services, oriented towards the remote operation of robots capable of executing basic soccer moves.", + "jobTitle": "Student Researcher SINTELWEB group", + "startDate": "Nov 2011" } ], "skills": [ + { + "name": "Java SE", + "percentage": "70" + }, + { + "name": "Java EE", + "percentage": "60" + }, + { + "name": "Spring Framework", + "percentage": "60" + }, { "name": "HTML5", - "percentage": "75%" + "percentage": "70" }, { "name": "CSS", - "percentage": "25%" + "percentage": "50" }, { "name": "JavaScript", - "percentage": "55%" + "percentage": "55" + }, + { + "name": "Angular", + "percentage": "40" }, { "name": "React", - "percentage": "90%" + "percentage": "30" + }, + { + "name": "MySQL", + "percentage": "75" + }, + { + "name": "PostgreSQL", + "percentage": "70" + }, + { + "name": "Oracle DB", + "percentage": "50" + }, + { + "name": "PL/SQL", + "percentage": "40" + }, + { + "name": "Git", + "percentage": "55" + }, + { + "name": "Scrum", + "percentage": "95" + }, + { + "name": "JUnit", + "percentage": "50" + }, + { + "name": "Maven", + "percentage": "70" + }, + { + "name": "Gradle", + "percentage": "50" + }, + { + "name": "Docker", + "percentage": "50" + }, + { + "name": "Kubernetes", + "percentage": "40" + }, + { + "name": "AWS", + "percentage": "60" } ], "interest": [ - "javascript", - "develop", - "backend", - "frontend" + "Java", + "Javascript", + "Solidity", + "Blockchain", + "Software Development", + "Backend", + "Frontend" ], "languages": [ { "name": "Spanish", - "percentage": "90%" + "percentage": "100" }, { "name": "English", - "percentage": "50%" + "percentage": "70" + }, + { + "name": "French", + "percentage": "1" } ], "social": [ { "name": "facebook", - "url": "https://facebook.com/" + "url": "https://facebook.com/ewcastroh", + "badge": "https://img.shields.io/badge/Facebook-0077B5?style=for-the-badge&logo=facebook&logoColor=white" }, { "name": "twitter", - "url": "https://twitter.com/" + "url": "https://twitter.com/ewcastroh", + "badge": "https://img.shields.io/badge/Twitter-1DA1F2?style=for-the-badge&logo=twitter&logoColor=white" }, { "name": "github", - "url": "https://github.com/" + "url": "https://github.com/ewcastroh", + "badge": "https://img.shields.io/badge/Github-0077B5?style=for-the-badge&logo=github&logoColor=white" }, { "name": "linkedin", - "url": "https://www.linkedin.com/" + "url": "https://www.linkedin.com/in/ewcastroh", + "badge": "https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white" } ] } diff --git a/generate-react-cli.json b/generate-react-cli.json new file mode 100644 index 00000000..cc6799cc --- /dev/null +++ b/generate-react-cli.json @@ -0,0 +1,15 @@ +{ + "usesTypeScript": true, + "usesCssModule": true, + "cssPreprocessor": "styl", + "testLibrary": "Enzyme", + "component": { + "default": { + "path": "src/components", + "withStyle": true, + "withTest": false, + "withStory": true, + "withLazy": false + } + } +} \ No newline at end of file diff --git a/package-lock.json b/package-lock.json index 75c4a203..2553a7d0 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3269,19 +3269,6 @@ "node": ">= 0.6" } }, - "node_modules/acorn": { - "version": "6.4.2", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz", - "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ==", - "dev": true, - "peer": true, - "bin": { - "acorn": "bin/acorn" - }, - "engines": { - "node": ">=0.4.0" - } - }, "node_modules/acorn-jsx": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz", @@ -5675,19 +5662,6 @@ "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8" } }, - "node_modules/eslint-plugin-react-hooks": { - "version": "4.6.0", - "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz", - "integrity": "sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g==", - "dev": true, - "peer": true, - "engines": { - "node": ">=10" - }, - "peerDependencies": { - "eslint": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0" - } - }, "node_modules/eslint-plugin-react/node_modules/doctrine": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz", @@ -12426,20 +12400,6 @@ "is-typedarray": "^1.0.0" } }, - "node_modules/typescript": { - "version": "4.7.4", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz", - "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==", - "dev": true, - "peer": true, - "bin": { - "tsc": "bin/tsc", - "tsserver": "bin/tsserver" - }, - "engines": { - "node": ">=4.2.0" - } - }, "node_modules/unbox-primitive": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz", @@ -15666,8 +15626,7 @@ "@webpack-cli/configtest": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/@webpack-cli/configtest/-/configtest-1.2.0.tgz", - "integrity": "sha512-4FB8Tj6xyVkyqjj1OaTqCjXYULB9FMkqQ8yGrZjRDrYh0nOE+7Lhs45WioWQQMV+ceFlE368Ukhe6xdvJM9Egg==", - "requires": {} + "integrity": "sha512-4FB8Tj6xyVkyqjj1OaTqCjXYULB9FMkqQ8yGrZjRDrYh0nOE+7Lhs45WioWQQMV+ceFlE368Ukhe6xdvJM9Egg==" }, "@webpack-cli/info": { "version": "1.5.0", @@ -15680,8 +15639,7 @@ "@webpack-cli/serve": { "version": "1.7.0", "resolved": "https://registry.npmjs.org/@webpack-cli/serve/-/serve-1.7.0.tgz", - "integrity": "sha512-oxnCNGj88fL+xzV+dacXs44HcDwf1ovs3AuEzvP7mqXw7fQntqIhQ1BRmynh4qEKQSSSRSWVyXRjmTbZIX9V2Q==", - "requires": {} + "integrity": "sha512-oxnCNGj88fL+xzV+dacXs44HcDwf1ovs3AuEzvP7mqXw7fQntqIhQ1BRmynh4qEKQSSSRSWVyXRjmTbZIX9V2Q==" }, "@xtuc/ieee754": { "version": "1.2.0", @@ -15702,19 +15660,11 @@ "negotiator": "0.6.3" } }, - "acorn": { - "version": "6.4.2", - "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.2.tgz", - "integrity": "sha512-XtGIhXwF8YM8bJhGxG5kXgjkEuNGLTkoYqVE+KMR+aspr4KGYmKYg7yUe3KghyQ9yheNwLnjmzh/7+gfDBmHCQ==", - "dev": true, - "peer": true - }, "acorn-jsx": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz", "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==", - "dev": true, - "requires": {} + "dev": true }, "ajv": { "version": "6.12.6", @@ -15756,8 +15706,7 @@ "ajv-keywords": { "version": "3.5.2", "resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz", - "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==", - "requires": {} + "integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==" }, "ansi-align": { "version": "3.0.1", @@ -17497,8 +17446,7 @@ "version": "8.5.0", "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-8.5.0.tgz", "integrity": "sha512-obmWKLUNCnhtQRKc+tmnYuQl0pFU1ibYJQ5BGhTVB08bHe9wC8qUeG7c08dj9XX+AuPj1YSGSQIHl1pnDHZR0Q==", - "dev": true, - "requires": {} + "dev": true }, "eslint-import-resolver-node": { "version": "0.3.6", @@ -17672,14 +17620,6 @@ } } }, - "eslint-plugin-react-hooks": { - "version": "4.6.0", - "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz", - "integrity": "sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g==", - "dev": true, - "peer": true, - "requires": {} - }, "eslint-scope": { "version": "7.1.1", "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.1.1.tgz", @@ -18516,8 +18456,7 @@ "version": "5.1.0", "resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz", "integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==", - "dev": true, - "requires": {} + "dev": true }, "ignore": { "version": "5.2.0", @@ -19500,8 +19439,7 @@ "version": "1.2.2", "resolved": "https://registry.npmjs.org/jest-pnp-resolver/-/jest-pnp-resolver-1.2.2.tgz", "integrity": "sha512-olV41bKSMm8BdnuMsewT4jqlZ8+3TCARAXjZGT9jcoSnrfUnRCqnMoF9XEeoWjbzObpqF9dRhHQj0Xb9QdF6/w==", - "dev": true, - "requires": {} + "dev": true }, "jest-regex-util": { "version": "28.0.2", @@ -21129,8 +21067,7 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz", "integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==", - "dev": true, - "requires": {} + "dev": true }, "postcss-modules-local-by-default": { "version": "4.0.0", @@ -22210,8 +22147,7 @@ "version": "3.3.1", "resolved": "https://registry.npmjs.org/style-loader/-/style-loader-3.3.1.tgz", "integrity": "sha512-GPcQ+LDJbrcxHORTRes6Jy2sfvK2kS6hpSfI/fXhPt+spVzxF6LJ1dHLN9zIGmVaaP044YKaIatFaufENRiDoQ==", - "dev": true, - "requires": {} + "dev": true }, "stylus": { "version": "0.58.1", @@ -22502,13 +22438,6 @@ "is-typedarray": "^1.0.0" } }, - "typescript": { - "version": "4.7.4", - "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz", - "integrity": "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==", - "dev": true, - "peer": true - }, "unbox-primitive": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz", @@ -22768,8 +22697,7 @@ "acorn-import-assertions": { "version": "1.8.0", "resolved": "https://registry.npmjs.org/acorn-import-assertions/-/acorn-import-assertions-1.8.0.tgz", - "integrity": "sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw==", - "requires": {} + "integrity": "sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw==" }, "enhanced-resolve": { "version": "5.10.0", @@ -22965,8 +22893,7 @@ "ws": { "version": "8.8.0", "resolved": "https://registry.npmjs.org/ws/-/ws-8.8.0.tgz", - "integrity": "sha512-JDAgSYQ1ksuwqfChJusw1LSJ8BizJ2e/vVu5Lxjq3YvNJNlROv1ui4i+c/kUUrPheBvQl4c5UbERhTwKa6QBJQ==", - "requires": {} + "integrity": "sha512-JDAgSYQ1ksuwqfChJusw1LSJ8BizJ2e/vVu5Lxjq3YvNJNlROv1ui4i+c/kUUrPheBvQl4c5UbERhTwKa6QBJQ==" } } }, diff --git a/package.json b/package.json index d56de193..21bbec11 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,7 @@ "react", "webpack" ], - "author": "Oscar Barajas ", + "author": "Eimer Castro ", "license": "MIT", "dependencies": { "@babel/core": "7.18.6", diff --git a/public/index.html b/public/index.html index b76b4f47..ad75c67d 100644 --- a/public/index.html +++ b/public/index.html @@ -2,7 +2,9 @@ - React Base + Resume - Eimer Castro + +
diff --git a/src/__test__/components/About.test.js b/src/__test__/components/About.test.js index 4f3bd51a..a4ab0ec0 100644 --- a/src/__test__/components/About.test.js +++ b/src/__test__/components/About.test.js @@ -1,20 +1,21 @@ import React from 'react'; -import { mount } from 'enzyme'; -import About from '../../components/About'; +import { shallow } from 'enzyme'; +import { About } from '../../components/About'; describe('', () => { - const about = mount(); + const mockAbout = ['LinkedIn', 'Twitter', 'Facebook']; + const about = shallow( < About social={ mockAbout } / > ); - test('About render', () => { - expect(about.length).toEqual(1); - }); + test('About render', () => { + expect(about.length).toEqual(1); + }); - test('About title', () => { - expect(about.find('.About-title').length).toEqual(1); - }); + test('About title', () => { + expect(about.find('.About-title').length).toEqual(1); + }); - test('About haves 3 items', () => { - expect(about.find('.About-item').length).toBeGreaterThan(2); - }); + test('About haves 3 items', () => { + expect(about.find('.About-item').length).toBeGreaterThan(2); + }); -}); +}); \ No newline at end of file diff --git a/src/__test__/components/Academic.test.js b/src/__test__/components/Academic.test.js index 10718e5d..ccf1a456 100644 --- a/src/__test__/components/Academic.test.js +++ b/src/__test__/components/Academic.test.js @@ -1,20 +1,21 @@ import React from 'react'; -import { mount } from 'enzyme'; -import Academic from '../../components/Academic'; +import { shallow } from 'enzyme'; +import { Academic } from '../../components/Academic'; describe('', () => { - const academic = mount(); + const mockInterests = ['Universidad Nacional de Colombia', 'MIT', 'Stanford']; + const academic = shallow( < Academic academic={ mockInterests } / > ); - test('Academic render', () => { - expect(academic.length).toEqual(1); - }); + test('Academic render', () => { + expect(academic.length).toEqual(1); + }); - test('Academic title', () => { - expect(academic.find('.Academic-title').length).toEqual(1); - }); + test('Academic title', () => { + expect(academic.find('.Academic-title').length).toEqual(1); + }); - test('Academic has 3 items', () => { - expect(academic.find('.Academic-item').length).toBeGreaterThan(2); - }); + test('Academic has 3 items', () => { + expect(academic.find('.Academic-item').length).toBeGreaterThan(2); + }); -}); +}); \ No newline at end of file diff --git a/src/__test__/components/Experience.test.js b/src/__test__/components/Experience.test.js index 6ddf5fbf..4a1c0358 100644 --- a/src/__test__/components/Experience.test.js +++ b/src/__test__/components/Experience.test.js @@ -1,20 +1,21 @@ import React from 'react'; -import { mount } from 'enzyme'; -import Experience from '../../components/Experience'; +import { shallow } from 'enzyme'; +import { Experience } from '../../components/Experience'; describe('', () => { - const experience = mount(); + const mockExperiences = ['EPAM', 'Globant', 'Ceiba', 'Todo1']; + const experience = shallow( < Experience experiences={ mockExperiences }/ > ); - test('Experience render', () => { - expect(experience.length).toEqual(1); - }); + test('Experience render', () => { + expect(experience.length).toEqual(1); + }); - test('Experience title', () => { - expect(experience.find('.Experience-title').length).toEqual(1); - }); + test('Experience title', () => { + expect(experience.find('.Experience-title').length).toEqual(1); + }); - test('Experience haves 3 items', () => { - expect(experience.find('.Experience-item').length).toBeGreaterThan(2); - }); + test('Experience haves 3 items', () => { + expect(experience.find('.Experience-item').length).toBeGreaterThan(2); + }); -}); +}); \ No newline at end of file diff --git a/src/__test__/components/Header.test.js b/src/__test__/components/Header.test.js index 894ec0ab..d507f2ec 100644 --- a/src/__test__/components/Header.test.js +++ b/src/__test__/components/Header.test.js @@ -1,16 +1,16 @@ import React from 'react'; -import { mount } from 'enzyme'; -import Header from '../../components/Header'; +import { shallow } from 'enzyme'; +import { Header } from '../../components/Header'; describe('
', () => { - const header = mount(
); + const header = shallow( < Header / > ); - test('Header render', () => { - expect(header.length).toEqual(1); - }); + test('Header render', () => { + expect(header.length).toEqual(1); + }); - test('Header title', () => { - expect(header.find('.Header-title').length).toEqual(1); - }); + test('Header title', () => { + expect(header.find('.Header-title').length).toEqual(1); + }); -}); +}); \ No newline at end of file diff --git a/src/__test__/components/Interest.test.js b/src/__test__/components/Interest.test.js index cbf665b3..53776f30 100644 --- a/src/__test__/components/Interest.test.js +++ b/src/__test__/components/Interest.test.js @@ -1,20 +1,21 @@ import React from 'react'; -import { mount } from 'enzyme'; -import Interest from '../../components/Interest'; +import { shallow } from 'enzyme'; +import { Interest } from '../../components/Interest'; describe('', () => { - const interest = mount(); + const mockInterests = ['Java', 'Solidity', 'Blockchain']; + const interest = shallow( < Interest interests={ mockInterests } / > ); - test('Interest render', () => { - expect(interest.length).toEqual(1); - }); + test('Interest render', () => { + expect(interest.length).toEqual(1); + }); - test('Interest title', () => { - expect(interest.find('.Interest-title').length).toEqual(1); - }); + test('Interest title', () => { + expect(interest.find('.Interest-title').length).toEqual(1); + }); - test('Interest has 3 items', () => { - expect(interest.find('.Interest-item').length).toBeGreaterThan(2); - }); + test('Interest has 3 items', () => { + expect(interest.find('.Interest-item').length).toBeGreaterThan(2); + }); -}); +}); \ No newline at end of file diff --git a/src/__test__/components/Languages.test.js b/src/__test__/components/Languages.test.js index 1d10e137..2e75a28a 100644 --- a/src/__test__/components/Languages.test.js +++ b/src/__test__/components/Languages.test.js @@ -1,20 +1,21 @@ import React from 'react'; -import { mount } from 'enzyme'; -import Languages from '../../components/Languages'; +import { shallow } from 'enzyme'; +import { Languages } from '../../components/Languages'; describe('', () => { - const languages = mount(); + const mockLanguages = ['Spanish', 'English', 'French']; + const languages = shallow( < Languages languages={ mockLanguages } / > ); - test('Languages render', () => { - expect(languages.length).toEqual(1); - }); + test('Languages render', () => { + expect(languages.length).toEqual(1); + }); - test('Languages title', () => { - expect(languages.find('.Languages-title').length).toEqual(1); - }); + test('Languages title', () => { + expect(languages.find('.Languages-title').length).toEqual(1); + }); - test('Languages has 3 items', () => { - expect(languages.find('.Languages-item').length).toBeGreaterThan(2); - }); + test('Languages has 3 items', () => { + expect(languages.find('.Languages-item').length).toBeGreaterThan(2); + }); -}); +}); \ No newline at end of file diff --git a/src/__test__/components/Profile.test.js b/src/__test__/components/Profile.test.js index f71ed22b..64e3a09c 100644 --- a/src/__test__/components/Profile.test.js +++ b/src/__test__/components/Profile.test.js @@ -1,20 +1,20 @@ import React from 'react'; -import { mount } from 'enzyme'; -import Profile from '../../components/Profile'; +import { shallow } from 'enzyme'; +import { Profile } from '../../components/Profile'; describe('', () => { - const profile = mount(); + const profile = shallow( < Profile / > ); - test('Profile render', () => { - expect(profile.length).toEqual(1); - }); + test('Profile render', () => { + expect(profile.length).toEqual(1); + }); - test('Profile title', () => { - expect(profile.find('.Profile-title').length).toEqual(1); - }); + test('Profile title', () => { + expect(profile.find('.Profile-title').length).toEqual(1); + }); - test('Profile have a description', () => { - expect(profile.find('.Profile-desc').length).toEqual(1); - }); + test('Profile have a description', () => { + expect(profile.find('.Profile-desc').length).toEqual(1); + }); -}); +}); \ No newline at end of file diff --git a/src/__test__/components/Skills.test.js b/src/__test__/components/Skills.test.js index 4c3d9a53..9b12856e 100644 --- a/src/__test__/components/Skills.test.js +++ b/src/__test__/components/Skills.test.js @@ -1,20 +1,21 @@ import React from 'react'; -import { mount } from 'enzyme'; -import Skills from '../../components/Skills'; +import { shallow } from 'enzyme'; +import { Skills } from '../../components/Skills'; describe('', () => { - const skills = mount(); + const mockSkills = ['Java', 'Spring Boot', 'React', 'AWS']; + const skills = shallow( < Skills skills={ mockSkills }/ > ); - test('Skills render', () => { - expect(skills.length).toEqual(1); - }); + test('Skills render', () => { + expect(skills.length).toEqual(1); + }); - test('Skills title', () => { - expect(skills.find('.Skills-title').length).toEqual(1); - }); + test('Skills title', () => { + expect(skills.find('.Skills-title').length).toEqual(1); + }); - test('Skills has 3 items', () => { - expect(skills.find('.Skills-item').length).toBeGreaterThan(2); - }); + test('Skills has 3 items', () => { + expect(skills.find('.Skills-item').length).toBeGreaterThan(2); + }); -}); +}); \ No newline at end of file diff --git a/src/components/About/index.jsx b/src/components/About/index.jsx new file mode 100644 index 00000000..9abe6d4f --- /dev/null +++ b/src/components/About/index.jsx @@ -0,0 +1,24 @@ +import React from 'react'; + +export const About = ({social}) => { + return ( +
+

+ More About Me +

+
+
    + { + social?.map((socialNet, index) => ( +
  • + + + +
    • + )) + } +
+
+
+ ); +} diff --git a/src/components/Academic/index.jsx b/src/components/Academic/index.jsx new file mode 100644 index 00000000..ba91a765 --- /dev/null +++ b/src/components/Academic/index.jsx @@ -0,0 +1,23 @@ +import React from 'react'; + +export const Academic = ({academic}) => { + return ( +
+

Academic

+
    + { + academic?.map((place, index) => ( +
  • +
    +
    {place.degree}
    +
    {place.description}
    +
    {place.institution}
    +
    +
    +
    • + )) + } +
+
+ ); + }; diff --git a/src/components/Certificate/index.jsx b/src/components/Certificate/index.jsx new file mode 100644 index 00000000..e10f7f36 --- /dev/null +++ b/src/components/Certificate/index.jsx @@ -0,0 +1,24 @@ +import React from 'react'; + +export const Certificate = ({ certificates }) => { + return ( +
+

Certificates

+
    + { + certificates?.map((certification, index) => ( +
  • +
    +
    {certification.name}
    +
    {certification.date}
    +
    {certification.description}
    +
    {certification.institution}
    +
    +
    +
    • + )) + } +
+
+ ); +}; diff --git a/src/components/Experience/index.jsx b/src/components/Experience/index.jsx new file mode 100644 index 00000000..c9fbecc1 --- /dev/null +++ b/src/components/Experience/index.jsx @@ -0,0 +1,26 @@ +import React from 'react'; + +export const Experience = ({ experiences }) => { + return ( +
+

Experience

+
+
    + { + experiences?.map((experience, index) => ( +
  • +
    +
    {experience.company}
    +
    {experience.startDate} - {experience.endDate}
    +
    {experience.jobTitle}
    +
    {experience.jobDescription}
    +
    +
    +
    • + )) + } +
+
+
+ ); +} diff --git a/src/components/Header/index.jsx b/src/components/Header/index.jsx new file mode 100644 index 00000000..60460b4d --- /dev/null +++ b/src/components/Header/index.jsx @@ -0,0 +1,20 @@ +import React from 'react'; + +export const Header = ({name, avatar, profession, phone, email, website, address, children} ) => { + return ( +
+

{name}

+
+ +
+
+
{profession}
+
Phone: {phone}
+
Email: {email}
+
Website: {website}
+
Location: {address}
+
+ {children} +
+ ); +} diff --git a/src/components/Interest/index.jsx b/src/components/Interest/index.jsx new file mode 100644 index 00000000..4223fe22 --- /dev/null +++ b/src/components/Interest/index.jsx @@ -0,0 +1,20 @@ +import React from 'react'; + +export const Interest = ({interests}) => { + return ( +
+

Interest

+
+
    + { + interests?.map((interest, index) => ( +
  • + {interest} +
    • + )) + } +
+
+
+ ); +} diff --git a/src/components/Languages/index.jsx b/src/components/Languages/index.jsx new file mode 100644 index 00000000..14b9548f --- /dev/null +++ b/src/components/Languages/index.jsx @@ -0,0 +1,20 @@ +import React from 'react'; + +export const Languages = ({languages}) => { + return ( +
+

Languages

+
+
    + { + languages?.map((language, index) => ( +
  • + {language.name}: {language.percentage}% +
    • + )) + } +
+
+
+ ); +} diff --git a/src/components/Profile/index.jsx b/src/components/Profile/index.jsx new file mode 100644 index 00000000..daec4bf3 --- /dev/null +++ b/src/components/Profile/index.jsx @@ -0,0 +1,10 @@ +import React from 'react'; + +export const Profile = ({profile}) => { + return ( +
+

Profile

+

{profile}

+
+ ); +} diff --git a/src/components/Skills/index.jsx b/src/components/Skills/index.jsx new file mode 100644 index 00000000..aea1a49e --- /dev/null +++ b/src/components/Skills/index.jsx @@ -0,0 +1,21 @@ +import React from 'react'; + +export const Skills = ({ skills }) => { + return ( +
+

Skills

+
+
    + { + skills?.map((skill, index) => ( +
  • + + {skill.percentage}% +
    • + )) + } +
+
+
+ ); +} diff --git a/src/containers/App.jsx b/src/containers/App.jsx index 57224430..f291dbc9 100644 --- a/src/containers/App.jsx +++ b/src/containers/App.jsx @@ -1,28 +1,62 @@ -import React from 'react'; +import React, { useState, useEffect } from 'react'; import '../styles/components/App.styl'; -import Header from '../components/Header'; -import About from '../components/About'; -import Profile from '../components/Profile'; -import Experience from '../components/Experience'; -import Academic from '../components/Academic'; -import Skills from '../components/Skills'; -import Interest from '../components/Interest'; -import Languages from '../components/Languages'; +import { Header } from '../components/Header'; +import { About } from '../components/About'; +import { Profile } from '../components/Profile'; +import { Experience } from '../components/Experience'; +import { Certificate } from '../components/Certificate'; +import { Academic } from '../components/Academic'; +import { Skills } from '../components/Skills'; +import { Interest } from '../components/Interest'; +import { Languages } from '../components/Languages'; +import getData from '../utils/getData'; + +// const url = 'http://localhost:3000/data' +const url = 'https://ewcastroh.github.io/data.json' + +const getUserData = () => { + const [data, setData] = useState([]); + + useEffect(() => { + getData(url) + .then(response => setData(response.data)); + }, []); + return data; +} + +export const App = () => { + const data = getUserData(); + + const { + name, + profession, + phone, + email, + website, + address, + avatar, + Profile: profile, + certificate: certificates, + Academic: academic, + experience: experiences, + skills, + interest: interests, + languages, + social, + } = data; -const App = () => { return ( - <> -
- + +
+
- - - - - - - + + + + + + + + ) }; - -export default App; diff --git a/src/css/main.css b/src/css/main.css new file mode 100644 index 00000000..df74a123 --- /dev/null +++ b/src/css/main.css @@ -0,0 +1,8 @@ +html, +body { + background-color: #21232A; + color: white; + font-family: Arial, Helvetica, sans-serif; + font-size: 1.3rem; + padding: 70px; +} diff --git a/src/index.js b/src/index.js index 9077e5ff..6741c9b5 100644 --- a/src/index.js +++ b/src/index.js @@ -1,5 +1,7 @@ import React from 'react'; -import ReactDOM from 'react-dom'; -import App from './containers/App'; +import ReactDOM from 'react-dom/client'; +import { App } from './containers/App'; -ReactDOM.render(, document.getElementById('app')); +ReactDOM.createRoot(document.getElementById('app')).render( + +); \ No newline at end of file diff --git a/src/styles/components/App.styl b/src/styles/components/App.styl index 4f92eccb..28fdc506 100644 --- a/src/styles/components/App.styl +++ b/src/styles/components/App.styl @@ -1,2 +1,20 @@ -body - background-color blue \ No newline at end of file +html, body + background-color #21232A + color white + font-family Arial, Helvetica, sans-serif + font-size 1.1em + padding 10px + +.academic-section, .certificate-section, .interest-section, .language-section, .skills-section, .work-experience-section + padding 1.5rem 5rem 2rem !important + +.avatar + width 250px + height 250px + border-top-left-radius 50% 50% + border-top-right-radius 50% 50% + border-bottom-right-radius 50% 50% + border-bottom-left-radius 50% 50% + border 2px solid #CCC + margin-bottom 2px + diff --git a/src/utils/getData.js b/src/utils/getData.js index e69de29b..12f546af 100644 --- a/src/utils/getData.js +++ b/src/utils/getData.js @@ -0,0 +1,18 @@ +const getData = (url) => { + return fetch(url) + .then((response) => response.json()) + .then((data) => data) + .catch((error) => error); +}; +export default getData; + +/* const getData = async(url) => { + try { + const response = await fetch(url); + const data = await response.json(); + return data; + } catch (error) { + console.error(error); + } +}; +export default getData; */ \ No newline at end of file