< fRONTEND moderno />
< 2019 />
<Introducción al desarrollo web />
<Enfoque actual del desarrollo web />
<Era JavaScript del desarrollo web >
<???? />
<React JS />
<Proyectos destacados />
<Frameworks JS modernos />
<Era JavaScript del desarrollo web />
<Era posmoderna del desarrollo web />
< Introducción al desarrollo web />
< Standard languages />
< BAsic tools />
< HTML5 apis />
< Geolocation />
< Canvas />
< Drag and Drop />
< Web Workers />
api => {
console.log("Application Program Interface");
// Interfaz de Programación de Aplicaciones
}
< Canvas />
< DRAG and drop />
< WEB workers />
< geolocation />
< Compatibilidad />
<script src="modernizr-custom.js"></script>
if (Modernizr.geolocation) {
//código a ejecutar si la expresión en 'true' porque ha detectado la funcionalidad en el navegador
}
else
{
//acción o mensaje si no está soportada la geolocalización
}
< css frameworks />
< Javascript />
- Ajax
- Manipulación del DOM
- Emascript 6+
< enfoque actual del DEsarrollo WEb />
< cAPas de una aplicación web />
< Standard languages />
< ERa javascript del desarrollo web />
< ????? />
27 de Mayo 2009
2008
</ framework's war />
< React />
- Librería
- By Facebook
- Aprendizaje ( 4 a 5 semanas)
- ES 6
- JSX
- FLUX
- DOM Virtual
< angular />
- Framework
- By Google
- Aprendizaje (4 a 8 semanas)
- Typescript
- Templates
- MVC
- DOM Regular
< DOM / Virtual DOM />
DOM
Virtual DOM
Update
DOM => {
console.log("Document Object Model");
//Modelo de Objetos del Documento
}
< JSX />
JSX => {
console.log("JavaScript XML");
}
class ShoppingList extends React.Component {
render() {
return (
<div className="shopping-list">
<h1>Shopping List for {this.props.name}</h1>
<ul>
<li>Instagram</li>
<li>WhatsApp</li>
<li>Oculus</li>
</ul>
</div>
);
}
}< WEb PACK />
< FLUX (Redux) />
Patrón para el manejo de información
< INSTALAción />
npm install -g create-react-app
create-react-app hello-world
cd hello-world
npm start
< react frameworks />
< proyectos destacados />
< ERa postmoderna del desarrollo web />
< https://sketch2code.azurewebsites.net/ />
< Links />
Copy of Introducción al Frontend Moderno
By rusiby Chura
Copy of Introducción al Frontend Moderno
El desarrollo frontend moderno ha cambiado gracias a nuevas herramientas y lenguajes que han evolucionado y mejorado la forma en que desplegamos y creamos aplicaciones web. Entender el funcionamiento, la evolución e historia que nos han llevado al punto que vivimos hoy, no solo es fundamental sino necesario para cualquier desarrollador de esta era.
