Desarrollo web - Victor Robles

Jun10

Master en CSS3 Avanzado: Maquetación web de 3 sitios web profesionales

Publicado por Victor a Jun 10, 2023

Master en CSS3 Avanzado: Maquetación web de 3 sitios web profesionales

¡Entra al master completo pinchando aquí! Bienvenido al Máster en CSS3 Avanzado, en el que aprenderemos todo lo necesario para dominar HTML5, CSS, CSS3, Maquetación web, Responsive, Flexbox y CSS Grid Layout a nivel experto maquetando 3 sitios web impresionantes con las tecnologías de front-end más importantes orientadas al diseño web, con más demanda laboral y más proyección de futuro. Este no es un curso normal, estás ante un máster completo de decenas de horas de contenido único y exclusivo, y posiblemente el curso avanzado de CSS más completo que existe en internet hasta la fecha. Maquetaremos tres sitios web profesionales basándonos en un diseño previo: Portafolio profesional Web de noticias de videojuegos Web de Agencia de diseño y desarrollo Y en estos proyectos trabajaremos con estas tecnologías: HTML5 avanzado, el lenguaje de marcado imprescindible en cualquier web. CSS avanzado, el lenguaje que nos permitirá darle estilos y aplicar un diseño a nuestras webs. CSS3, enseñando las últimas novedades y los increíbles efectos para las páginas web. BEM, la mejor metodología para CSS. Animaciones avanzadas, creando espectaculares efectos visuales. Flexbox, el nuevo modelo de maquetación web basado en elementos flexibles. CSS Grid Layout, un nuevo modelo de maquetación de CSS para estructurar tus webs. Responsive web design, haciendo que cualquier web se adapte a cualquier dispositivo móvil o pantalla. JavaScript, aplicado a elementos esteticos y a diseño adaptable. Maquetación web profesional, desarrollando varios proyectos web con HTML 5 y CSS3 paso a paso. Habilidades de front-end experto, haciendo cientos de ejercicios, prácticas y varios proyectos completos. Si quieres ser desarrollador front-end o full-stack, o incluso si ya te dedicas al desarrollo web, aprender a trabajar con estos lenguajes, técnicas y modelos de maquetación muy importante y te abrirá un nuevo mundo de posibilidades. La metodología de aprendizaje es la ideal: Todo explicado desde cero, paso a paso y explicado al detalle. Decenas de horas de contenido en clases en vídeo (y subiendo). Cientos de prácticas. Más de 114 clases bien explicadas (y subiendo). Varios proyectos poniendo en práctica todo lo aprendido. Orden lógico y progresivo, diseñado para interiorizar todos los conocimientos. Además te estaré ayudando cuando tengas cualquier duda o problema. ¡Entra al Máster en CSS Avanzado pinchando aquí! Al finalizar el curso: Sabrás pasar cualquier diseño web profesional a una web real. Sabrás crear sitios web estáticos. Dominarás...

Abr18

Master en React: Aprender ReactJS, Hooks, MERN, JWT+

Publicado por Victor a Abr 18, 2022

Master en React: Aprender ReactJS, Hooks, MERN, JWT+

¡Entra al máster completo pinchando aquí! Bienvenido al Máster en React, en el que aprenderemos todo lo necesario para dominar la librería para JavaScript más popular que existe actualmente y desarrollaremos varias aplicaciones web completas con el MERN Stack, el conjunto de tecnologías con más demanda laboral y más proyección de futuro. Este no es un curso cualquiera, estás ante un máster completo en el que aprenderemos: React desde cero, el framework creado por Facebook para JavaScript para desarrollar aplicaciones web SPA, dinámicas, modernas y escalables. Componentes funcionales, olvídate de las clases y descubre la nueva forma de trabajar con React. Hooks, los conocerás todos y aprenderás a crear hooks personalizados. Router, para crear rutas, páginas y navegación SPA entre ellas. Context API, para compartir información entre componentes. NodeJS, tecnología que nos permite hacer desarrollos back-end usando únicamente JavaScript. ExpressJS, framework para desarrollo de APIs RESTful. MongoDB, la base de datos NoSQL lider. MERN Stack, desarrollo web completo con el stack más potente. JavaScript, detalles y nuevas funcionalidades propias de JS. React 18, verás las novedades más relevantes de la última versión de React. Maquetación web, creando varios proyectos web. Proyectos con React paso a paso, una web de películas, un portafolio, un blog, una red social, entre otros. Desarrollar una red social con React JS, con autenticación JWT, sistema de publicaciones, comentarios, seguimiento entre usuarios, mensajes privados, y mucho más. Habilidades full-stack, haciendo cientos de ejercicios y varios proyectos. Si quieres ser desarrollador front-end, back-end o full-stack, o incluso si ya te dedicas al desarrollo web, aprender a trabajar con ReactJS es muy importante. La metodología de aprendizaje es la ideal: Todo explicado desde cero y paso a paso. Decenas de horas de contenido en clases en vídeo. Cientos de prácticas y ejercicios. Más de 130 clases bien explicadas. Varios proyectos poniendo en práctica todo lo aprendido. Orden lógico y progresivo, diseñado para interiorizar todos los conocimientos tanto si conoces otros frameworks como si no. Además te estaré ayudando cuando tengas cualquier duda o problema. ¡Accede al master en React con Hooks y MERN pinchando aquí! Al finalizar el curso: Sabrás desarrollo web con React Moderno. Serás capaz de desarrollar tus propias aplicaciones web SPA (Single Page Apps) con React y modificar otras que ya estén programadas con este framework. Tendrás conocimientos para programar también con otros frameworks...

Inicio » Desarrollo web

May13

Iframe de videos de YouTube Responsive

Hoy vamos a aprender a cargar los Iframe de vídeos de YouTube Responsive. Para conseguir que los vídeos que empotramos en nuestras páginas web sean responsive, debemos crear estas reglas css: .video-container { position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden; } .video-container iframe, .video-container object, .video-container embed { position:absolute; top:0; left:0; width:100%; height:100%; } Y por ultimo utilizar la clase video-container en el div que contenga el iframe. Ejemplo: <div class="video-container">...

May06

Two way databinding y reactividad en VueJS 2

Hoy vamos a aprender a utilizar el Two way databinding y la reactividad en VueJS 2. El Two way data binding o enlace de datos bidireccional nos permite modificar el valor de una propiedad del modelo de datos de forma dinamica y reactiva cuando se produce un cambio en la vista o en el modelo de datos y el cambio se refleja en ambas partes. He grabado una clase...

Abr23

Cabeceras HTTP en PHP para permitir el acceso CORS

Cabeceras HTTP en PHP para permitir el acceso CORS con Apache o con otro servidor web. En este caso te pongo las cabeceras configuradas en PHP para que puedas utilizarlo en los desarrollos de tus APIs REST o cualquier proyecto que tengas: header('Access-Control-Allow-Origin: *'); header("Access-Control-Allow-Headers: X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Request-Method"); header("Access-Control-Allow-Methods: GET, POST, OPTIONS, PUT, DELETE"); header("Allow: GET, POST, OPTIONS, PUT, DELETE"); $method = $_SERVER['REQUEST_METHOD']; if($method == "OPTIONS")...

Abr22

Hacer un hola mundo con VueJS 2

Vamos a aprender a incluir VueJS 2 en una página web y como hacer un hola mundo con VueJS 2. Lo primero que tenemos que hacer es crear un fichero de JavaScript y definir una instancia de Vue que es la que va a controlar la interacción con el DOM etc. Creamos el fichero main.js, creamos el objeto Vue, en la propiedad «el» definimos el nombre del elemento principal...

Abr15

Quitar comillas dobles de un string en JavaScript

Hoy vamos a ver como quitar las comillas dobles de un string en JavaScript. Usaremos la función repace de JavaScript. Veamos un ejemplo: var cadena = 'Hola "bienvenido a victorroblesweb.es" de Víctor Robles'; console.log(cadena.replace(/['"]+/g, '')); De esta forma podemos eliminar las comillas dobles de un string en JavaScript. ¿Quieres más? Curso Online Desarrollo web con JavaScript, Angular, NodeJS y...

Abr12

Curso de Angular 4

¡Accede al curso pinchando aquí! Bienvenido al curso de Angular 4, vas a aprender paso a paso como desarrollar aplicaciones web font-end con la nueva versión de este framework de Google. Angular 4 es el framework para JavaScript estándar para crear webs SPA. Es uno de los frameworks más populares para desarrollar aplicaciones modernas y escalables en el lado del cliente. Si quieres ser desarrollador front-end o full-stack, o incluso si ya te dedicas al desarrollo...

Abr08

Instalar VueJS 2 con Vue CLI

Hoy vamos a aprender como instalar VueJS 2 con Vue CLI. Vue CLI es una herramienta para hacer scaffolding (generar estructura básica) simple en proyectos de Vue.js Para instalar Vue.js 2 con Vue CLi tenemos que seguir los siguientes pasos. Paso 1. Tener instalado y actualizado NodeJS, puedes conseguirlo aquí https://nodejs.org/es/download/ Paso 2. Lazar el siguiente comando para instalar Vue Cli de forma global en nuestro sistema: npm install...

Abr01

Evento AfterPaste(despues de pegar) en CkEditor

Hoy vamos a ver como usar el evento AfterPaste de CkEditor. El evento AfterPaste nos permite lanzar una función justo de después de pegar un texto en un textarea con Ckeditor. Puedes ver un ejemplo de su uso aquí: editor.on('afterPaste', function (event) { // Lo que quieras hacer }); Esto seria todo para usar el evento AfterPaste(después de pegar) en CkEditor. ¿Quieres más? Curso online Aprende PHP desde cero...

Mar28

Instalar Angular 4 paso a paso

Hoy vamos a instalar Angular 4 paso a paso y desde cero. Angular 4 es la nueva versión de Angular 2, que incluye una mejora importante a nivel interno, aunque no trae muchos cambios a la hora de programar con el framework. Veamos como instalar Angular 4. Paso 0. Instalar la última versión de NodeJS desde aquí https://nodejs.org/es/download/ Paso 1. Descargar el quickstart de Angular desde su repositorio https://github.com/angular/quickstart...

Mar25

Generar bundles en Symfony3

Los bundles en Symfony3 son módulos o paquetes que nos permiten dividir nuestra aplicación en varias partes reutilizables. De forma que si tenemos una tienda online que además tiene un foro y un blog, podríamos tener un bundle para la tienda, otro para el foro y otro para el blog dentro del mismo proyecto de Symfony. Crear más o menos bundles depende de cada uno. En Symfony3 toda nuestra...

Mar18

Crear un controlador base en Symfony3

Hoy vamos a ver como crear un controlador base en Symfony3 para las tareas de sesiones, conseguir el entity manager, entre otras cosas y de esta forma evitar la repetición de algunos bloques de código. Para crear este controlador base en Symfony3, crearemos un fichero Base.php dentro la carpeta de controladores de nuestro Bundle. <?php namespace AppBundle\Controller; use Symfony\Bundle\FrameworkBundle\Controller\Controller; use Symfony\Component\HttpFoundation\Session\Session; class Base extends Controller { protected $_session; protected...

Mar11

Curso de VueJS 2

Accede al curso pinchando aquí. Bienvenido al curso de VueJS 2, vas a aprender paso a paso como desarrollar aplicaciones web front-end con la potente y ligero framework JavaScript. Vue.js 2 se está abriendo hueco en el mercado de los framework para JavaScript y está siendo muy utilizado por las empresas de desarrollo. Es uno de los frameworks más populares para desarrollar aplicaciones modernas y escalables en el lado del cliente. Si quieres ser desarrollador front-end o full-stack,...