Desarrollador Web Profesional

Conviértete en un profesional en el desarrollo web, y aplica las técnicas que se ocupan en la vida del mundo web.
4.1 (216 ratings) Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
1,715 students enrolled
$45
Take This Course
  • Lectures 162
  • Contents Video: 12 hours
    Other: 5 hours
  • Skill Level All Levels
  • Languages Spanish
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 11/2013 Spanish

Course Description

¿Quieres convertirte en un Front-End Profesional? ¿Te gustaria aprender las nuevas tecnologías que se están utilizando en el desarrollo web?

Entonces este curso es para ti....

En este curso no solo aprenderas las bases del desarrollo web, si no que seras todo un profesional para que puedas aplicar estos conocimientos en empresas y porque no, para tu propio emprendimiento en el mundo web.

What are the requirements?

  • Conocimientos basicos de html5 y css3
  • Un editor de codigo
  • Muchas ganas de aprender y convertirse en un desarrollador profesional

What am I going to get from this course?

  • Crear desarrolladores Front-End
  • Dominar las ultimas tecnologías que los maquetadores están implementando hoy en dia

What is the target audience?

  • Apasionados por las nuevas tecnologias
  • Desarrolladores jr que quieren llevar sus conocimientos a otro nivel
  • Freelances que quieren expandir su arsenal de herramientas en el desarrollo web

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

00:37

Breve descripcion del contenido del curso.

Section 1: Bases de la maquetación
03:33

En este vídeo veremos las partes en las que están compuestas un sitio web.

01:44

En este vídeo veremos como esta estructurado un sitio web para nosotros como maquetadores para tenerlo en cuenta a la hora de realizar proyectos.

02:32

Veremos la diferencia entre div y secciones en html5

Manual básico de html
184 pages
Manual básico de css
13 pages
10:49

En esta primera practica realizaremos un sitio a una columna.

24:29

En esta segunda practica realizaremos un sitio a 2 columnas.

11:33

En esta tercera practica realizaremos un sitio web completo.

07:55

Vamos ahora a estructurar el código del contenido.

05:40

Vamos a darle estructura al pie de la pagina.

09:35

En este vídeo vamos a darle los estilos al sitio.

09:36

En este vídeo vamos a darle los estilos al sitio.

13:24

En este vídeo vamos a darle los estilos al sitio.

Section 2: Maquetación Web Estructurada
01:10

Presentación de lo que vamos a lograr en este modulo "Maquetación Estructurada"

03:48

Vamos a empezar a crear una planificacion del proyecto a realizar.

01:28

En este vídeo veremos las características de este excelente editor de código.

07:52

Vamos a personalizar el editor sublime text para adaptarlo mas a nuestras necesidades.

09:05

Vamos aprender a crear un snippet que nos ayudara a optimizar el tiempo en que hacemos codigo en nuestros proyectos.

02:22

Vamos a instalar el control de paquetes que nos permite instalar multiples paquetes muy utiles para nosotros como desarrolladores.

02:15

Vamos a instalar el plugin emmet, veras que este complemento instalado en tu editor te sera de gran ayuda en tu carrera como maquetador.

07:01

En este vídeo vamos a ver como es la sintaxis de este framework para html5

03:34

Emmet tambien tiene accesos rapidos para crear codigos html

05:34

Ahora veremos como crear codigo facil en css con emmet.

05:13

Vamos a ver algunos atajos de teclados y trucos bien utiles en el editor sublime text.

06:55

En este vídeo vamos a empezar a desarrollar un sitio de manera completa y en esta primera parte vamos aprender a seccionar una plantilla PSD.

03:42

Vamos a continuar creando secciones de la plantilla PSD.

03:24

Vamos a crear las ultimas secciones de la plantilla PSD.

14:07

En este vídeo veremos como recortar y exportar imágenes del PSD con el método que personalmente ocupo que es con la herramienta marco rectangular.

06:14

En este vídeo veremos como recortar y exportar imágenes del PSD con el método de la herramienta sectores.

09:01

Vamos a poner manos al código creando la estructura de la cabecera del sitio.

10:49

Vamos a seguir estructurando ahora con el contenido y el pie de pagina.

14:51

Vamos a empezar a darle estilos CSS a la cabecera.

13:11

Seguimos dando estilos CSS ahora al contenido y pie de pagina.

Section 3: jQuery
01:38

Veremos que es y que podemos hacer con jQuery.

01:41

Vamos a descargar jQuery de su pagina oficial.

01:14

Vamos aprender a vincular jQuery en nuestros proyectos.

01:17

Veremos como importar archivos JS.

05:05

Veremos como seleccion un elemento ID de html con jQuery.

01:52

Ya que aprendimos a agregar una propiedad css, veremos ahora como añadir mas de una propiedad.

04:38

Veremos como seleccionar un elemento clase de html con jQuery.

03:09

Veremos como añadirle propiedades a una etiqueta html.

03:46

Vamos aprender a seleccionar elementos html con atributos con jQuery.

04:10

Veremos como con jQuery podemos seleccionar mas de un elemento html.

07:42

En este vídeo vamos aprender a añadir y quitar clases css con jQuery

03:06

Vamos aprender como crear codigo html desde jQuery.

03:55

Veremos en este video el evento mouseOver y mouseOut de jQuery.

01:14

Veremos en este vídeo el evento hover de jQuery.

03:14

Veremos en este video el evento mouseMove de jQuery.

03:35

Veremos en este vídeo el evento mouseUp y mouseDown de jQuery.

03:46

Veremos en este vídeo el evento focus de jQuery.

02:09

Veremos en este vídeo el evento blur de jQuery.

05:08

Veremos en este vídeo el evento hide y show de jQuery.

01:09

Veremos en este vídeo el evento fade in y fade out de jQuery.

01:54

Veremos en este vídeo el evento fade to de jQuery.

01:40

Veremos en este vídeo el evento toggle de jQuery.

02:28

Veremos en este vídeo el evento slide de jQuery.

04:44

Veremos en este vídeo el evento animate de jQuery.

Section 4: jQuery UI
00:46

En este video veremos que jQuery UI y que podemos hacer con esta extension de jQuery.

00:27

Vamos a descargar de la pagina oficial el framework jQuery UI.

01:22

Veremos que tambien podemos elegir los componentes de jQuery UI y personalizarla a nuestro gusto.

00:46

Vamos a preparar los archivos necesarios de jQuery UI

04:35

En este vídeo veremos el método draggable de jQuery UI

04:44

En este vídeo veremos el método droppable de jQuery UI.

02:01

En este vídeo veremos el método resizable de jQuery UI

03:02

En este vídeo veremos el método selectable de jQuery UI

00:50

En este vídeo veremos el método sortable de jQuery UI

01:31

En este vídeo veremos el método acordeon de jQuery UI

02:43

En este vídeo veremos el método autocomplete de jQuery UI

01:35

En este vídeo veremos el método botones de jQuery UI

01:35

En este vídeo veremos el método calendar de jQuery UI

01:18

En este vídeo veremos el método dialog de jQuery UI

01:27

En este vídeo veremos el método progress bar de jQuery UI

00:54

En este vídeo veremos el método slider de jQuery UI

02:40

En este vídeo veremos el método tabs de jQuery UI

Section 5: Framework 960 Grid System
01:14

En este video vamos a ver que es un framework de css y que podemos hacer con el.

02:37

Vamos a ver las ventajas y desventajas de usar un framework y saca tus propias conclusiones en que momento usarlo y en que momento no.

01:01

Vamos a ver algunos frameworks que se estan ocupando en la actualidad para que investigues mas sobre ellos a detalle.

04:07

Vamos a ver en detalle que es el framework 960 system.

01:40

Vamos aprender los fundamentos basicos de usar este framework css

00:55

En este video veremos como se compone una grilla de 12 columnas con 960GS

01:35

Veremos que tenemos un sistema donde podemos crear una version fluido del framework 960GS

03:06

Vamos a empezar a conocer el flujo de trabajo de este framework.

03:31

Vamos a empezar a usar el sistema 960gs de manera muy practica y basica.

11:26

Comenzamos con un proyecto completo que realizaremos usando el framework 960, comenzaremos primero seccionando la plantilla PSD del proyecto.

07:12

Vamos a recortar y exportar las imágenes del PSD.

07:48

Vamos a continuar con los cortes y exportacion de la plantilla PSD.

09:58

Vamos a poner manos en el codigo creando la estructura html de la cabecera del sitio.

04:14

Vamos ahora a estructurar el contenido del sitio.

07:00

Terminamos de estructurar el pie de la pagina.

09:29

Ahora pasamos con los estilos css de la plantilla.

10:21

Seguimos dando los estilos css de la plantilla.

08:59

Vamos a terminar dando estilos a la pagina.

Section 6: Bootstrap
01:38

En este vídeo veremos que es bootstrap.

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Klinsmann Fabian, Desarrollador web y Ninja Front-End

Estudio la Licenciatura de Marketing y Neuro Marketing Digitales, apasionado por las ultimas tecnologías, llevo mas de 3 años en esto del desarrollo web, especificamente en tecnologias HTML5, CSS3, jQuery, Responsive design y todo lo que tiene que ver en la web.

Actualmente trabajo de manera Freelance como Ninja Front-End creando sitios web, sitios adaptables para dispositivos móviles, tabletas y pantallas.

Soy instructor de manera independiente en diferentes áreas como computación para adultos, desarrollo web, Marketing y Neuro Marketing Digital.

Desarrollo videotutoriales en youtube sobre contenido de diseño, programación y marketing.

Te invito que visites mi pagina donde publico constantemente información sobre los últimos sucesos del mundo web, asi como también te invito que me sigas en mis redes sociales si quieres saber mas sobre lo que publico.

Ready to start learning?
Take This Course