Este reto es algo que comenzó como sarcasmo y se transformo en real, sobre todo que podemos hacer algo distinto en cuanto a la enseñanza de los conceptos que debería aprender un desarrollador frontend.
Si este tweet llega a 1k hago un reto de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) June 24, 2021
Mi nombres es Héctor de León, un programador más afín al backend, y el reto me llevara a salir de mi zona de confort en cuanto a desarrollo y a su vez enseñar con el conocimiento adquirido.
En esta entrada de este blog iré recopilando todo el camino que iré siguiendo y en mi cuenta de Twitter iré escribiendo todos los días lo aprendido por 100 días con el hashtag #100DaysAsAFrontendDev.
A su vez en mi canal de youtube iré lanzando un video semanal orientado al frontend donde resumiré lo que he aprendido en un video que espero igual, el video explique a las personas que lo vean algunos conceptos del frontend.
Podrás ir viendo el código utilizado en este repositorio: https://github.com/powerhdeleon/100DaysAsAFrontendDev
El reto de 100 días comienza el día 19 de Julio y termina el día 27 de Octubre del año 2021.
Me enfocare en tecnologías que van desde CSS, javascript avanzado y para que sea mucho más reto para mi, me adentrare a React.
Semana 1
Día 1 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 20, 2021
Me he puesto a analizar tags y atributos de html que no conocía, entre ellos el atributo rel.
Ref: https://t.co/5Tzq8QryKF
Día 2 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 21, 2021
Hoy me he enfrascado en las nuevas características de #javascript que llegaron con ECMAScript2021 sobresaliendo Promise.any que es lo contrario a Promise.all
Ref: https://t.co/FHM4gauw8M
Día 3 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 22, 2021
Hoy me he pasado leyendo sobre los operadores creaciones de @ReactiveX sobre todo me ha llamado la atención throw y defer
Ref: https://t.co/QOrHyJBwcb
Día 4 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 23, 2021
Hoy me he puesto a ver de fondo forkJoin de @ReactiveX
Ref: https://t.co/oBrvnHUfIW
Día 5 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 24, 2021
Hoy me he metido a recordar algunos conceptos de Object prototype de #javascript
Ref: https://t.co/sO0nYHGyyi
Día 6 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 24, 2021
Me he puesto a aprender a fondo Grid Layout y Flexbox Layout.
Ref: https://t.co/s2w9pj00Qd
Día 7 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 25, 2021
Le he dado una repasada a los selectores y funciones de CSS, desconocía attr()
Ref:
– https://t.co/oaz9Decrmo
– https://t.co/kef53zdQc3
Semana 2
Dia 8 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 27, 2021
Hoy he leído sobre metodología BEM, una propuesta para la escalabilidad y mantenimiento del CSS.
Ref: https://t.co/6T7G4bB0OE
Día 9 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 28, 2021
Hoy me he repasado los observables de RxJS, sobre todo los Subjects.
Ref: https://t.co/jTMP4tVr9y
Día 10 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 29, 2021
Hoy he aprendido de que va el patrón Redux a fondo
Ref: https://t.co/PjhsQko48i
Día 11 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 30, 2021
Hoy me he metido a la noticia del momento a ver que diablos es CSS Nesting
Ref: https://t.co/YJ4TgKKEbJ
Día 12 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 31, 2021
Hoy me he puesto a repasar los códigos de estado de respuesta HTTP.
Ref: https://t.co/BlO0thoK51
Día 13 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) July 31, 2021
Hoy me he puesto a aprender el concepto llamado skeleton de HTML
Red: https://t.co/kNNuoFoXAk
Día 14 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 1, 2021
Hoy me he puesto a crear algunas cosas con los Scheduler de @ReactiveX
Ref: https://t.co/m6wD6h2KtG
Semana 3
Día 15 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 2, 2021
Hoy me he leído un post super valioso de @Carlillo sobre Memoización en #javascript y #typescript
Ref: https://t.co/Fcgst1gnq6
Día 16 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 4, 2021
Hoy me he puesto a leer sobre las reglas condicionales de CSS
Ref: https://t.co/0aKAoxs9yO
Día 17 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 5, 2021
Hoy lo dedique a leer la guía de estilos de javascript, la convención importa bastante.
Ref: https://t.co/ABGDwnqpIK
Día 18 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 6, 2021
Hoy toco turno a custom properties en CSS
Ref: https://t.co/dmEtPDpoFM
Día 19 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 7, 2021
Hoy me he puesto a ver selectores avanzados de CSS
Ref: https://t.co/AINDvVSLfS
Día 20 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 8, 2021
Hoy me he puesto puesto ver algo llamado Sass
Ref: https://t.co/xJpipK9Gi1
Día 21 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 8, 2021
Hoy me he puesto a probar las transiciones de CSS
Ref: https://t.co/sdPK857Uhi
Semana 4
Día 22 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 10, 2021
Hoy me he puesto a modificar con #javascript variables de CSS
Ref: https://t.co/HMPbcdQTx6
Dia 23 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 10, 2021
Me he puesto a repasar los closures en #javascript
Ref: https://t.co/iJWX09UfsF
Día 24 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 12, 2021
Hoy he estado combinando animaciones con keyframes y transform de CSS
Ref: https://t.co/SDJk9ne4bF
Día 25 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 13, 2021
He dado un repaso por los atributos distintos de <script>
Ref: https://t.co/JOMuGTbrM7
Día 26 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 14, 2021
Hoy me he puesto a re-leer generics de #TypeScript
Ref: https://t.co/BpZ8RKFQMe
Día 27 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 14, 2021
Hoy toco programación funcional en #TypeScript
Ref: https://t.co/5JyL6zLL6Q
Día 28 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 16, 2021
Hoy me he puesto a leer sobre los Mapped Types en #typescript
Ref: https://t.co/Q8gupMeCZp
Semana 5
Día 29 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 17, 2021
Hoy toco Union e Intersection types de #TypeScript
Ref: https://t.co/Iv91Ihsyph
Día 30 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 18, 2021
Hoy he leído sobre flexbox de CSS
Ref: https://t.co/7v8qCpabHy
Día 31 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 19, 2021
Hoy he leído sobre mixins class en #typescript
Ref: https://t.co/v6OZvF9Ko3
Día 32 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 20, 2021
Encapsulation en #typescript
Ref: https://t.co/7bbTZHaLLv
Día 33 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 21, 2021
Hoy ha tocado darle un vistazo a #tailwindcss
Ref: https://t.co/IKqwwnKG49
Día 34 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 21, 2021
Hoy toco leer sobre CSS performance optimization
Ref: https://t.co/YArjD4WwRh
Día 35 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 23, 2021
Hoy toco probar grid.js una biblioteca para crear grids con #js
Ref: https://t.co/sqwIoWwxJc
Semana 6
Día 36 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 24, 2021
Hoy me he puesto a leer sobre selectores de CSS a nivel complejo
Ref: https://t.co/2cO2j9l0AV
Día 37 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 25, 2021
Hoy me he puesto a repasar los códigos de estado HTTP
Ref: https://t.co/BlO0thoK51
Día 38 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 26, 2021
Hoy toco repasar Service Workers
Ref: https://t.co/bhwcLmMpa9
Día 39 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 27, 2021
Hoy toco rendimiento Web
Ref: https://t.co/eEjdBa6X4J
Día 40 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 28, 2021
Hoy he aprendido a utilizar Proxy de #javascript
Ref: https://t.co/ZTmFfBesA8
Día 41 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 29, 2021
Mixins CSS
Ref: https://t.co/uyyzg7SwuO
Día 42 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 30, 2021
Hoy me he puesto a leer sobre la herencia en #javascript utilizando la cadena de prototipos
Ref: https://t.co/1UMMqd31vn
Semana 7
Día 43 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) August 31, 2021
Hoy toco Cache de #javascript
Ref: https://t.co/vBdiRwFJfb
Día 44 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 1, 2021
SVG
Ref: https://t.co/bmFzW1gdPW
Día 45 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 2, 2021
Hoy me he puesto a leer sobre seguridad en el frontend
Ref: https://t.co/BEX5Q4yrKr
Día 46 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 3, 2021
Hoy me puse a ver svelte, oh si!
Red: https://t.co/IRYQrnrJg7
Día 47 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 4, 2021
Hoy toco comenzar con introducción a #React https://t.co/Tsf62BkEeg
Día 48 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 5, 2021
Hoy me he puesto a ver el objeto Reflect de #javascript
Ref: https://t.co/1f1fcA43gh
Día 49 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 6, 2021
Hoy me he puesto a ver solicitudes HTTP en react.
Ref: https://t.co/Ms0U7AI5FK
Semana 8
Día 50 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 7, 2021
Principios de diseño de #react
He llegado a la mitad.
Ref: https://t.co/IfI9080eti
Día 51 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 8, 2021
10 consejos de seguridad en #react
Ref: https://t.co/0ci1P15qs7
Día 52 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 9, 2021
Hooks de #react
Ref: https://t.co/fMs8DWDile
Día 53 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 10, 2021
Hoy toco HTML Semantic Elements.
Una vez de HTML por siempre de HTML
Ref: https://t.co/r6YTIyiHVf
Día 54 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 11, 2021
Pseudo clases de CSS
Ref: https://t.co/ejwaNoe9Lb
Día 55 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 12, 2021
Web components
Ref: https://t.co/cnGkvTHfEq
Día 56 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 13, 2021
React y web components
Ref: https://t.co/I4soEehiUq
Semana 9
Día 57 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 14, 2021
<template> de HTML
Ref: https://t.co/1mO69FoB4U
Día 58 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 15, 2021
Shadow DOM
Ref: https://t.co/0YGD42CE3j
Día 59 de #100DaysAsAFrontendDev
— Héctor de León (El loco de los perros) (@powerhdeleon) September 16, 2021
Custom Elements en Web Components
Ref: https://t.co/IZzPbKH4UV