-
Hola y bienvenido a Thimble, el editor basado en la web
-
que hace que sea fácil crear y publicar páginas
-
Empecemos en la página de inicio, donde mezclaremos Keep Calm Poster
-
Mezclar crea mi una copia del proyecto, la que puedo editar y personalizar
-
Aquí tenemos el editor de Thimble con mi copia del póster
-
Démosle un vistazo.
-
En la parte izquierda está el árbol de archivos, el cual muestra todos los archivos del proyecto:
-
página de inicio, hoja de estilo e imágenes, un dedal y una corona.
-
También está el tutorial de HTML, pero lo revisaremos más tarde.
-
Si quiero añadir archivos adicionales, puedo hacerlo apretándo el ícono +.
-
Regresemos a la página de inicio.
-
A medida que hacemos cambios, la vista previa se actualiza automáticamente
-
y dado que creé una cuenta y me conecté, los cambios que hago son guardados.
-
No tengo que preocuparse de perder el trabajo.
-
Thimble te permite aprender mientras programas.
-
Estoy seguro de saber que hace un h1, pero si llego a olvidarlo, aprieto en él, presiono la tecla Comando o Control y recibo más ayuda.
-
Si deseo saber más, puedo seguir este enlace para obtener información adicional.
-
Ahora, cambiemos el color de fondo. Puedo hacerlo en el archivo style.css
-
Aquí tienes un consejo espectacular.
-
Al cambiar el color, aprieta la tecla Comando o Control y aparece un selector de color como este.
-
Púrpura, perfecto.
-
Todo proyecto que incluya un tutorial html 5, como este
-
tendrá un modo de tutorial que puedes acceder en la ventana de vista previa
-
Puedo cambiar entre el tutorial y la vista previa aquí.
-
Este proyecto tiene instrucciones que puedo seguir para aprender sobre HTML y CSS
-
Revisemos el paso número 3.
-
Describe como cambiar la imagen de la corona.
-
Mientras edito el archivo index, el tutorial permanece abierto.
-
Al terminar, puedo regresar a la vista previa para ver el efecto.
-
Ok, luce bien.
-
Me pregunto cómo lucirá en un móvil. Puedo cambiar entre la vista previa de escritorio y móvil aquí.
-
Estoy listo para publicar y compartir mi póster.
-
Pero antes de hacerlo quiero darle un nombre diferente
-
Ok
-
Ahora aprieto el botón Publicar y queda disponible en la web.
-
Puedo compartir este enlace con mis amigos y familiares
-
Démosle un vistazo.
-
Aquí está el proyecto terminado. Puedes ver que en la parte superior hay un botón para mezclar.
-
Esto me permite, o a cualquiera, crear otra versión del póster.
-
Y esto concluye el tutorial. Gracias por ver este video.
-
Aprieta los enlaces en el video para empezar tu proyecto
-
o visítanos en Github si quieres involucrarte.
