-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
22 lines (22 loc) · 50.1 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!doctype html><html lang=es_MX class="mt-10 lg:mt-0"><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=description content=""><meta name=viewport content="width=device-width,initial-scale=1"><title>Javier Ruiz Vázquez - Fullstack Javascript Developer</title><meta name=msapplication-tap-highlight content=no><link rel=manifest href=manifest.json><meta name=mobile-web-app-capable content=yes><meta name=application-name content="Javier Ruiz Vázquez"><link rel=icon sizes=192x192 href=images/touch/chrome-touch-icon-192x192.png><meta name=apple-mobile-web-app-capable content=yes><meta name=apple-mobile-web-app-status-bar-style content=black><meta name=apple-mobile-web-app-title content="Javier Ruiz Vázquez"><link rel=apple-touch-icon href=images/touch/apple-touch-icon.png><meta name=msapplication-TileImage content=images/touch/ms-touch-icon-144x144-precomposed.png><meta name=msapplication-TileColor content=#356CFC><meta name=theme-color content=#356CFC><meta property=og:fb:app_id content=441754666196993><meta property=og:title content="Javier Ruiz Vázquez - Fullstack Javascript Developer"><meta property=og:description content="Welcome to my site, here you're gonna find some things I love to do, I'm Frontend developer and Javascript lover, I like
to try new technologies for development projects and find the best practices of design and development."><meta property=og:type content=website><meta property=og:url content=https://javarv87.github.io/ ><meta property=og:site_name content=javarv87.github.io><meta property=og:image content=https://javarv87.github.io/images/touch/chrome-touch-icon-192x192.png><meta property=og:image:alt content="Javier Ruiz Vázquez"><script defer src=fonts/fontawesome/js/fontawesome-all.min.js></script><link rel=stylesheet href=styles/main.css><body class="font-sans text-black antialiased tracking-tight leading-tight"><div class="fixed pin-t flex items-center justify-center min-h-screen text-xl w-full loading-page bg-gradient-brand bg-indigo-theme-dark z-30"><div class="container p-4"><div class="text-center relative w-48 m-auto"><div class="w-16 m-auto mb-4 block"><svg class="bounce-animation w-16" viewBox="0 0 81 89" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><desc>Stormtrooper</desc><defs><path d="M8.07922746,42.6322614 C7.67102544,41.9596996 6.73307149,41.6908731 6.16752729,42.8176603 C0.514611527,53.0157845 0.926372375,52.7051627 0.926372375,52.7051627 C-0.954396279,56.6073793 0.20538831,62.0347072 3.51635748,64.8270456 L2.85297697,64.2675771 C6.16415489,67.0600916 12.2383961,68.3988967 16.4291442,67.2554345 L30.7055414,63.3600629 C33.4169262,62.6202509 37.8870263,61.9780739 40.6963537,61.925598 L43.1608028,61.8795641 C45.9671913,61.8271431 50.4690662,62.2213663 53.2151827,62.7976899 C53.2151827,62.7976899 60.0126414,63.9587328 68.6213587,66.8894442 C72.4125153,67.8390958 69.9261722,67.2162886 69.9261722,67.2162886 C73.3931395,68.0847336 77.4128747,66.1652219 78.9136542,62.9090822 L79.476617,61.68766 C79.7435828,61.1084422 79.4893448,60.4414225 79.2234232,60.329851 L79.2234232,60.329851 C79.2234232,60.329851 79.8345882,58.883913 80.0757236,57.4109917 C80.5987179,57.1826099 81.5543173,55.2491569 80.3889789,52.3935465 C79.2236404,49.5379361 80.700006,42.3322473 82.433354,33.7168848 C85.6644275,-2.57393565 28.5638065,-11.0514427 19.3073293,15.6592797 C18.3279915,15.4464401 17.5764427,18.4297605 17.5764427,18.4297605 C17.5764427,18.4297605 17.2107883,18.4469044 17.1048703,18.598321 C16.5761834,19.3541126 16.5761047,19.4009635 16.4096933,20.1685684 C16.3939167,20.4379228 16.6783807,20.3797458 16.9423999,20.594812 C16.9423999,21.901732 18.8934737,22.19182 18.8934737,22.19182 C18.8934737,22.19182 33.4921802,26.6093148 34.9356539,27.4850195 C35.2362721,27.0748528 35.7625302,26.459471 35.7625302,26.459471 L38.2396348,25.2561924 C38.2396348,25.2561924 41.7764873,20.8408895 42.679608,20.8408895 C43.2646204,20.8408895 50.280055,22.5343527 51.7296201,23.9394041 C52.4330192,24.6212029 54.4222687,33.4985013 50.9598517,33.4985013 C47.9371688,31.623293 32.9178644,27.823167 32.5290899,28.3439148 C29.8437163,31.537226 28.7408354,33.9196942 30.2292945,35.4286771 C38.9509925,40.6987185 35.0782478,43.7490848 27.2289626,47.4710245 C20.5253278,49.9605407 13.7335422,53.670319 12.0118151,52.0537037 C10.290088,50.4370883 10.2916336,46.2774661 8.07922746,42.6322614 Z" id=path-1></path><radialGradient cx=50% cy=0% fx=50% fy=0% r=76.4439076% gradientTransform=translate(0.500000,0.000000),scale(0.820510,1.000000),rotate(77.936853),translate(-0.500000,-0.000000) id=radialGradient-3><stop stop-color=#F9F9F9 offset=3.86639031%></stop><stop stop-color=#E8E7E8 offset=100%></stop></radialGradient><path d="M8.07922746,42.6322614 C7.67102544,41.9596996 6.73307149,41.6908731 6.16752729,42.8176603 C0.886986108,53.4447715 1.13250199,52.8100851 1.13250199,52.8100851 C-0.862108906,56.6543546 0.20538831,62.0347072 3.51635748,64.8270456 L2.85297697,64.2675771 C6.16415489,67.0600916 12.2383961,68.3988967 16.4291442,67.2554345 L30.7055414,63.3600629 C33.4169262,62.6202509 37.8870263,61.9780739 40.6963537,61.925598 L43.1608028,61.8795641 C45.9671913,61.8271431 50.4690662,62.2213663 53.2151827,62.7976899 C53.2151827,62.7976899 60.0126414,63.9587328 68.6213587,66.8894442 C72.4125153,67.8390958 69.9261722,67.2162886 69.9261722,67.2162886 C73.3931395,68.0847336 77.4128747,66.1652219 78.9136542,62.9090822 L79.476617,61.68766 C79.7435828,61.1084422 79.4893448,60.4414225 79.2234232,60.329851 L79.2234232,60.329851 C79.2234232,60.329851 79.8345882,58.883913 80.0757236,57.4109917 C80.5987179,57.1826099 81.5543173,55.2491569 80.3889789,52.3935465 C79.2236404,49.5379361 80.700006,42.3322473 82.433354,33.7168848 C85.6644275,-2.57393565 28.5638065,-11.0514427 19.3073293,15.6592797 C18.3279915,15.4464401 17.5764427,18.4297605 17.5764427,18.4297605 C17.5764427,18.4297605 17.2107883,18.4469044 17.1048703,18.598321 C16.5761834,19.3541126 16.5761047,19.4009635 16.4096933,20.1685684 C16.3939167,20.4379228 16.6783807,20.3797458 16.9423999,20.594812 C16.9423999,21.901732 18.8934737,22.19182 18.8934737,22.19182 C18.8934737,22.19182 33.4921802,26.6093148 34.9356539,27.4850195 C35.2362721,27.0748528 35.7625302,26.459471 35.7625302,26.459471 L38.2396348,25.2561924 C38.2396348,25.2561924 41.7764873,20.8408895 42.679608,20.8408895 C43.2646204,20.8408895 50.280055,22.5343527 51.7296201,23.9394041 C52.4330192,24.6212029 54.4222687,33.4985013 50.9598517,33.4985013 C47.9371688,31.623293 32.9178644,27.823167 32.5290899,28.3439148 C29.8437163,31.537226 28.7408354,33.9196942 30.2292945,35.4286771 C38.9509925,40.6987185 35.0782478,43.7490848 27.2289626,47.4710245 C20.5253278,49.9605407 13.7335422,53.670319 12.0118151,52.0537037 C10.290088,50.4370883 10.2916336,46.2774661 8.07922746,42.6322614 Z" id=path-4></path><radialGradient cx=50% cy=0% fx=50% fy=0% r=100% gradientTransform=translate(0.500000,0.000000),scale(1.000000,0.622774),rotate(90.000000),translate(-0.500000,-0.000000) id=radialGradient-6><stop stop-color=#AFADAD offset=0%></stop><stop stop-color=#F8F8F8 offset=100%></stop></radialGradient><path d="M1.10318042,15.4221278 L4.01658286,23.4922126 C4.27644382,24.2120239 5.07924869,24.5966119 5.79356123,24.356635 L5.7337282,24.3767362 C6.45526529,24.1343322 6.83564272,23.4097154 6.86445974,23.3848926 C6.86445974,23.3848926 6.63010293,23.5515601 6.86445974,23.3848926 C11.3915729,21.1429052 15.5589591,17.879531 15.5589591,17.879531 L16.8068391,14.1297345 C16.9665006,13.6499622 16.8176207,12.9640066 16.4719263,12.5844112 C16.4719263,12.5844112 9.75339241,5.63114736 10.1007455,1.13260098 C9.75339241,0.304577408 8.04174811,-0.770102172 7.8571116,0.821537623 C6.57609377,5.23099232 0.0741855694,13.7584747 0.0741855694,13.7584747 L1.10318042,15.4221278 Z" id=path-7></path></defs><g id=Page-1 stroke=none stroke-width=1 fill=none fill-rule=evenodd><g id=Head transform="translate(31.558904, 39.899666) rotate(-36.000000) translate(-31.558904, -39.899666) translate(-9.941096, 5.899666)"><g id=Back transform="translate(6.252989, 17.772926)"><path d="M1.44771594,25.786197 L3.60785628,20.3913652 C3.60785628,20.3913652 8.51234467,13.9710301 12.2423376,7.29498984 C11.9953405,5.62122298 12.7185018,4.08489038 12.7185018,4.08489038 L37.1547141,0.122957779 L52.8804661,5.32384321 L53.4261824,20.276875 L4.9544901,39.8771571 L0.167339761,30.6389207 L1.44771594,25.786197 Z" id=Path-2 fill=#252122></path><path d="M23.1440893,27.7322406 C21.9673826,27.5845133 19.2575807,24.8960451 19.2575807,24.8960451 C18.893796,24.5499219 18.718285,23.8721937 18.8664903,23.3792217 L19.790274,20.306462 C19.9380654,19.8148668 20.4390407,19.2465151 20.9072931,19.0378776 L22.9624431,18.1221722 C23.0750866,18.0719821 23.2606008,18.0745299 23.378658,18.1387245 C23.378658,18.1387245 24.2144658,18.4474382 23.8318342,19.1803365 C26.0196258,21.4206694 27.5749345,22.6923789 27.5749345,22.6923789 C28.0588881,23.106947 28.1187363,23.8314348 27.6836448,24.3125377 C27.6836448,24.3125377 25.5314506,27.0164027 23.1440893,27.7322406 Z" id=Path-88 fill=#000000></path><path d="M23.5957001,7.94742563 C24.4426801,8.22147173 24.9177094,9.12559866 24.6085201,9.97260464 C24.6085201,9.97260464 23.6522837,14.0102208 19.9866327,16.1831133 C19.0515223,16.9003721 17.8004396,15.7749337 17.8004396,15.7749337 C16.7158266,15.1154668 15.3479577,13.6637321 14.7495492,12.5405215 L13.4099087,10.026021 C12.7491816,8.78583845 12.4202261,6.65704645 12.6731068,5.28242515 L12.824004,4.46217076 L23.5957001,7.94742563 Z" id=Path-89 fill=#000000></path><path d="M18.2508224,14.991004 L17.0711053,13.8689653" id=Path-90 stroke=#4F4F4F stroke-width=0.5 stroke-linecap=round stroke-linejoin=round></path><path d="M15.2543575,11.4353228 C15.2543575,11.4353228 13.1570521,8.14336035 13.1570521,7.26681042" id=Path-91 stroke=#4F4F4F stroke-width=0.5 stroke-linecap=round stroke-linejoin=round></path><ellipse id=Oval-2 fill=#4F4F4F cx=21.769163 cy=10.6180911 rx=1 ry=1></ellipse><ellipse id=Oval-3 fill=#4F4F4F transform="translate(16.796294, 12.934083) rotate(-34.000000) translate(-16.796294, -12.934083) " cx=16.4119297 cy=12.665399 rx=1 ry=1></ellipse></g><g id=Front transform="translate(-0.000000, -0.000000)"><g id=Path-82 transform="translate(-0.000000, 0.000000)"><mask id=mask-2 fill=white><use xlink:href=#path-1></use></mask><use id=Mask-Copy stroke=#252122 stroke-width=2.916 xlink:href=#path-1></use><mask id=mask-5 fill=white><use xlink:href=#path-4></use></mask><use id=Mask fill=url(#radialGradient-3) xlink:href=#path-4></use><path d="M18.4289235,51.1159576 C18.4289235,51.1159576 10.7011811,55.7803641 9.27017211,51.8923979 C8.04545206,46.8677606 5.91299468,41.4742798 5.91299468,41.4742798 L8.29208625,40.768708 L18.4289235,51.1159576 Z" fill=#D8D8D8 mask=url(#mask-5)></path><polygon id=Path-83 fill=#221E1E mask=url(#mask-5) points="35.7277814 26.5476676 15.9418459 20.2456398 16.856207 18.3053932 38.366398 25.1821194"></polygon><path d="M26.2085162,47.784231 C35.6834092,45.5243913 37.6203168,40.0608296 34.6113488,36.7002787 C32.9665338,34.7705797 34.6113488,31.9886233 36.6399458,28.931792 C35.5233264,26.2567472 30.7015388,27.3336881 30.7015388,27.3336881 C30.7015388,27.3336881 25.095475,45.2442324 26.2085162,47.784231 Z" id=Path-76 fill=#FFFFFF mask=url(#mask-5)></path><path d="M23.6082149,20.3989697 C23.6082149,20.3989697 23.9401094,19.1955148 24.2505228,18.2294847 C24.6543933,17.6664052 25.046483,17.8062122 25.7938436,17.3517483 C33.3464795,0.0991149119 53.4317705,0.484604896 53.4317705,0.484604896 L32.1036986,-3.37422223 L14.7710867,15.1943569 L17.534176,18.6080359 L23.6082149,20.3989697 Z" id=Path-87 fill=#FFFFFF mask=url(#mask-5)></path></g><path d="M79.2423159,60.3421054 C47.0440049,50.0811928 15.8686858,61.2105477 15.8686858,61.2105477 C15.8686858,61.2105477 13.3977197,62.1462441 10.7253933,60.8503503 C44.006878,47.0945379 80.0895259,57.4082436 80.0895259,57.4082436 C80.0895259,57.4082436 79.2423159,60.8503503 79.2423159,60.3421054 Z" id=Path-78 fill=#231F1F></path><g id=Path-76></g><path d="M10.7946556,60.8077837 C10.7946556,60.8077837 2.82554163,62.5681182 3.3760789,53.6388134 C3.63319522,51.6569191 2.82554163,49.6814684 2.82554163,49.6814684" id=Path-81 stroke=#979797 stroke-width=0.5></path><ellipse id=Oval-17 fill=url(#radialGradient-6) transform="translate(5.326621, 57.588896) rotate(41.000000) translate(-5.326621, -57.588896) " cx=5.32662052 cy=57.5888958 rx=2.08432977 ry=3.34684966></ellipse><path d="M6.19507196,59.4884755 C6.19507196,59.4884755 7.87951067,58.4342899 7.87951067,56.4694679 C8.14568926,55.4827031 5.53074877,53.7470951 6.19507196,59.4884755 Z" id=Path-79 fill=#231F1F></path><path d="M33.8259326,51.7937708 C34.2461717,51.3918019 35.1962893,50.493334 37.4340557,48.7282309 C40.9407401,47.9592303 49.8169902,48.2870015 49.8169902,48.2870015 L51.7901357,50.740706 C51.7901357,50.740706 38.5746584,50.740706 33.8259326,51.7937708 Z" id=Path-80 fill=#231F1F></path><g id=Path-83 transform="translate(51.457195, 50.534238)" stroke=#979797 stroke-width=0.5><path d="M29.5652436,4.6668121 C23.9226884,1.93878641 0.232253125,0.207932405 0.232253125,0.207932405" id=Path></path></g><path d="M62.3984509,51.6602871 L61.1166722,24.2069478 C60.9501384,20.640099 58.0668699,16.8467664 54.6714595,15.7325788 L48.2334418,13.619974 C46.0524636,12.9042965 42.8538942,13.5088657 41.0902978,14.9694387 L34.4463792,20.4717907 L19.2971499,15.6807399" id=Path-84 stroke=#979797 stroke-width=0.5></path><path d="M58.7042559,6.41364813 C58.7042559,6.41364813 58.9473556,5.95382626 58.9473556,5.42850796 C56.088221,4.07845413 51.5602666,3.04033019 51.5602666,3.04033019 L51.1002524,3.85120612 C54.7017868,4.72698916 58.7042559,6.41364813 58.7042559,6.41364813 Z" id=Path-85 fill=#DBDBDB></path><ellipse id=Oval fill=#FFFFFF transform="translate(68.898678, 22.043044) rotate(-9.000000) translate(-68.898678, -22.043044) " cx=68.8986784 cy=22.0430443 rx=1 ry=1.03867748></ellipse><ellipse id=Oval-18 fill=#FFFFFF transform="translate(68.294961, 28.002453) rotate(-8.000000) translate(-68.294961, -28.002453) " cx=68.2949614 cy=28.0024533 rx=1 ry=1></ellipse><g id=Path-86 transform="translate(8.337319, 24.004991)"><mask id=mask-8 fill=white><use xlink:href=#path-7></use></mask><use id=Mask fill=#EFEDEE xlink:href=#path-7></use><path d="M3.77708213,22.1256426 C8.83736837,25.0357745 12.1971021,10.4202897 12.0010717,8.65217888 C9.77410748,5.5169986 8.51892338,0.0348182888 8.51892338,0.0348182888 L11.434743,0.0348182888 L19.3428485,15.5644563 L6.12246596,26.4242213 C6.12246596,26.4242213 2.70641971,24.2297764 3.77708213,22.1256426 Z" fill=#E4E2E4 mask=url(#mask-8)></path></g></g></g></g></svg> <svg class="linear-animation w-16" viewBox="0 0 96 6" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><desc>Stormtrooper Shadow</desc><defs><filter x=-20.7% y=-241.4% width=141.4% height=582.7% filterUnits=objectBoundingBox id=filter-1><feGaussianBlur stdDeviation="4.82745536 0" in=SourceGraphic></feGaussianBlur></filter></defs><rect id=Shadow fill=#4D4D60 filter=url(#filter-1) x=13 y=0 width=70 height=6 rx=3></rect></svg></div><svg class="w-3 bounce-animation absolute pin-b pin-l -ml-2" viewBox="0 0 9 8" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><g id=Decoration-BL stroke=#FFFFFF transform="translate(-617.000000, -416.000000)" stroke-width=1 fill=none fill-rule=evenodd stroke-linecap=round stroke-linejoin=round><path d="M618.017671,416 C618.017671,416 617.699166,417.934287 619.766581,417.934287 C621.833996,417.934287 623.031559,418.374271 623.031559,421.237701 C623.031559,424.101132 625.771592,421.520909 625.771592,421.520909"></path></g></svg> <svg class="w-2 bounce-animation absolute pin-t pin-l mt-6 ml-3" viewBox="0 0 9 9" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><g id=Oval-Green transform="translate(-504.000000, -299.000000)" stroke-width=1.344 stroke=#1DB7C2 fill=none fill-rule=evenodd><circle cx=508.5 cy=303.5 r=3.5></circle></g></svg> <svg class="w-3 bounce-animation absolute pin-t pin-r mr-8 -mt-6" viewBox="0 0 11 11" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><g id=Oval-Yellow transform="translate(-755.000000, -282.000000)" stroke-width=1.7 stroke=#FDD830 fill=none fill-rule=evenodd><circle cx=760.5 cy=287.5 r=4.5></circle></g></svg> <svg class="w-2 bounce-animation absolute pin-b pin-r" viewBox="0 0 5 5" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><g id=X transform="translate(-885.000000, -414.000000)" stroke=#E8408B stroke-width=1.8 fill=none fill-rule=evenodd stroke-linecap=round stroke-linejoin=round><path d="M886,415 L889,418" id=Path-103-Copy transform="translate(887.500000, 416.500000) scale(-1, 1) translate(-887.500000, -416.500000) "></path><path d="M886,415 L889,418" id=Path-103-Copy-2></path></g></svg></div><div class="text-center text-white"><p class="mb-1 text-xl">”This is a new day, a new beginning”<p class=mb-4>______<p class=mb-2>Star Wars</div></div></div><header id=navbar class="fixed pin-t z-20 w-full bg-white lg:bg-transparent shadow lg:shadow-none"><div id=specialShadow class=bg-special-shadow style="opacity: 0; transform: scaleY(1)"></div><div id=navbar-container class="flex items-center justify-between flex-wrap px-4 py-3 lg:p-8"><div class="flex items-center flex-no-shrink stroke-current text-dark"><svg id=logo class="w-8 lg:w-16" viewBox="0 0 68 64" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><desc>Logo Javier Ruiz Vázquez.</desc><defs></defs><g id=logo transform="translate(1.000000, 1.000000)" fill=none stroke-width=1.2><path d="M36.9228917,30.1570107 C36.0294015,30.6948763 35.3050847,31.9702628 35.3050847,33.006393 L35.3050847,61.1104561 C35.3050847,62.0528632 35.971961,62.4333529 36.7945495,61.9603295 L42.2693131,58.8121079 C43.0919218,58.3390729 43.7587781,57.1921825 43.7587781,56.2495547 L43.7587781,37.3898869 C43.7587781,36.4476629 44.4160545,35.2826382 45.2252151,34.7887271 L57.5320858,27.2766216 C58.3419768,26.7822649 59.0015704,27.1459551 59.0049236,28.0881532 C59.0049236,28.0881532 59.0178138,30.8622877 59.0097512,32.2941331 C59.0076459,32.6679927 58.9545235,33.4711109 58.9545235,33.4711109 C58.8999356,34.411888 58.1160928,35.0215084 58.1160928,35.0215084 C58.1160928,35.0215084 56.143958,36.6654765 55.4086037,36.3716112 C54.6732493,36.077746 55.234525,35.4460824 54.7749268,35.0215084 C54.4900536,34.7469319 54.0090469,34.7469319 53.724289,34.7960212 C53.1021573,34.9032702 52.6382267,35.1745385 52.6382267,35.1745385 L49.7838029,36.7948735 C48.959162,37.262987 48.2906583,38.4046871 48.2906583,39.3473256 L48.2906583,43.7337367 C48.2906583,43.7337367 48.416164,45.1382922 49.3917353,45.4653933 C50.0767444,45.6950711 50.6507801,45.7979374 51.3142644,45.4653933 C51.9777484,45.1328492 53.0421938,44.5819915 53.9293238,44.5819915 C54.816454,44.5819915 55.234525,45.7123844 55.234525,45.7123844 L56.4688352,48.0623135 C56.9076816,48.8978069 57.9153369,49.1673374 58.7189975,48.6646387 L64.6978606,44.9247935 C65.5017445,44.4219553 65.5110881,43.5914091 64.718684,43.0696863 L61.988666,41.2722289 C61.1962826,40.7505197 61.217005,39.940894 62.0369976,39.4626855 L64.5113146,38.0196976 C65.412415,37.4941884 66.1432617,36.2281255 66.143707,35.1908749 L66.1525421,14.6080725 C66.1530276,13.4773588 65.3637798,13.0360847 64.3868909,13.624155 L36.9228917,30.1570107 Z" id=Path-R></path><path d="M27.3230024,61.7187152 C28.0806889,62.2163638 28.6949153,61.867331 28.6949153,60.9409079 L28.6949153,32.9172027 C28.6949153,31.9899829 28.0815128,30.8363326 27.3229582,30.3392178 L8.20084101,18.2200513 C7.44313,17.7234894 6.82888387,18.0733325 6.82888387,19 L6.82888387,25.0780955 C6.82888387,26.0054111 7.44388156,27.1596973 8.20074441,27.6551037 L19.6635758,35.1581276 C20.4212334,35.6540543 21.0354363,36.8070664 21.0354363,37.7348423 L21.0354363,46.3826029 C21.0354363,47.3097564 20.4207036,47.6570559 19.6634144,47.1589902 L9.83855784,40.6972254 C9.08081105,40.1988587 8.46653589,39.0436625 8.46653589,38.1156283 L8.46653589,35.8391293 C8.46653589,34.9117192 7.85111984,33.7564337 7.09568006,33.2611618 L1.42170329,29.5412614 C0.664600521,29.0448992 0.0508474576,29.3944955 0.0508474576,30.3196077 L0.0508474576,42.1292716 C0.0508474576,43.0555025 0.66570536,44.2101998 1.4227603,44.7074336 L27.3230024,61.7187152 Z" id=Path-J></path><path d="M63.3709553,4.33927093 C64.1426022,4.80675909 64.1419793,5.56069084 63.3685159,6.02385206 L33.1651367,24.1100797 C32.3921424,24.57296 31.1409269,24.5688811 30.3698811,24.1006127 L0.62047173,6.0333191 C-0.150311133,5.56521029 -0.137165494,4.82884693 0.649598241,4.388737 L7.43836561,0.591149698 C8.2252346,0.150980884 9.4875793,0.172369446 10.2591467,0.639682688 L30.3694782,12.8198551 C31.1404835,13.286828 32.3938585,13.2917914 33.1695133,12.8306178 L54.0818319,0.396983385 C54.8572432,-0.064045422 56.111102,-0.0589785552 56.8830287,0.408679101 L63.3709553,4.33927093 Z" id=Path-V></path></g></svg></div><div class="block lg:hidden"><button type=button id=menu-toggle class="flex items-center p-1 fill-current text-indigo-theme-dark" aria-expanded=false><svg class="h-4 w-4" stroke-width=1.2 aria-hidden=true version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink viewBox="0 0 100 100"><title>Menu</title><path class="line line-1" d="M5 13h100v10H5z"/><path class="line line-2" d="M5 43h100v10H5z"/><path class="line line-3" d="M5 73h100v10H5z"/></svg></button></div><nav id=navbar-list class="self-center w-full text-md font-normal hidden lg:flex lg:items-center lg:w-auto h-screen lg:h-auto"><a href=#home class="no-underline block lg:inline-block mt-4 lg:mt-0 text-indigo-theme-dark hover:text-grey mr-8" title=Home>Home </a><a href=#about class="no-underline block lg:inline-block mt-4 lg:mt-0 text-dark hover:text-grey mr-8" title=About>About </a><a href=#skills class="no-underline block lg:inline-block mt-4 lg:mt-0 text-dark hover:text-grey mr-8" title=Skills>Skills </a><a href=#projects class="no-underline block lg:inline-block mt-4 lg:mt-0 text-dark hover:text-grey mr-8" title=Projects>Projects </a><a href=#contact class="no-underline block lg:inline-block mt-4 lg:mt-0 text-dark hover:text-grey mr-8" title=Contact>Contact </a><a href=https://medium.com/@_javaruiz class="no-underline block lg:inline-block mt-4 lg:mt-0 text-dark hover:text-grey" title=Blog>Blog</a></nav></div></header><main class=content-layout><section id=home class="flex justify-between items-center min-h-screen flex-wrap"><div class="w-full sm:w-3/5 p-8"><div class="block lg:hidden stroke-current text-dark mb-4"><svg id=logo-intro class=w-16 viewBox="0 0 68 64" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><desc>Logo Javier Ruiz Vázquez.</desc><defs></defs><g id=logo transform="translate(1.000000, 1.000000)" fill=none stroke-width=1.2><path d="M36.9228917,30.1570107 C36.0294015,30.6948763 35.3050847,31.9702628 35.3050847,33.006393 L35.3050847,61.1104561 C35.3050847,62.0528632 35.971961,62.4333529 36.7945495,61.9603295 L42.2693131,58.8121079 C43.0919218,58.3390729 43.7587781,57.1921825 43.7587781,56.2495547 L43.7587781,37.3898869 C43.7587781,36.4476629 44.4160545,35.2826382 45.2252151,34.7887271 L57.5320858,27.2766216 C58.3419768,26.7822649 59.0015704,27.1459551 59.0049236,28.0881532 C59.0049236,28.0881532 59.0178138,30.8622877 59.0097512,32.2941331 C59.0076459,32.6679927 58.9545235,33.4711109 58.9545235,33.4711109 C58.8999356,34.411888 58.1160928,35.0215084 58.1160928,35.0215084 C58.1160928,35.0215084 56.143958,36.6654765 55.4086037,36.3716112 C54.6732493,36.077746 55.234525,35.4460824 54.7749268,35.0215084 C54.4900536,34.7469319 54.0090469,34.7469319 53.724289,34.7960212 C53.1021573,34.9032702 52.6382267,35.1745385 52.6382267,35.1745385 L49.7838029,36.7948735 C48.959162,37.262987 48.2906583,38.4046871 48.2906583,39.3473256 L48.2906583,43.7337367 C48.2906583,43.7337367 48.416164,45.1382922 49.3917353,45.4653933 C50.0767444,45.6950711 50.6507801,45.7979374 51.3142644,45.4653933 C51.9777484,45.1328492 53.0421938,44.5819915 53.9293238,44.5819915 C54.816454,44.5819915 55.234525,45.7123844 55.234525,45.7123844 L56.4688352,48.0623135 C56.9076816,48.8978069 57.9153369,49.1673374 58.7189975,48.6646387 L64.6978606,44.9247935 C65.5017445,44.4219553 65.5110881,43.5914091 64.718684,43.0696863 L61.988666,41.2722289 C61.1962826,40.7505197 61.217005,39.940894 62.0369976,39.4626855 L64.5113146,38.0196976 C65.412415,37.4941884 66.1432617,36.2281255 66.143707,35.1908749 L66.1525421,14.6080725 C66.1530276,13.4773588 65.3637798,13.0360847 64.3868909,13.624155 L36.9228917,30.1570107 Z" id=Path-R></path><path d="M27.3230024,61.7187152 C28.0806889,62.2163638 28.6949153,61.867331 28.6949153,60.9409079 L28.6949153,32.9172027 C28.6949153,31.9899829 28.0815128,30.8363326 27.3229582,30.3392178 L8.20084101,18.2200513 C7.44313,17.7234894 6.82888387,18.0733325 6.82888387,19 L6.82888387,25.0780955 C6.82888387,26.0054111 7.44388156,27.1596973 8.20074441,27.6551037 L19.6635758,35.1581276 C20.4212334,35.6540543 21.0354363,36.8070664 21.0354363,37.7348423 L21.0354363,46.3826029 C21.0354363,47.3097564 20.4207036,47.6570559 19.6634144,47.1589902 L9.83855784,40.6972254 C9.08081105,40.1988587 8.46653589,39.0436625 8.46653589,38.1156283 L8.46653589,35.8391293 C8.46653589,34.9117192 7.85111984,33.7564337 7.09568006,33.2611618 L1.42170329,29.5412614 C0.664600521,29.0448992 0.0508474576,29.3944955 0.0508474576,30.3196077 L0.0508474576,42.1292716 C0.0508474576,43.0555025 0.66570536,44.2101998 1.4227603,44.7074336 L27.3230024,61.7187152 Z" id=Path-J></path><path d="M63.3709553,4.33927093 C64.1426022,4.80675909 64.1419793,5.56069084 63.3685159,6.02385206 L33.1651367,24.1100797 C32.3921424,24.57296 31.1409269,24.5688811 30.3698811,24.1006127 L0.62047173,6.0333191 C-0.150311133,5.56521029 -0.137165494,4.82884693 0.649598241,4.388737 L7.43836561,0.591149698 C8.2252346,0.150980884 9.4875793,0.172369446 10.2591467,0.639682688 L30.3694782,12.8198551 C31.1404835,13.286828 32.3938585,13.2917914 33.1695133,12.8306178 L54.0818319,0.396983385 C54.8572432,-0.064045422 56.111102,-0.0589785552 56.8830287,0.408679101 L63.3709553,4.33927093 Z" id=Path-V></path></g></svg></div><h1 class="text-left font-normal mb-4 text-4xl"><span class="block text-2xl mb-4 text-indigo-theme-dark">Hi, my name is</span> Javier Ruiz Vázquez</h1><p class="text-justify sm:text-left text-grey font-light mb-4 text-2xl">Welcome to my site, here you're gonna find some things I love to do, I'm Frontend developer and Javascript lover, I like to try new technologies for development projects and find the best practices of design and development.<div class="sm:hidden flex justify-center content-center flex-wrap"><div class="px-4 py-2 m-2"><i class="fab fa-html5"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-css3-alt"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-js-square"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-angular"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-react"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-node-js"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-docker"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-git"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-gulp"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-npm"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-sass"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-php"></i></div></div><div class="text-center sm:text-left mt-4 sm:mt-8"><a href=images/cv/javier_ruiz_vazquez_en.pdf target=_blank class="no-underline text-white font-normal py-3 px-8 rounded-full btn-gradient-brand">Download Full CV</a></div></div><div class="w-full sm:w-2/5 hidden sm:block text-2xl md:text-3xl lg:text-5xl"><div class="flex content-center justify-center flex-wrap"><div class="px-4 py-2 m-2"><i class="fab fa-html5"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-css3-alt"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-js-square"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-angular"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-react"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-node-js"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-docker"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-git"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-gulp"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-npm"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-sass"></i></div><div class="px-4 py-2 m-2"><i class="fab fa-php"></i></div></div></div></section><section id=about class="relative flex flex-col justify-center min-h-screen bg-indigo-theme-lighter"><div class="hidden sm:block absolute pin-t pin-r"><img class="w-48 md:w-64 -mt-8 -mr-8 md:-ml-8" src=images/decoration3.png alt="Decoration Right"></div><div class="inverse hidden sm:block absolute pin-t pin-l"><img class="w-48 md:w-64 -mt-8 -mr-8 md:-ml-8" src=images/decoration3.png alt="Decoration Left"></div><div class="absolute pin-b pin-r"><img class="w-32 sm:w-48" src=images/decoration4.png alt="Decoration Bottom"></div><div class="inverse absolute pin-b pin-l"><img class="w-32 sm:w-48" src=images/decoration4.png alt="Decoration Bottom"></div><div class="self-center w-full p-8 sm:p-0 text-center m-0 sm:w-auto"><img class="w-32 mt-0 sm:-mt-8" src=images/decoration2.png alt="Decoration Center"></div><div class="self-center w-full md:w-2/3 p-8 pb-0 pt-0 sm:pt-8 text-center"><h2 class="text-left sm:text-center font-normal mb-4 text-4xl">Nice to meet you</h2><p class="text-justify sm:text-center text-grey font-light mb-4 text-2xl">My name is Javier Ruiz Vázquez. I’m a Mexican javascript developer, from Guanajuato, Mex. fascinated by technology innovations, my toolbox is filled with acronyms like OOCSS, DevOps, FullStack, etc. I love to improve in new web technologies to create new awesome websites and projects. I started developing things about 5 years ago.<p class="text-left sm:text-center text-grey font-light mb-8 text-2xl">I love to explore and interact with people using it.</div><div class="self-center w-full md:w-2/3 p-8 pt-0 pb-8 text-center"><div class="align-bottom inline-block pt-0 p-2 sm:p-4 sm:pt-0 pb-0"><svg class="stroke-current text-center text-indigo-theme-dark w-16 md:w-24 lg:w-32" viewBox="0 0 109 96" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><desc>Desktop.</desc><defs></defs><g id=Desktop stroke-width=1.2 fill=none><rect id=Rectangle-5 x=0.6 y=0.6 width=107.458784 height=72.4240602 rx=2.16000009></rect><ellipse id=Oval-6 cx=5.39695946 cy=5.41353383 rx=1.79898649 ry=1.80451128></ellipse><ellipse id=Oval-7 cx=12.5929054 cy=5.41353383 rx=1.79898649 ry=1.80451128></ellipse><ellipse id=Oval-8 cx=19.7888514 cy=5.41353383 rx=1.79898649 ry=1.80451128></ellipse><path d="M53.6,73.6240602 L53.6,95.2781955" id=Line-3 stroke-linecap=square></path><path d="M40.2972973,94.6 L69.0810811,94.6" id=Line-4 stroke-linecap=square></path></g></svg></div><div class="align-bottom inline-block pt-0 p-2 sm:p-4 sm:pt-0 pb-0"><svg class="stroke-current text-center text-indigo-theme-dark w-16 md:w-24 lg:w-32" viewBox="0 0 124 75" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><desc>Laptop.</desc><defs></defs><g id=Laptop stroke-width=1.2 fill=none><path d="M115.25473,69.4150376 L115.25473,2.16000009 C115.25473,1.29843583 114.556294,0.6 113.69473,0.6 L9.35594603,0.6 C8.49438177,0.6 7.79594595,1.29843583 7.79594595,2.16000009 L7.79594595,69.4150376 L115.25473,69.4150376 Z" id=Rectangle-6></path><path d="M122.450676,73.7458647 L122.450676,71.4532332 C122.450676,70.5916689 121.75224,69.8932331 120.890676,69.8932331 L2.16000009,69.8932331 C1.29843583,69.8932331 0.6,70.5916689 0.6,71.4532332 L0.6,73.7458647 L122.450676,73.7458647 Z" id=Rectangle-7 transform="translate(61.525338, 71.819549) rotate(-180.000000) translate(-61.525338, -71.819549)"></path><ellipse id=Oval-11 cx=12.5929054 cy=5.41353383 rx=1.79898649 ry=1.80451128></ellipse><ellipse id=Oval-9 cx=19.7888514 cy=5.41353383 rx=1.79898649 ry=1.80451128></ellipse><ellipse id=Oval-10 cx=26.9847973 cy=5.41353383 rx=1.79898649 ry=1.80451128></ellipse></g></svg></div><div class="align-bottom inline-block pt-0 p-2 sm:p-4 sm:pt-0 pb-0"><svg class="stroke-current text-center text-indigo-theme-dark w-8 md:w-12 lg:w-16" viewBox="0 0 59 86" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><desc>Tablet.</desc><defs></defs><g id=Tablet stroke-width=1.2 fill=none><ellipse id=Oval-2 cx=29.9984692 cy=79.0046066 rx=1.99846917 ry=2.00460659></ellipse><rect id=Rectangle-3 x=0.6 y=0.6 width=57.8 height=84.2661654 rx=2.16000009></rect></g></svg></div><div class="align-bottom inline-block pt-0 p-2 sm:p-4 sm:pt-0 pb-0"><svg class="stroke-current text-center text-indigo-theme-dark w-4 md:w-6 lg:w-8" viewBox="0 0 31 49" version=1.1 xmlns=http://www.w3.org/2000/svg xmlns:xlink=http://www.w3.org/1999/xlink><desc>Mobile.</desc><defs></defs><g id=Mobile stroke-width=1.2 fill=none><ellipse id=Oval-1 cx=15.4712838 cy=42.2255639 rx=1.79898649 ry=1.80451128></ellipse><rect id=Rectangle-1 x=0.6 y=0.6 width=29.022973 height=47.1609023 rx=2.16000009></rect></g></svg></div></div></section><section id=skills class="flex justify-between items-center min-h-screen flex-wrap-reverse"><div class="w-full sm:w-1/2 p-8 pt-0 sm:pt-8"><h2 class="text-left font-normal mb-4 text-4xl"><span class="block text-xl mb-4 text-indigo-theme-dark">What I Do</span> Websites & Web Apps</h2><p class="text-justify sm:text-left text-grey font-light mb-8 text-2xl">You have some project in mind, and you need to attract new clients, or simply improve your website, I can help you, with SEO, SEM, UI / UX and development that can be of help for your brand or business.<h3 class="font-normal text-xl mb-8 text-indigo-theme-dark">Skills</h3><div class="w-full rounded shadow-md mb-8 p-4"><h4 class=font-normal>UI/UX Design</h4></div><div class="w-full rounded shadow-md mb-8 p-4"><h4 class=font-normal>Prototyping</h4></div><div class="w-full rounded shadow-md p-4"><h4 class=font-normal>Fullstack Development</h4></div></div><div class="w-full sm:w-1/2 p-8 pr-0"><div class="text-right w-full m-auto"><img class="w-full max-w-sm" src=images/laptop.png alt="Web Apps"></div></div></section><section class="flex justify-between items-center flex-wrap min-h-screen"><div class="w-full sm:w-1/2 p-8 pb-0 sm:pb-8"><div class="text-center w-full m-auto"><img class="w-full max-w-sm" src=images/phone.png alt=Apps></div></div><div class="w-full sm:w-1/2 p-8 pt-0 sm:pt-8"><h2 class="text-left font-normal mb-4 text-4xl"><span class="block text-xl mb-4 text-indigo-theme-dark">What I Do</span> Mobile Apps</h2><p class="text-justify sm:text-left text-grey font-light mb-8 text-2xl">You plan to grow your business and reach different web platforms, I help you create your next application. I can help you start your project in a very fast and scalable way.<h3 class="font-normal text-xl mb-8 text-indigo-theme-dark">Skills</h3><div class="w-full rounded shadow-md mb-8 p-4"><h4 class=font-normal>UI/UX Design</h4></div><div class="w-full rounded shadow-md mb-8 p-4"><h4 class=font-normal>Prototyping</h4></div><div class="w-full rounded shadow-md p-4"><h4 class=font-normal>Fullstack Development</h4></div></div></section><section id=projects class="relative flex content-center flex-wrap bg-indigo-theme-lighter min-h-screen"><div class="hidden md:block absolute pin-t pin-r"><img class="w-64 -mt-8 -ml-0 md:-ml-8" src=images/decoration3.png alt="Decoration Right"></div><div class="w-full text-left p-8 pb-0"><h2 class="text-left font-normal mb-4 text-4xl"><span class="block text-xl mb-4 text-indigo-theme-dark">Work Experience</span> My Work Experience</h2><p class="text-justify sm:text-left text-grey font-light text-2xl">In this section you going to find all my curriculum experience and some works that i have been did.<div class="border border-grey-theme-light mb-8 mt-8"></div></div><div class="w-full text-left p-8 pt-0"><div class="flex flex-col flex-wrap md:flex-row"><div class="flex w-full md:pr-4 md:w-1/3 mb-8"><div class="self-start flex text-right text-2xl mr-2">01</div><div class="flex-1 text-left"><h3 class="font-normal text-indigo-theme-dark mb-2">Mathematical Research Center - CIMAT, Gto. MX</h3><p class="font-normal text-grey mb-2">Implementation for web sites for automation of administrative processes, implementation of a plan for preventive and corrective maintenance to reduce the number of data loss incidents and spare parts for PCs.<p class="font-normal text-grey-theme-light">Jan’10 - Sep’13</div></div><div class="flex w-full md:pr-4 md:w-1/3 mb-8"><div class="self-start flex text-right text-2xl mr-2">02</div><div class="flex-1 text-left"><h3 class="font-normal text-indigo-theme-dark mb-2">CODE Guanajuato, Gto. MX</h3><p class="font-normal text-grey mb-2">Update of the website of CODE Guanajuato. Realization of Administrative tasks and Technical Support.<p class="font-normal text-grey-theme-light">Jan’11 - Jul’11</div></div><div class="flex w-full md:pr-4 md:w-1/3 mb-8"><div class="self-start flex text-right text-2xl mr-2">03</div><div class="flex-1 text-left"><h3 class="font-normal text-indigo-theme-dark mb-2">CodioTechnologies, León, Gto. MX</h3><p class="font-normal text-grey mb-2">Planning and structuring of educational platform to improve student learning using new technologies to help teaching methodologies.<p class="font-normal text-grey-theme-light">Sep’13 - Mar’15</div></div><div class="flex w-full md:pr-4 md:w-1/3 mb-8"><div class="self-start flex text-right text-2xl mr-2">04</div><div class="flex-1 text-left"><h3 class="font-normal text-indigo-theme-dark mb-2">Am Digital, León, Gto. MX</h3><p class="font-normal text-grey mb-2">Planning and structuring of projects, development all projects from the newspaper company and from external clients.<p class="font-normal text-grey-theme-light">Mar’15 - Mar’16</div></div><div class="flex w-full md:pr-4 md:w-1/3 mb-8"><div class="self-start flex text-right text-2xl mr-2">05</div><div class="flex-1 text-left"><h3 class="font-normal text-indigo-theme-dark mb-2">Signot, Qro. MX</h3><p class="font-normal text-grey mb-2">Notarial Software, development manager frontend, using AngularJs, backend modules development using SailsJs.<p class="font-normal text-grey-theme-light">Mar’16 - Feb’17</div></div><div class="flex w-full md:pr-4 md:w-1/3 mb-8 md:mb-0"><div class="self-start flex text-right text-2xl mr-2">06</div><div class="flex-1 text-left"><h3 class="font-normal text-indigo-theme-dark mb-2">The Skycraper Museum, NY EE.UU.</h3><p class="font-normal text-grey mb-2">Support for unification of data content for the museum, realization of digital maps with timelines.<p class="font-normal text-grey-theme-light">Oct’16 - Jan’17</div></div><div class="flex w-full md:pr-4 md:w-1/3 mb-8 md:mb-0"><div class="self-start flex text-right text-2xl mr-2">07</div><div class="flex-1 text-left"><h3 class="font-normal text-indigo-theme-dark mb-2">MobilePro, Qro. MX</h3><p class="font-normal text-grey mb-2">Fullstack Developer and Project Manager, focused on technological issues.<p class="font-normal text-grey-theme-light">Feb’17 - Today</div></div><div class="flex items-end justify-center md:justify-start w-full md:pl-8 md:pr-4 md:w-2/3"><a href=images/cv/javier_ruiz_vazquez_en.pdf target=_blank class="no-underline btn-download text-indigo-theme-dark font-normal py-3 px-8 rounded-full border border-indigo-theme-dark hover:text-white hover:border-white">Download Full CV</a></div></div></div></section><section class="flex justify-between items-center"><div class="w-fullw p-8 pt-0 sm:pt-8"><h2 class="text-left font-normal mb-4 text-4xl"><span class="block text-xl mb-4 text-indigo-theme-dark">Community</span> Orginizer Of</h2><p class="text-justify sm:text-left text-grey font-light text-2xl">I love to share.<div class="flex flex-wrap justify-around items-center text-center"><div class="w-full md:w-1/2 w-full p-4"><img class=w-auto src=images/GDGGuanajuato.png alt="GDG Guanajuato"><div class=mt-4><a class="no-underline btn-download text-indigo-theme-dark font-normal py-3 px-8 rounded-full border border-indigo-theme-dark hover:text-white hover:border-white" href=https://www.meetup.com/es-ES/GDGGuanajuato/ title="GDG Guanajuato">Join GDG Guanajuato</a></div></div><div class="w-full md:w-1/2 w-full p-4"><img class=w-48 src=images/CrossappsCapital.png alt="CrossApps Capital"><div class=mt-4><a class="no-underline btn-download text-indigo-theme-dark font-normal py-3 px-8 rounded-full border border-indigo-theme-dark hover:text-white hover:border-white" href=https://www.meetup.com/es-ES/Cross-Apps-Capital/ title="CrossApps Capital">Join Cross Apps Capital</a></div></div></div></div></section><section class="flex justify-between items-stretch min-h-screen flex-wrap bg-dark"><div class="w-full lg:w-2/5 pb-0 p-8 lg:pb-8 self-center"><h2 class="text-white text-left font-normal mb-4 text-4xl"><span class="block text-xl mb-4 text-indigo-theme-dark">Work Experience</span> My Lasts Projects</h2><p class="text-justify sm:text-left text-grey font-light mb-8 text-2xl">These are some of my last more important projects. I’m always trying to be as up-to-date as possible.</div><div class="w-full lg:w-3/5 pt-0 p-8 lg:pt-8 self-center"><div class="flex items-center justify-center flex-wrap"><div class="block w-full sm:w-auto sm:flex flex-col content-center flex-wrap"><a id=am href=https://www.am.com.mx alt=https://www.am.com.mx class="works flex flex-wrap content-center text-center bg-indigo-theme-lighter m-auto mt-0 sm:mr-2 sm:mt-8 sm:m-4 rounded-lg sm:rounded-full w-full h-32 sm:w-32 sm:h-32"><div class="w-full p-4 self-center text-center"><img class="m-auto align-middle inline-block w-16" src=images/am.png alt="Periódico Am - Logo"></div></a><a id=iqmas href=http://iqmas.mx/ title=http://iqmas.mx/ class="works flex flex-wrap content-center text-center bg-indigo-theme-lighter m-auto mt-8 sm:mr-2 sm:m-4 rounded-lg sm:rounded-full w-full h-32 sm:w-32 sm:h-32"><div class="w-full p-4 self-center text-center"><img class="m-auto align-middle inline-block w-8" src=images/iqmas.png alt="IQmas - Logo"></div></a></div><div class="block w-full sm:w-auto sm:flex flex-col content-start flex-wrap"><a id=signot href=http://www.signot.com title=http://www.signot.com class="works flex flex-wrap content-center text-center bg-indigo-theme-lighter m-auto mt-8 sm:m-4 rounded-lg sm:rounded-full w-full h-32 sm:w-32 sm:h-32"><div class="w-full p-4 self-center text-center"><img class="m-auto align-middle inline-block w-16" src=images/signot.png alt="Signot - Logo"></div></a><a id=medicospro href=https://medicospro.com title=https://medicospro.com class="works flex flex-wrap content-center text-center bg-indigo-theme-lighter m-auto mt-8 sm:m-4 rounded-lg sm:rounded-full w-full h-32 sm:w-32 sm:h-32"><div class="w-full p-4 self-center text-center"><img class="m-auto align-middle inline-block w-16 sm:w-18" src=images/medicospro.png alt="MedicosPro - Logo"></div></a><a id=directum href=http://www.directumlex.com title=http://www.directumlex.com class="works flex flex-wrap content-center text-center bg-indigo-theme-lighter m-auto mt-8 sm:m-4 rounded-lg sm:rounded-full w-full h-32 sm:w-32 sm:h-32"><div class="w-full p-4 self-center text-center"><img class="m-auto align-middle inline-block w-16" src=images/directum-lex.png alt="Directum Lex | Abogados - Logo"></div></a></div><div class="block w-full sm:w-auto sm:flex flex-col content-start flex-wrap"><a id=esencia href=http://www.directumlex.com title=http://www.directumlex.com class="works flex flex-wrap content-center text-center bg-indigo-theme-lighter m-auto mt-8 sm:ml-2 sm:m-4 rounded-lg sm:rounded-full w-full h-32 sm:w-32 sm:h-32"><div class="w-full p-4 self-center text-center"><img class="m-auto align-middle inline-block w-16 sm:w-18" src=images/esencia_dolorense.png alt="Esencia Dolorense - Logo"></div></a><a id=jarking href=https://www.jarking.com title=https://www.jarking.com class="works flex flex-wrap content-center text-center bg-indigo-theme-lighter m-auto mt-8 sm:ml-2 sm:m-4 rounded-lg sm:rounded-full w-full h-32 sm:w-32 sm:h-32"><div class="w-full p-4 self-center text-center"><img class="m-auto align-middle inline-block w-16" src=images/jarking.png alt="Jarking - Logo"></div></a></div></div></div></section><section id=contact class="relative flex flex-col content-center justify-between min-h-screen"><div class="hidden sm:block absolute pin-t pin-l"><img class="w-24 md:w-48 mt-8" src=images/decoration1.png alt="Decoration Left"></div><div class="inverse hidden sm:block absolute pin-t pin-r"><img class="w-24 md:w-48 mt-8" src=images/decoration1.png alt="Decoration Right"></div><div class="w-full md:w-2/3 p-8 pb-0 text-center m-auto z-10"><h2 class="text-center font-normal mb-4 text-4xl"><span class="block text-xl mb-2 text-indigo-theme-dark">Get in touch</span> Have a cool project in mind?</h2><p class="text-justify sm:text-center text-grey font-light mb-4 text-2xl">If you have a website or mobile app idea in mind or you’re just looking for advice and direction feel free to send me an <a href=# class="no-underline hover:underline text-indigo-theme-dark">email</a> or <a href=# class="no-underline hover:underline text-indigo-theme-dark">call</a> me, or just <a href=# class="no-underline hover:underline text-indigo-theme-dark">tweet</a> me.<p class=mb-4><i class="fab fa-skype"></i> java.rv87<div class="flex justify-center mb-4 flex-wrap"><a class="no-underline text-lg text-indigo-theme-dark text-center p-2 m-2" href=https://github.com/javarv87 title=https://github.com/javarv87><i class="fab fa-github"></i> </a><a class="no-underline text-lg text-indigo-theme-dark text-center p-2 m-2" href=https://medium.com/@_javaruiz title=https://medium.com/@_javaruiz><i class="fab fa-medium-m"></i> </a><a class="no-underline text-lg text-indigo-theme-dark text-center p-2 m-2" href=https://www.linkedin.com/in/javaruiz title=https://www.linkedin.com/in/javaruiz><i class="fab fa-linkedin-in"></i> </a><a class="no-underline text-lg text-indigo-theme-dark text-center p-2 m-2" href=https://www.meetup.com/es-ES/Cross-Apps-Capital/ title=https://www.meetup.com/es-ES/Cross-Apps-Capital/ ><i class="fab fa-meetup"></i> </a><a class="no-underline text-lg text-indigo-theme-dark text-center p-2 m-2" href=https://blog.ng-classroom.com/blog/authors/javaruiz/ title=https://blog.ng-classroom.com/blog/authors/javaruiz/ ><i class="fab fa-angular"></i> </a><a class="no-underline text-lg text-indigo-theme-dark text-center p-2 m-2" href=https://angel.co/javier-ruiz-vazquez title=https://angel.co/javier-ruiz-vazquez><i class="fab fa-angellist"></i> </a><a class="no-underline text-lg text-indigo-theme-dark text-center p-2 m-2" href=https://plus.google.com/u/0/+JavierRuizVázquez title=https://plus.google.com/u/0/+JavierRuizVázquez><i class="fab fa-google-plus-g"></i> </a><a class="no-underline text-lg text-indigo-theme-dark text-center p-2 m-2" href=https://facebook.com/javarv87 title=https://facebook.com/javarv87><i class="fab fa-facebook-f"></i> </a><a class="no-underline text-lg text-indigo-theme-dark text-center p-2 m-2" href=https://twitter.com/@_javaruiz title=https://twitter.com/@_javaruiz><i class="fab fa-twitter"></i></a></div></div><div class="w-full md:w-4/5 p-8 pt-0 m-auto"><h2 class="text-center font-normal mb-8 text-4xl">For the Blog and Other Contirbutions</h2><div class="flex justify-between flex-wrap"><a href=https://blog.ng-classroom.com/blog/tips/typescript-fundamentos/ title="TypeScript fundamentos y ejemplos básicos" class="w-full md:w-1/2 lg:flex-1 text-left p-4 no-underline"><h3 class="font-normal text-indigo-theme-dark mb-2 hover:underline">TypeScript fundamentos y ejemplos básicos</h3><p class="font-normal text-grey mb-2">TypeScript es un lenguaje de programación libre y de código abierto desarrollado por...<p class="font-normal text-grey-theme-light">Jun’2017</p></a><a href=https://blog.ng-classroom.com/blog/news/firestore/ title="Novedades en Cloud Firestore" class="w-full md:w-1/2 lg:flex-1 text-left p-4 no-underline"><h3 class="font-normal text-indigo-theme-dark mb-2 hover:underline">Novedades en Cloud Firestore</h3><p class="font-normal text-grey mb-2">Cloud Firestore Google ha lanzado un nuevo servicio de base de datos dentro de Fi...<p class="font-normal text-grey-theme-light">Oct’2017</p></a><a href=https://medium.com/javascript-comunidad/iniciando-con-git-2cf89439c862 title="Iniciando con Git" class="w-full md:w-1/2 lg:flex-1 text-left p-4 no-underline"><h3 class="font-normal text-indigo-theme-dark mb-2 hover:underline">Iniciando con Git</h3><p class="font-normal text-grey mb-2">Git es un sistema de control de versiones creado por Linus Torvals, pero que es un sistema...<p class="font-normal text-grey-theme-light">Feb’2016</p></a><a href=https://medium.com/javascript-comunidad/cómo-instalar-node-js-y-npm-en-mac-9d80f26fb88d title="Cómo instalar Node.js y NPM en Mac" class="w-full md:w-1/2 lg:flex-1 text-left p-4 no-underline"><h3 class="font-normal text-indigo-theme-dark mb-2 hover:underline">Cómo instalar Node.js y NPM en Mac</h3><p class="font-normal text-grey mb-2">Instalar NodeJs en Mac es muy sencillo, son 2 pequeños pasos a seguir: A continuación...<p class="font-normal text-grey-theme-light">Feb’2016</p></a></div></div><div class="w-full text-center p-8 pt-0 m-auto"><iframe src=https://events.google.com/io/embed style=width:100%;height:550px frameborder=0 allowfullscreen></iframe></div><footer class="w-full p-8 text-center bg-gradient-brand-to-right"><h3 class="font-normal text-sm text-white"><span class=font-semibold>< / ></span> With <i class="fas fa-heart"></i> by <a class="no-underline hover:underline text-white font-semibold" href=https://twitter.com/@_javaruiz title=https://twitter.com/@_javaruiz>@_javaruiz</a> © 2018</h3></footer></section></main><script src=libs/jquery-3.3.1.min.js></script><script src=scripts/main.min.js></script><script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-101745031-1', 'auto');
ga('send', 'pageview');</script><script>window.fbAsyncInit = function () {
FB.init({
appId: '441754666196993',
cookie: true,
xfbml: true,
version: 'v2.12'
});
FB.AppEvents.logPageView();
};
(function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) { return; }
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>