Está en la página 1de 29

KINGSTON

Mis inicios en programación y hacking


Introducción
Hola, mi nombre es Bryan Javier Hernández arias “LSIRL MOomotruk” quizás algunos me
conozcan en persona, otros solo por Facebook o quizás y solo se encontraste este libro
por ahí y decidiste echar un vistazo. Pero lo que quizás si sepas es que este libro está
hecho con fines de aprender programación y hacking (principiantes) y la verdad es que no
sepas por dónde empezar, apuesto que quizás te la pasas viendo videos en YouTube de
“COMO HACKEAR FACEBOOK 100% REAL NO FEIK” (al igual que yo, unos años atrás) pero
la verdad es que aprendí que las cosas no funciona así ya que se requiere de preparación y
estudio, yo no te voy a mentir, yo no soy un ingeniero ni nada parecido, al contrario soy
todavía un niño conociendo los pasillos del súper mercado pero lo que me diferencia de
los demás es que lo que aprendí fue en muchos libros que fui recopilando y que los vine a
leer meses después de descargarlos, ya que no se trata de acumular muchos pdf, ni
aplicaciones, ni mucho menos videos, esto se trata de tener pasión para las cosas, yo
aprendí muchas cosas en muchos libros la verdad y lo que más me ayudo a seguir es que
desde el inicio todo lo hice fue desde Windows y no desde Linux ni otro tipo de sistemas
operativos por lo que aprendí a sacarle el máximo provecho a Windows y en este libro les
vengo a enseñar lo poco que se y la verdad entiendo la posición de todos ustedes ya que
hay mucho material en internet y seguro no sabes por donde comenzar, eso es algo en lo
que no estamos muy lejos así que te entiendo mejor que nadie, se quizás odies leer igual
que yo pero es la mejor forma de aprender.
Este libro es más bien una recopilación más actualizada por decirlo de así pero les dejare
los títulos de los libros con sus respectivos links de descarga
Hay libros que solo son prácticas y solo repites lo que viene ahí es por eso que te enseñare
lenguaje básico para que tu aprendas a desenvolverte solo, ya que no quiero que te
vuelvas un ladrón de código o solo te la pases usando programas hechos por verdaderos
hackers, ya que eso no es ser independiente como persona, solo estas sujeto a lo que los
demás hagan, y te lo dice alguien que se creía hacker solo por usar escáneres para
vulnerar sistemas webs.
Sé que quizás este libro no sea tomando por grandes conocedores, pero si servirá de
mucho para aquellos que busquen introducirse en este gran mundo que todos conocen
pero no todos saben usar.
Bueno una vez dicho esto les diré como e diseñado este libro y en qué términos, si, si, sé
que quizás llegue a tener muchas páginas el libro pero vamos hermano prefieres una serie
en la que publique parte por parte… ¿y si pierdes el progreso? ¿Y si el que se aburre de
enseñar soy yo? Y además no sé que aceptación valla a tener este libro, ya que muchos
programadores creen que es una tontería usar Windows como sistema operativo inicial,

1
así que por eso prefiero hacer todo junto y así si tienes una duda solo regresas un poco y
lo vuelves a leer.
En pocas palabras “TE ENSEÑARE LOS INDICIOS BASICOS DE LENGUAJES DE
PROGRAMACION Y TECNICAS DE HAKING EN WINDOWS” solo te queda leer, y si con este
libro no aprendes o no te hago introducirte en la programación, déjame decirte que esto
no es para ti.

“TODOS SOMOS BUENOS EN ALGO…UNOS NACEN CON ELLO, OTROS LO APRENDEN Y HAY
QUIENES NO SE ESFUERZAN Y NO ENCUENTRAN LO QUE NECESITAN”

2
Notas rapidas
*los temas de lenguaje aquí mostrado son mayormente de “sololearn” asi que les
recomiendo que se den una vuelta por su sitio esta muy bien organizado
*todos los link estarán subidos en mediafare
*todos los links están acortados con adfly, asi que es necesario que sepan descargar
archivos con este tipo de acortadores
° solo deben de desactivar o pausar el aplook que está en la parte superior de la derecha
(tiene un símbolo de una mano roja parecido al símbolo stop)
*todo lo aquí mostrado está hecho con fines educativos y de información no me hago
responsable del mal uso que ustedes le den a las practicas mostradas más adelante
*todo lo que se hará a través de este libro será desde Windows

3
índice

4
Comencemos
Cuéntame un poco de programación y variantes
Definiciones
 Hardware: Componentes físicos de un ordenador, por ejemplo: monitor, ratón,
teclado, ordenador, impresora, ...
 Software: Programas o elementos lógicos que hacen funcionar un ordenador o que
se ejecutan en ellos, distinguir: sistema operativa, programa

 Sistema Operativa (OS): un sistema operativo es un programa especial que se


carga en un ordenador tras ser encendido y cuya función es gestionar los demás
programas/aplicaciones que se ejecutarán en dicho ordenador, como, por ejemplo un
procesador de texto o una hoja de cálculo, o la impresión de un texto en una
impresora o una conexión a Internet. por ejemplo: DOS, Windows, MacOS, Unix,
Linux, ...
 Aplicación/Programa: (dice a un ordenador que hacer) conjunto de instrucciones
escritas en un determinado lenguaje que dirigen a un ordenador para la ejecución de
una serie de operaciones, con el objetivo de resolver un problema que se ha definido
previamente, por ejemplo: añadir dos números, compara dos números, ordenador
interpreta instrucciones: enseñar una película en la pantalla, implementar un
procesador de texto
 Lenguaje de programación: lenguaje que un ordenador entiende, muchas
diferentes lenguajes, como mundo real muchas idiomas: Basic, C, C++, java, ...
tiene que estar traducida a un código que ordenador entiende -> .exe
 Compilador: transforma el código escrito en un lenguaje de programación a un
código que un ordenador pueda ejecutar -> bit / byte, ensamblador (assembler)

 Lenguaje de script: lenguaje que un ordenador entiende, esta traducida a un código


que el ordenador entiende durante su ejecución, por ejemplo: vbs (Visual Basic
Script), JavaScript, asp, jsp, php, perl, ActionScript, ...
 Bit: Unidad mínima de información digital que puede ser tratado por un ordenador.
Proviene de la contracción de la expresión binary digit (dígito binario).
 Byte: Conjunto significativo de ocho bits que representan un carácter por ejemplo la
letra "a", en un sistema informático.

5
Historia de la Programación
Sobre los últimos 50 años, los idiomas que programan han evolucionado del código binario
de máquina a herramientas poderosas que crean las abstracciones complejas. Es importante
entender por qué los idiomas han evolucionado, y qué capacidades que los idiomas más
nuevos nos dan.

"Tan largo como no había máquinas, programar era ningún problema; cuando tuvimos unos
pocas computadoras débiles, programar llegó a ser un problema templado y ahora que
tenemos las computadoras gigantescas, programar ha llegado a ser un problema igualmente
gigantesco. En este sentido que la industria electrónica no ha resuelto un solo problema,
tiene sólo los creó - ha creado el problema de usar su producto". [Edsger. W. Dijkstra. "El
Programista Humilde" (la Conferencia del Premio de Turing), Comunicaciones del ACM,
Vol 15, No. 10 (el octubre 1972).]

E. W. Dijkstra habló estas palabras proféticas casi hace 28 años en su es la conferencia del
Premio de Turing. En aquel momento, el 'las computadoras gigantescas él radio de
probablemente tenido entre 64 y 128 kilobytes de la memoria verdadera, y a lo más unos
pocos megaoctetos de artefactos de almacenamiento de acceso directo. Si él pensó que el
problema era gigantesco entonces...

Uno de las llaves a programar exitoso son el concepto de la abstracción. La abstracción es


la llave a la construcción sistemas complejos de software. Como el tamaño de nuestros
problemas crece, la necesidad para la abstracción dramáticamente aumentos. En sistemas
sencillos, característica de idiomas usados en el 1950s y '60s, un solo programista podría
entender el problema entero, y por lo tanto manipula todas estructuras del programa y
datos. Los programistas son hoy incapaces de entender todos los programas y los datos - es
apenas demasiado grande. La abstracción se requiere a permitir que el programista para
agarrar los conceptos necesarios.

La mayoría de los libros y el reglamento en la historia de programar los idiomas tienden a


discutir los idiomas en términos de generaciones. Esto es un arreglo útil para clasificar los
idiomas por la edad.

6
Mi primer lenguaje
Procesador de texto
El procesador de texto solo se usa para escribir el código e interpretarlo, por defecto la
computadora puede leer algunos tipos de texto un ejemplo serían los de .txt .html .pdf
.doc etc… para que tu computador pueda leer diferentes lenguajes necesitas instalar
complementos, por ejemplo puedes descargar un procesador de texto (por ejemplo
notepad es el que más recomiendo) y escribir tu código con su respectivo lenguaje y luego
descargar los archivos o aplicaciones correctas para poder ejecutarlo (todas las
computadoras pueden leer HTML por defecto)

Interfaz de notepad

7
Como ven tiene muchos lenguajes para poder escoger

HTML
HTML es muy fácil de comprender quizás al principio se te haga difícil memorizarlo pero
una vez que lo domines tendrás las bases de todo.
El lenguaje que va muy de la mano con HTML es “css” pero como quizás eres un
principiante todavía, pues enseñare por separado los 2 y luego los uniremos, esto lo hare
con el fin de que no te confundas.
No voy a dar temas profundos sobre cada tema ya que eso sería muy aburrido y lo que
quiero es que se interesen en esto
HTML corresponde a las siglas en ingles de “hipertext markup languaje” y se puede
traducir al español como “lenguaje de marcas de hipertexto”
A diferencia de un lenguaje de scripting o programación que usa secuencias de comandos
para realizar procesos, un lenguaje de marcado utiliza diferentes etiquetas para identificar
el contenido.
Este es un ejemplo de una etiqueta HTML:
<p> soy un párrafo </p>
8
¿Qué usa un lenguaje de marcado para identificar contenido?
*scripts
*etiquetas
*funciones
*comandos
R= etiquetas
LA ESTRUCTURA WEB
La capacidad de programar usando HTML es esencial para cualquier profesional de
internet. Adquirir esta habilidad debería ser el punto de partida para cualquiera que este
aprendiendo como crear contenido para la web
DISEÑO WEB MODERNO
HTML: estructura
CSS: presentación
JAVASCRIPT: comportamiento
PHP o similar: back-end
CMS: gestión de contenidos
LA ETIQUETA <HTML>
Aunque se hayan lanzado varias versiones a lo largo de los años, los fundamentos de
HTML siguen siendo los mismos.
La estructura de un documento HTML se puede comparar con la de un sándwich. De la
misma manera que un sándwich tiene dos rebanadas de pan, el documento HTML tiene
etiquetas HTML de apertura y cierre.
Estas etiquetas, como el pan de un sándwich, envuelven todo lo demás:
<html>

</html>

9
LA ETIQUETA <HEAD>
Justo después de la etiqueta HTML de apertura encontraras la cabecera del documento, la
cual se identifica con las etiquetas head de apertura y cierre.
La cabecera (o head) de un archivo HTML contiene todos los elementos no visuales que
ayuda a que la pagina funcione correctamente.
<html>
<head>…</head>
</head>
LA ETIQUETA <BODY>
La etiqueta body sigue después de la etiqueta head.
Todos los elementos visuales-estructurales están contenidos dentro de la etiqueta body.
Encabezados, párrafos, listas, citas, imágenes e hipervínculos son tan solo algunos de los
elementos que puede contener la etiqueta body.
Estructura básica de HTML:
<html>
<head>
</head>
<body>
</body>
</html>

EL ARCHIVO HTML
Añade la estructura básica HTML en el editor de texto con la frase “esto es una línea de
texto” en la sección body, lo guardamos con la extensión .HTML y lo ejecutamos (les
recomiendo que guarden una carpeta en el escritorio donde guarden todo lo que veremos
en el tema y así sea más fácil de ejecutar)

10
LA ETIQUETA <TITLE>
Para colocar en la pestaña un título que describa la página web, añade un elemento
<title> en tu sección head y ejecútalo para ver qué pasa:
<html>
<head>
<title>primera página</title>
</head>
<body>
esto es una línea de texto
</body>
</html>

11
CREANDO UN BLOG
A lo largo de este curso, te ayudare a practicar y crear tú propio y único blog, para que
retengas lo que has aprendido y seas capaz de ponerlo en práctica. Solo avanza y sigue las
tareas que te dejare
<html>
<head>
<title>my blog</title>
</head> </html>
<body>
No te estreses pensando en largos códigos eso déjaselo a los conocedores xD pero
después de esta sección sin darte cuenta veras que tan largo creas tu propio código ;)
TAREA:
1. crea un archivo .HTML
2. tu página debe de tener tu nombre como encabezado
3. crea un título para tu página, recuerda, que el título de la página está localizado dentro
de la etiqueta <title> en la sección <head> de tu código.
Examen rápido:
¿Qué es HTML?
*lenguaje de marcación
*librería de hipertexto
*lenguaje de programación
*lenguaje de scripting
R= lenguaje de marcación
¿Cuáles son las partes principales que contiene el archivo HTML?
*manos y pies
*ojos y boca
*cabecera y pie de la pagina
*head y body
R= head y body
12
PARRAFOS, EL ELEMENTO <P>
Para crear un párrafo, simplemente escribe dentro del elemento <p> entre las etiquetas
de apertura y cierre
<html>
<head>
<title>primera pagina</title>
</head>
<body>
<p>esto es un párrafo</p>
<p/<esto es otro párrafo</p>
</body>
</html>
Para que tu página no registre ningún error es importante que lo guardes con la
decodificación: utf-8

13
SALTO DE LINEA SENCILLO

Usa la etique <br /> para agregar un salto de linea sin empezar un nuevo parrafo.

<html>
<head>
<title>primera página</title>
</head>
<body>
Esto es una línea de texto
<p>esto es un párrafo</p>
<p><esto es otro párrafo</p>
<p>esto es <br /> un salto de línea</p>
</body>
</html>

14
ELEMENTOS DE FORMATO
En HTML, hay una lista de elementos que especifican el estilo del texto.
Los elementos de formato fueron diseñados para mostrar tipos especiales de texto:
<html>
<head>
<title> primera página </titlte>
</head>
<body>
<p>esto es texto regular</p>
<p><b>texto en negrita</b></p>
<p><big>texto grande</big></p>
<p><i>texto en cursiva</i></p>
<p><small>texto pequeño</small></p>
<p><strong>texto reforzado</strong></p>
<p><sub>texto subíndice</sub></p>
<p><sup>texto superíndice</sup></p>
<p><ins>texto insertado</ins></p>
<p><del>texto borrado</del></p>
</body></html>

ENCABEZADOS HTML

15
HTML incluye seis niveles de encabezados, los cuales están clasificados de acuerdo a su
importancia. Estos son: <h1><h2><h3><h4><h5><h6>
<htnl> <head> <title> primera página </title> </head>
<body>
<h1>este es el encabezado 1</h1>
<h2>este es el encabezado 2</h2>
<h3>este es el encabezado 3</h3>
<h4>este es el encabezado 4</h4>
<h5>este es el encabezado 5</h5>
<h6>este es el encabezado 6</h6>
</body> </html>

LINEAS HORIZONTALES
Para crear una línea horizontal, usa la etiqueta <hr />
<html><head>
<title>primera página</title>
</head>
<body>
<h1>este es el encabezado 1</h1>
<p>esto es un párrafo</p>
<hr />
<p> esto es un párrafo</p>
16
</body> </html>

COMENTARIOS
El explorador no despliega comentarios, pero estos ayudan a documentar el código html
para agregar descripciones, recordatorios y otras notas
<!--esto es un comentario xD-->
Ejemplo
<html><head>
<title>primera página</title>
</head>
<body>
<p>esto es un párrafo</p>
<hr />
<p> esto es un párrafo</p>
<!--esto es un comentario xD-->
</body>
</html>

FORMATEANDO TEXTO

17
Volvamos a nuestro proyecto de blog. La sección “acerca de mi” tendrá un encabezado
que estará envuelto en la etiqueta <h1>, junto con dos párrafos que formatean el texto
utilizando las etiquetas que acabas de aprender:
<h1><span> acerca de mi</span></h1>
<p>
Hola mi nombre es <strong> Bryan Javier</strong> y estoy aprendiendo HTML</p>
<p class=”quote”>uwu declarando variables</p>
Te puedes haber dado cuenta que también e utilizado algo de CSS para dar cierto estilo al
código, cuando termines el curso de HTML, te recomiendo que siguas leyendo para
aprender CSS
TAREA:
1. crea tu propia sección “acerca de mi” modificando el texto
2. juega con el código;
Experimenta formateando el texto.

ELEMENTOS DE HTML
Los documentos de HTML están hechos de elementos HTML.
18
Un elemento HTML se escribe usando una ETIQUETA DE INICIO, una ETIQUETA DE CIERRE,
y con el CONTENIDO en medio de ambas etiquetas.
Los documentos HTML consisten en elementos html anidados. En el ejemplo siguiente, el
elemento body incluye las etiquetas <p>, <br /> y el contenido, “esto es un párrafo”
<html> <head> <title> primera pagina </title> </head>
<body>
<p> esto es un párrafo<br /></p>
</body>
</html>
ELEMENTOS HTML
Algunos elementos son bastante pequeños. Como no podemos agregar contenido dentro
de una etiqueta de salto de línea, y no tiene una etiqueta de apertura ni tampoco de
cierre, este es un elemento separado y sencillo.
Por lo tanto, HTML es en realidad múltiples secuencias de comandos utilizando elementos
dentro de elementos.
<html><head><title> primera pagina</title></head>
<body>
<p>esto es un párrafo</p>
<p>esto es <br /> un salto de línea</p>
</body>
</html>

ATRIBUTOS HTML
Los atributos proveen INFORMACION ADICIONAL sobre un elemento o etiqueta, a la vez
que lo MODIFICAN. La mayoría de atributos tiene un valor; el valor modifica el atributo
<p align=center>
Este texto está alineado al centro </p>
¿Cuál es el rol de un atributo en HTML?
*modifica la etiqueta

19
*la etiqueta no puede tener atributos
*sirve solo como un comentario
R=modifica la etiqueta
ATRIBUTOS DE DIMENSION
Como un ejemplo, podemos modificar la línea horizontal para que tenga un ancho de 50
pixeles.
Esto se puede hacer usando el atributo width:
<hr width=50px />
El ancho de un elemento también puede ser modificado usando porcentajes:
<hr width=50% />

¿Qué unidades de medida pueden ser usadas con el atributo width para modificar el
ancho de un elemento?
*todas las unidades de medida existentes
*pixeles y %
*no se usan unidades de medida
*km y metro
R=pixeles y %

EL ATRIBUTO ALIGN
El atributo ALIGN es usado para especificar como alinear el texto.
En el siguiente ejemplo, tenemos un párrafo que está alineada hacia la derecha
<html><head><title>atributos </title></head>
<body>
<p align=center>esto es un texto
<br />
<hr width=10px align=right />
Esto también es un texto

20
</p>
</body>
</html>

¿Qué atributo es usado para alinear los contenidos de un elemento a la derecha, centro o
la izquierda?
*align
*alignment
*direction
*location
R=align
ATRIBUTOS
Puedes estarte preguntando qué pasa si intentamos aplicar atributos contradictorios
dentro del mismo elemento
<p align=center>
Esto es un texto
<hr width=50px align=left />
</p>
LA ETIQUETA <IMG>
La etiqueta <img> es usada para insertar una imagen. Contiene solo atributos, y no tiene
una etiqueta de cierre.
La URL de la imagen (direccion) puede ser definida usando el atributo src.
La sintaxis HTML de una imagen se ve así:
<img src=”image.jpg” />

UBICACIÓN DE LA IMAGEN
Para que el explorador web pueda desplegar una imagen, necesitamos colocar dentro de
comillas la ubicación de la imagen como valor del atributo src.
21
Por ejemplo, tenemos una foto llamada “tree.jpg” en la misma carpeta que el archivo
HTML, su código debería verse así:
<html><head><title>primera página</title></head>
<body>
<img src=”tree.jpg” alt=”” />
</html>
En caso de que la imagen no pueda ser mostrada, el atributo alt especifica un texto
alternativo que describe la imagen en palabras. El atributo alt es requerido.
CAMBIAR EL TAMAÑO DE UNA IMAGEN
Para definir el tamaño de una imagen, usa los atributos width y height (ancho y alto)
El valor puede ser especificado en pixeles o como porcentaje:
<html><head><title>primera página</title></head>
<body>
<img src=”árbol.jpg” height=150px width=150px alt=”” />
<!—o-->
<img src=”árbol.jpg” height=50% width=50% alt=”” />
</body>
</html>
La carga de imágenes toma tiempo. Usar imágenes grandes puede volver lenta tu página,
así que úsalas con precaución
BORDE DE LA IMAGEN
Por defecto, una imagen no tiene bordes.
Usa el atributo border dentro de la etiqueta image para crar un borde alrededor de la
imagen.
<img src=árbol.jpg height=150px width=150px border=1px alt=”” />

22
HIERVINCULOS, LA ETIQUETA <A>
Los hipervínculos también son una parte fundamental de cualquier página web.
Puedes agregar hipervínculos a textos o imágenes que le permitirá al usuario hacer click
en ellos para luego ser redirigidos a otro archivo o página web.
En HTML, los hipervínculos son definidos usando la etiqueta <a>.
Use el atributo href para definir la dirección de destino del hipervínculo:
<a href=””></a>
CREANDO TU PRIMER HIPERVINCULO
En el siguiente ejemplo, se define un hipervínculo a otra pagina web en progreso es
definido:
<a sref=”C:\Users\m\Desktop\libro\new 2.html”>aprendiendo hipervínculos</a>

23
Así se vería el código

Esto pasa después de apretar el hipervínculo

EL ATRIBUTO TARGET
24
El atributo target específica donde abrir el documento vinculado. Dándole un valor _blank
al atributo abrirá el hipervínculo en una ventana o pestaña:
<a href=”C:\Users\m\Desktop\libro\new 2.html” target=”_blank”>
Aprendiendo hipervínculos</a>

LISTAS HTML ORDENADAS


Una lista ordenada empieza con la etiqueta <ol> y cada ítem es definido por la etiqueta
<li>.
Aquí un ejemplo de una lista ordenada-ordenada:
<html><head><title>primera pagina</title></head>
<body>
<ol>
<li>rojo</li>
<li>azul</li>
<li>verde</li>
</ol>
</body>
</html>
LISTA HTML SIN ORDENAR
Una lista sin ordenar comienza con la etiqueta <ul>:
<html><head><title>primera pagina</title></head>
<body>
<ul>
<li>rojo</li>
<li>azul</li>
<li>verde</li>
</ul> </body></html>
MIS HABILIDADES

25
De vuelta a tu blog vas a crear una sección “mis habilidades” la cual es una lista no
ordenada de idiomas que conoces.
Utiliza la etiqueta <ul>, en la cual cada elemento es representado con la etiqueta <li>, para
crear una lista ordenada:
<h1><span>Mis habilidades </span></h1>
<ul>
<li>html/li>
<li>css</li>
<li>javascript</li>
</ul>
Tarea:
1. Crea tu propia sección “Mis habilidades”
2. Utiliza la etiqueta <a> para hacer cada elemento de la lista un enlace

CREANDO UNA TABLA

26
Las tablas son definidas usando la etiqueta <table>
Las tablas son divididas en filas con la etiqueta <tr>
Las filas de la tabla son divididas en columnas (datos de la tabla) con la etiqueta <td>
Aquí un ejemplo de una tabla con una fila y tres columnas:
<table>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
Las etiquetas de datos de la tabla <td> actúan como contenedores de datos dentro de la
tabla
Pueden contener todo tipo de elementos html como texto, imágenes, listas, otras tablas, y
demás

LOS ATRIBUTOS BORDER Y COLSPAN


Un borde puede ser agregado usando el atributo border
<table border=”2”>
La celda de una tabla puede expandirse entre dos o mas columnas:
<table border=”2”>
<tr>
<td>rojo</td>
<td>azul</td>
<td>verde</td>
</tr>

<tr>

27
<td><br /><td>
<td colspan=”2”></td>
</tr>
</table>
COLSPAN DE COLORES
El siguiente ejemplo demuestra el atributo colspan en acción:
<table border=”2”>
<tr>
<td>rojo</td>
<td>azul</td>
<td>verde</td>
</tr>
<tr>
<td>amarillo</td>
<td colspan=”2”>naranja</td>
</tr>
</table>

uuuuu

28

También podría gustarte