Comparación de editores de texto.(Para principiantes)

 

Sin título-1 (1)

 

Hola, muy buenas a todos.
 
En este articulo del blog, vamos a comparar algunos de los editores de texto más usados para programar en distintos lenguajes.
 
Como ya sabemos, los editores de texto trabajan con texto plano, es decir, para nuestra máquina carácteres simples, sin formato para que quede “bonito” a diferencia de los procesadores de texto. Para programar en cualquier lenguaje de programación vamos a usar estos editores.
 
Antes de empezar con la comparativa, he de decir que cada uno de ellos son útiles dependiendo de varios factores, como por ejemplo donde lo vayas a ejecutar o el lenguaje de programación o marcado.
 
Una vez comentado esto, vamos a comentar por orden de preferencia:
 
1.-Sublime Text
 
Sublime Text es uno de  los mejores editores que existen actualmente. Me llama muchísimo la atención la simpleza y su utilidad, el aspecto visual también es sencillo pero elegante. Tiene una gran capacidad de personalización y puedes instalar varios plugins para hacer este editor más complejo.
 
Lo tenemos disponible para todas las plataformas, aunque el único pero que le pongo es que no es libre, y nos cuesta ni más ni menos que 50€, aunque podemos probarlo de forma gratuita desde su página web.
 
 
 
2.-Geany
 
Geany no solo es un editor de texto, es un IDE. Nos encontramos ante un IDE muy básico y el cual se puede aprender a usar bastante rápido. Algo muy importante de este IDE es que no nos sobrecarga el sistema.
 
URL| Geany
 
 
3.-Notepad++
 
Notepad++ es un editor de texto para Windows. Este editor está escrito en C++. Este editor es software libre y también cuenta con un gestor de plugins, donde puedes añadir nuevas funcionalidades al editor.
 
Como comentábamos antes, solo está disponible para Windows, aunque existe una versión similar para Linux y se llama Notepadqq.
 
 
4.-Komodo Edit
 
Komodo Edit es otro editor de textos, bastante sencillo y te permite editar código de forma sencilla y sin complicaciones. Uno de sus puntos fuertes es su clara sintaxis y la personalización de sus temas.
 
También estamos tratando de un software libre y si se te queda corto también puedes contar con Komodo IDE, que al ser un entorno de desarrollo es mucho mas completo.
 
 
 
5.-SlimText
 
SlimText es una extensión para el navegador Google Chrome y su función es ser un editor de textos, muy sencillo y bastante cómodo. Es muy similar a Komodo Edit, solo que este lo tienes en tu navegador.
 
URL | SlimText
 
 
6.-NetBeans
 
NetBeans es otro IDE, es muy similar a otros IDE´s más complejos, aunque este es más sencillo de utilizar que otros. Este IDE nos ofrece soporte para bases de datos.
 
NetBeans es gratuito, libre y multiplataforma. Tiene una gran comunidad que aporta plugins y tutoriales.
 
 

 

Estos programas son para facilitarnos la vida, desarrolla con el editor que más se acople a tus necesidades.

Comienzo de lenguaje de marcas con HTML

 

introduccion html
Vamos a hacer una breve introducción primero a que es el HTML.
 
Bien, pues HTML es un lenguaje de marcas. Y os preguntareis, ¿qué es un lenguaje de marcas?
Pues el lenguaje de marcas es una forma de codificar un documento que incorpora etiquetas o marcas que contienen información adicional acerca de la estructura. El más extendido es el HTML.
Dentro de los lenguajes de marcas tenemos varias clases.
  • Marcado de presentación: Nos va a indicar el formato del texto.
  • Marcado por procedimiento: Está enfocado hacia la presentación del texto.
  • Marcado descriptivo: Utiliza etiquetas para describir elementos del texto pero sin decirnos como es representado.


¿En cual de estas clases encontramos el HTML?
Pues lo vamos a situar en el marcado de presentación, ya que este lenguaje nos va a servir para definir el contenido y formato de una página web, como textos, imágenes, hiperenlaces, etc…
 
¿Qué significa HTML?
Del ingles HyperText Markup Language  que en español se refiere a lenguaje de marcas de hipertexto.
 
¿Qué necesito para empezar con HTML?
Fácil. Ganas, Bloc de notas, navegador y ¡a currar!



¡EMPECEMOS!
 
Lo primero que debemos hacer es investigar para que sirve cada instrucción, yo os adjunto una página web en la cual podéis mirar varias cositas. AQUI
 
Primero vamos a escribir lo siguiente en el bloc de notas:
<html>
 
 
 
</html>
 
Aquí dentro irá todo el código que queremos escribir. Con esto le decimos al navegador que vamos a escribir en HTML y él nos entenderá.
 
Lo siguiente es definir el cuerpo que lo vamos a hacer con la siguiente instrucción: <body>
¿Como se nos queda? Tal que así:
 
<html>
          <body>
 
 
 
         </body>
</html>
 
¿Bien?
Pues continuemos…
Para crear párrafos vamos a usar el comando <p> y para mostrar texto en negrita <b>
Vamos a ver como queda nuestro primer ejemplo.
 
<html>
       <body>
              <p><b>soy un parrafo y estoy en negrita</b></p>
       </body>
</html>
 
Despues de esto clicamos en Guardar como y ponemos la extensión .html:
ejemplo1.html
 
Y veremos que se nos guarda como si abrieses una página del navegador. Doble click y ya está el primer resultado.
¡Muy bien!
Ya sabemos algo básico. Vamos a avanzar.
 
Ahora vamos a tratar algo en el encabezado de la página web.
Para decirle al navegador que queremos tratar con el encabezado usaremos el comando <head>
y queremos ponerle titulo a nuestra página, pues usamos <title>
¿Cómo nos quedaria?
 
 

<html>
  <head>
    <title>Lenguaje de marcas</title>
  </head>
       <body>
              <p><b>soy un parrafo y estoy en negrita</b></p>
       </body>
</html>


¡Estupendo!
Vamos a pasar a cambiar la forma del texto a itálica, pues nuestro comando seria <i>.
Aunque… tambien quiero linkear mi blog atraves de un hiperenlace, pues… 
<a href=”URL DEL BLOG”>NOMBRE</a>
Por supuesto todo esto va dentro del cuerpo.
Vamos a verlo en la práctica:

<html>
  <head>
    <title>Lenguaje de marcas</title>
  </head>
       <body>

              <p><b>soy un parrafo y estoy en negrita</b></p>
              <p><i>esto es italica</i></p>
              <P>
              <a href=”http://rinconmain.blogspot.com.es/”>BLOG</a>               </p>

       </body>
</html>


Vamos a guardarlo de la misma forma que antes y a ver que tal queda.


 
¿Vamos a por un poco más? ¡Venga!
No todos los textos tienen que ser negros y del mismo tamaño.
Para eso vamos a ver ahora como modificar las fuentes con el comando <font>
Aunque este es un tanto especial… vamos a seguir aumentando el comando.
Quieres cambiar el tamaño. pues usamos <font size=”nº”>
Este número va a variar del 1 al 7, tu decides que tamaño quieres.
También podemos modificar el color… <font color=”COLOR”>
Elige el color que tu quieras pero eso si, escribelo en ingles.
Vamos a ver unos ejemplos:

 <p><font size=”5″> esto es grande </font></p>

 <p><font size=”1″> esto es pequeño </font></p>

 <p><font color=”red”> esto es rojo </font></p>


¿Fácil?
Tambien podemos modificar el tamaño y el color en una misma sentencia:

<font size=”8″ color=”blue”> esto es azul y muuuy grande </font>


Ahora todo esto vamos a implementarlo en nuestro código, a ver que tal queda.



<html>
  <head>
    <title>Lenguaje de marcas</title>
  </head>
       <body>

              <p><b>soy un parrafo y estoy en negrita</b></p>

              <p><i>esto es italica</i></p>

              <P>
              <a href=”http://rinconmain.blogspot.com.es/”>BLOG</a>               </p>
              <p><font size=”5″> esto es grande </font></p>

              <p><font size=”1″> esto es pequeño </font></p>

              <p><font color=”red”> esto es rojo </font></p>

<p>
<font size=”8″ color=”blue”> esto es azul y muuuy grande </font>
</p>

       </body>
</html>

Ahora vamos a guardarlo y a ver que tal nos queda.


 
 
¡Estupendo!
 
Pues esto es todo, espero que os haya sido de gran utilidad.
Un saludo.
Fuente: Propia