History: Getting Started

To make a website you'll need some tools and programming languages. Here we'll make a summary of the process to make a website.

In­stall Atom

First you'll need to install a decent the text editor such as Atom. Even though you can use notepad or textedit, a specialized software will give you many more advantages.

Atom

Start a Project

Once we have the

Una vez ya tenemos el editor creado, creamos una car­peta con el nombre de nuestro pro­yec­to donde pondremos todos los archivos. Para este curso usaremos el nombre Web para re­ferir­nos a la car­peta.

De­ntro de la car­peta crearemos un par de archivos, index.html y style.css. HTML es un len­guaje de estruc­tura y con­tenido. En el va el con­tenido de la web en sí. A dif­eren­cia de este, CSS es un len­guaje de es­tilo. El mismo le da col­ores, for­mas y algo de in­terac­ción al HTML.

Una vez estén creados, añadimos la car­peta a Atom como pro­yec­to. Desde Atom, Archivo > Añadir pro­yec­to y elegimos la car­peta. Vemos que se añade a la iz­quier­da sin pro­blema.

Ver la web

Una vez tenemos los dos archivos creados, podemos ver la web (que estará en blan­co) si ab­rimos el archivo index.html desde el navegador. Para ello, click de­rec­ho en el archivo > abrir con > Firefox/Chrome. Pro­bad a escribir desde Atom un sen­cil­lo "Hello world" y re­petir los pasos.

Una vez vayamos modifican­do el archivo, en lugar de rea­brir­lo podemos re­fres­car la página web con F5 y se verán los cam­bios.

1. Hacer cam­bios en index.html o en style.css (ex­plicados más adelan­te).

2. Guar­dar di­chos cam­bios

3. Abrir el archivo con nuestro navegador o ap­retar F5 con la ven­tana ab­ier­ta

4. Pro­fit! GOTO 1.

Git­hub

Git­hub es una platafor­ma con muc­has func­ionalidades para los pro­gramadores:

- La gente sube y com­par­te su código en re­positorios.

- Sirve para col­aborar en pro­yec­tos tanto open sour­ce como privados.

- Tiene un apar­tado para pub­licar páginas web que es el que nos in­teresa.