viernes, 7 de noviembre de 2014

Aprende a crear un sitio con bootstrap y sublime 3 (for free) parte 1

Este es un resumen de lo que aprendí en Udemy en el curso Build Your First Website in 1 Week with HTML5 and CSS3, impartido por Ryan Bonhardt, quien nos enseña a construir un sitio web con las herramientas bootstrap y sublime text 3. Apenas llevo una pequeña parte pero ha sido buenísimo el curso y además gratis. 


Primero que nada es necesario que obtengamos sublime 3 y bootstrap, así que vamos a sus sitios respectivos y bajamos las herramientas, si es que aún no las tenemos.

Instalamos Sublime Text 3 y descomprimimos la carpeta que bajamos desde bootstrap.
Ahora bien, en el curso a la hora de bajar boostrap la carpeta que muestra el instructor viene con una carpeta menos. El instructor nos pide que renombremos la carpeta principal de bootstrap cuando descomprimimos el zip, sin embargo la que hay que renombrar es la carpeta que viene dentro de la carpeta principal, llamada disp, para que el ejercicio salga tal y como dice el instructor a la hora de abrir la carpeta con sublime text 3. El nombre que ponemos a la carpeta es first-site. Si no renombramos la carpeta disp y renombramos en su lugar la carpeta contenedora lo que pasará será lo que se observa en el directorio de la imagen siguiente. Es decir aparece una carpeta disp.

Recuerden que lo que se tiene que abrir es una carpeta completa no un archivo individual.

Renombrando la carpeta disp nos aparece el directorio que se observa en la imagen de abajo que es el que necesitamos.


Los archivos que se muestran en las carpetas css, fonts y js, los podemos observar en el sitio de bootstrap.

Luego vamos a la carpeta first-site que vemos en sublime text y con el botón derecho le picamos y le damos en archivo nuevo (new file).

Regresamos al sitio de bootstrap y copiamos el código que aparece como basic html template.

Este código lo pegamos en el archivo que recién hemos creado en sublime text.

Ahora grabamos el archivo con el nombre index.html en la carpeta first-site (donde la tengamos en nuestro equipo) pero fuera de la carpeta css, fonts o js. Una vez hecho esto aparecerá el nombre del archivo hasta abajo del directorio.

Ya tenemos nuestro primer sitio web, el cual saluda al mundo como sitio recién nacido. Sólo hay que ir a nuestra carpeta en la cual tenemos el archivo index.html y le damos clic para que se abra. En mi caso uso chrome, así que mi archivo index.html ya aparecía con el ícono de google chrome. 

El curso está programado para una semana. Esto fue lo del primer día.

@EricAraujoM

No hay comentarios:

Publicar un comentario