Buscar
alojamiento wordpress

 

alojamiento digital ocean

¿Usas el cloud? Consigue $100 gratis para 2 meses en Digital Ocean

Colabora con nosotros

Deja un comentario o comparte el artículo que más te guste

Contacta con nosotros para disponer de más información.

Como crear una página web

 

crear pagina web

 

En este post hablamos en detalle sobre como crear una página web.

Vamos a hacer un repaso a las tecnologías, las rutas de aprendizaje y las herramientas que debería dominar o aprender un desarrollador web para crear una página web desde cero.

Los pilares básicos de una página web

Las páginas web constan de etiquetas HTML. El primer paso es aprender a utilizar estas etiquetas:

Accede al tutorial interactivo de html 5 para aprender html desde cero.

Este sería el punto de partida. A partir de ahí habría que empezar a adquirir un conocimiento sólido de Javascript.

Más adelante mostraré las 4 rutas principales por las que actualmente se puede orientar la carrera de un desarrollador web.

Todas ellas tienen en común estos conocimientos anteriores (HTML, CSS, Javascript).

Este es el punto de partida para llegar a tener un empleo de programador web y poder crear una página web.

Estas 3 tecnologías se encuentran en la parte del front-end, y durante estos últimos 20 años, no existe otra tecnología que las sustituya por completo. Por supuesto han ido evolucionando todos estos años, pero mantienen una fuerte dependencia de sus primeras versiones.

  

Herramientas para crear una página web

Navegadores

 Por supesto la herramienta más útil es un navegador web. Aquí hay 4 opciones muy populares: Chrome, Firefox, Safari y Opera. Chrome es un navegador bastante recomendado, sobretodo por sus herramientas para developer.

Editores de código

 Para hacer más fácil el trabajo de programador web, disponemos de varios editores de texto como Notepad ++, Sublime Text, Atom o Visual Studio Core entre otros. 

También podremos encontrar entornos de programación (IDE) mucho más pesados que estos simples editores, como Netbeans, Eclipse, etc... pero realmente para la realización de un sitio web estático, no son estrictamente necesarios.

Luego existe el otro extremo, que es el programador web que trabaja en Linux, que usa el VI, que es un editor en modo texto, o el Notepad para Windows. Esta opción es realmente para los que prefieren ir a lo rudimentario y se consideran algo "freaks".

Editores de imágenes

Otra herramienta muy común para crear una página web es un editor de imágenes: casi todos conocemos Photoshop, bueno la verdad es que realmente para el trabajo de desarrollador web no vamos a sacar todo el jugo a este programa.

Otros profesionales como el diseñador gráfico, lo utilizan como algo necesario, ( también será útil para un diseñador web) pero para un programador web nos pueden servir otros programas como editores básicos de Windows o Mac OS X, que nos permitirán escalar, o hacer retoques básicos a imágenes.

Por otro lado, si todavía crees que necesitas una herramienta como Photoshop pero no quieres pagar ese dinero, existen herramientas libres como Gimp que están a su altura. 

Clientes de FTP

Otro tipo de herramientas que nos van a servir para subir el código a un servidor de desarrollo / producción o para ejecutar comandos: un cliente de FTP como FileZilla, aunque realmente puede funcionar cualquiera otro cliente.

Clientes de SSH

Es muy común usar un programa cliente para conectar mediante SSH a un servidor, como Putty. Generalmente estos programas se usan en un entorno de desarrollo de Windows. Los sistemas Mac OS X ya incorporan programas para ssh y ftp en modo texto (consola), aunque por supueso, podrás instalar estos que te he comentado.

Tecnologías complementarias

Como tecnologías complementarias al HTML y CSS podremos aprender jQuery, Bootstrap, JSON, y XML

jQuery es una librería para Javascript que facilita la programación del DOM y la gestión de los eventos. 

Bootstrap es un framework para desarrollar páginas web fácil y rápido de modo responsive.

JSON es una notación para objetos Javascript que se usa para intercambiar información entre cliente / servidor y para almacenar información.

XML es un lenguaje de marcado que se usa también para intercambiar información y para su almacenaje.

  

Despliegue de una página web

 Una vez tengamos creada una página web o las aplicaciones web, necesitaremos desplegarlas en un servidor web.

Para ello dispondremos de varias opciones.

La primera será buscar un servicio de hosting y subirlas allí. Habitualmente nos "regalan" el dominio también, con lo que podremos tener nuestra página web en cuestión de poco tiempo en Internet. Si ya dispones de hosting podrás comprar un dominio barato.

 Otra opción será contratar un vps, que es un servidor privado virtual que ofrece varias opciones de configuración. En ese servidor virtual fácilmente podremos instalar un servidor web con Apache para desplegar una página web. Entre los servicios más populares se encontraremos Digital Ocean y AWS (Amazon) , o clouding.io si buscas un servidor ubicado en un CPD de España.

 Una tercera opción estará reservada a los más "aventureros", y será utilizar un servidor linux en casa conectado a Internet, e instalar Apache. Para ello será útil también contratar un dominio, un certificado SSL, y disponer de un ADSL con fibra óptica, ya que el ancho de banda es recomendable. Será un plus contratar un servicio de fibra simétrica, que no penaliza la velocidad de subida frente de la de bajada.

 Llegados a este punto, tendremos los conocimientos necesarios para trabajar de diseñador web, que está a medio camino entre un programador y un diseñador gráfico.

Serás capaz de implementar una página web que no tengan un contenido dinámico obtenido de una base de datos, o que no utilicen un backend. Un diseñador web se centra más en el aspecto creativo de las aplicaciones web, es un perfil que parte del diseño gráfico pero se centra en el diseño de aplicaciones web.

 Como complemento para crecer como diseñador web, también será útil aprender UX, y Bootstrap, Less o Sass. Lo primero se centra en la usabilidad y en la experiencia de usuario en la web y en dispositivos móviles. Lo segundo es una librería css (o framework) para diseñar páginas web que facilita el trabajo (y permite hacer una web responsive) y lo tercero sirve para configurar y crear estilos de css de modo más fácil y configurable mediante unos compiladores de css. 

 Adicionalmente podremos encontrar otros frameworks para el front-end como Angular JS, React. pero estos ya tienen cierto peso de programación que puede quedar fuera del ámbito de un diseñador web.

 Podrás trabajar de diseñador web freelance o para una empresa de consultoría, e incluso para un cliente final. El sueldo de diseñador web no es tan elevado como uno de desarrollador web, así que probablemente rondará los 21.000 euros de inicio.

Existe una idea equivocada que un desarrollador web puede realizar el trabajo de diseñador web, y habitualmente para ahorrar gastos algunas empresas contratan sólo a uno de los dos perfiles. Pero el resultado final se "resiente", ya que esas aplicaciones web tienen un aspecto o un interfaz poco "creativo" o poco original.

Se cree que el framework Bootstrap rompe un poco estas diferencias, pero al final lo que consigue es crear una página web que se parece tanto una a otra, que carece de la originalidad, y de la creatividad propia de un buen trabajo de diseño.

  

Aprender a programar en el servidor

 Una vez dominado el front-end, podremos avanzar a aprender el back-end o iniciarnos como desarrollador web

En caso de que se quiera avanzar por esta ruta será necesario aprender a programar, y avanzaremos nuestra carrera hacia programador web. 

Bases de datos

Será útil aprender a usar bases de datos, ya que la información de las aplicaciones web se almacena en ellas. Encontraremos bases de datos relacionales (MySQL, PostGreSQL, Oracle, SQL Server) y NoSQL (MongoDB).

 A partir de aquí podremos escoger una de las 4 rutas principales más comunes. Se han ordenado por número de ofertas de empleo. Hay defensores y detractores de cada una de ellas, pero lo más importante es escoger la que mejor se adapte a tus gustos y opciones de formación.

Java

La primera ruta es Java. Lleva muchos años de historia (casi 20 años), y aunque ha perdido algo de popularidad, muchos sistemas empresariales tienen sus back-ends programados en Java (en J2EE que es la versión empresarial). Empresas como bancos, disponen de estas tecnologías. Accede a este curso Java gratis interactivo.

Se suele utilizar una base de datos relacional del estilo Oracle, y librerías Java como JSP, Spring, JDBC.

Utiliza IDEs potentes y pesados para la edición, la compilación, y la ejecución de las aplicaciones. Los más utilizados son Netbeans y Eclipse.

ASP .NET

La segunda ruta es ASP.NET. Microsoft consiguió posicionar su tecnología propia para realizar aplicaciones web, y aún muchas empresas lo utilizan. Será recomendable utilizar su propia base de datos SQL Server. También utilizaremos su propio IDE, el Visual Studio. Será útil conocer los frameworks ASP.NET MVC y WebAPI.

PHP

La tercera ruta es PHP. Lleva años de historia y es una de las más utilizadas para código abierto y para los gestores de contenido (Wordpress, Drupal, Joomla), los sistemas de aprendizaje online (Moodle) y para las tiendas online (Magento, Woocommerce). Cualquier empresa que disponga de estos gestores contenido o tiendas online va a necesitar un programador php.

Casi seguro que utilizaremos una base de datos relacional como MySQL, y frameworks de desarrollo PHP como Laravel o Symfony.

Node.js

La cuarta ruta es Node.js. Es relativamente nueva y basada en Javascript. Ahora mismo hay una especie de "burbuja" y goza de mucha popularidad. 

Se suele utilizar con una base de datos NoSQL como MongoDB y librerías/frameworks como Express

Como Javascript no se compila, se pueden utilizar editores de texto como Sublime, Atom, Visual Core o VI.

Herramientas de control de versiones

Como programador web utilizaremos herramientas como un control de versiones para gestionar el código fuente. Hoy en día es popular utilizar Git, pero existen otras herramientas históricas como SourceSafe, o SVN.

Podrás utilizar GitHub que es un repositorio online, en la web, donde podrás tener tus propios programas, ya sea en un repositorio público o privado. Hoy en día es una buena carta de presentación disponer de aplicaciones web en GitHub, es como tu portfolio como desarrollador web.

Servidores web

 También será útil conocer servidores web, como Apache para PHP o Nginx para Node.js, y servidores de aplicaciones para Java, como Weblogic, JBoss (o WildFly como se conoce actualmente) o Tomcat. Para las tecnologías Microsoft será útil conocer el IIS.

Y como estos servidores utilizan sistemas UNIX o Linux, habrá que tener unas nociones básicas del terminal de comandos bash y del sistema operativo.

Puedes consultar un tutorial de instalar Ubuntu en VirtualBox que te permitirá aprender Linux en tu propio PC sin tener que modificar las particiones o el arranque del Windows.

También sería conveniente conocer algo de certificados y SSL. Let's encrypt proporciona certificados SSL gratuitos y con instalación automatizada.

 A partir de aquí te podrás considerar un desarrollador web o un programador web fullstack que dominará tanto el front end como el back end, las bases de datos, servidores, etc...

Los sueldos de programador web para el back-end van desde los 21.000 a 30.000 euros según la tecnología. Las tecnologías PHP y Java han perdido algo de fuelle y hay mucha oferta y bastantes sistemas que aún se fundan en estas tecnologías. Sin embargo, como Node.js no hay mucha gente que lo domine, se pagan sueldos más altos (incluso hasta los 40.000 euros para un programador web experimentado), como es lógico se paga según la experiencia, la demanda y el puesto de trabajo. 

  

Desarrollador de aplicaciones móviles 

Pero dada la popularidad y la tendencia actual en relación a los móviles y tablets, no será mala opción ampliar tu carrera a desarrollador de aplicaciones móviles.

Aquí el mercado lo domina Android y iOS, y sus dos lenguajes de programación: Java y Objective-C/Swift.

Aunque también hay frameworks en Javascript que generan código nativo para iOS o Android como React Native de Facebook o Cordova de Apache. 

Quieres aprender a crear aplicaciones para iOS

Conclusión

En conclusión, hemos comentado en detalle todo lo necesario para crear una página web desde cero.

El trabajo de programador tiene bastante demanda y salida hoy en día. Tanto el diseñador web, como el programador web, o desarrollador web y el desarrollador de aplicaciones móviles tienen trabajo asegurado, ya sea en el mantenimiento de aplicaciones ASP, PHP o Java con años en el mercado o con la creación de aplicaciones Node.js más nuevas y populares o incluso con la migración de tecnologías actuales a Node.js.

En la siguiente infografía puedes ver un resumen de todo el contenido del artículo:

aplicaciones web

 

 

javascript css html

 

 

Valoraciones

  (0 valoraciones)
No hay valoraciones

 

Comentarios

Nuevo comentario
jaime roldan arias comentó el 3/8/2018
 0 
Super interesante página para aprender lo último en programación. Estoy animado para iniciar mis estudios como programador web desde hoy mismo. Muchas gracias por compartir el conocimiento.