rearrange the es zig series
This commit is contained in:
parent
8e8cb10d3b
commit
dc487a2788
@ -4,7 +4,7 @@ title: "¿Con qué lenguaje de programación se crean los lenguajes de programac
|
|||||||
description: |
|
description: |
|
||||||
Vista superior de cómo funciona un lenguaje de programación
|
Vista superior de cómo funciona un lenguaje de programación
|
||||||
realmente.
|
realmente.
|
||||||
pubDate: "2024-07-25"
|
pubDate: "2024-07-14"
|
||||||
tags: ["tech", "lenguajes", "tutorial"]
|
tags: ["tech", "lenguajes", "tutorial"]
|
||||||
image:
|
image:
|
||||||
url: "/img/blog/es/lang/cover.png"
|
url: "/img/blog/es/lang/cover.png"
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
---
|
---
|
||||||
layout: ../../../layouts/BlogLayoutEs.astro
|
layout: ../../../layouts/BlogLayoutEs.astro
|
||||||
title: "01: Programación desde cero absoluto con Zig"
|
title: "Cero a Zig 01: Programación desde cero absoluto con Zig"
|
||||||
description: |
|
description: |
|
||||||
Aprendé a programar desde completamente cero, utilizando el lenguaje
|
Aprendé a programar desde completamente cero, utilizando el lenguaje
|
||||||
de programación Zig.
|
de programación Zig.
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
---
|
---
|
||||||
layout: ../../../layouts/BlogLayoutEs.astro
|
layout: ../../../layouts/BlogLayoutEs.astro
|
||||||
title: "02: Programación desde cero absoluto con Zig: Fundamentos"
|
title: "Cero a Zig 02: Fundamentos"
|
||||||
description: |
|
description: |
|
||||||
Fundamentos de la computación, programas, componentes
|
Fundamentos de la computación, programas, componentes
|
||||||
pubDate: "2024-07-16"
|
pubDate: "2024-07-16"
|
||||||
|
|||||||
@ -1,141 +1,174 @@
|
|||||||
---
|
---
|
||||||
layout: ../../../layouts/BlogLayoutEs.astro
|
layout: ../../../layouts/BlogLayoutEs.astro
|
||||||
title: "03: Programación desde cero: Hola mundo"
|
title: "Cero a Zig 03: Instalando VSCode y Zig"
|
||||||
description: |
|
description: |
|
||||||
Escribí el tradicional programa "Hola mundo" por tí mismo!
|
Instalamos Zig y VSCode en nuestro computador
|
||||||
pubDate: "2024-07-17"
|
pubDate: "2024-07-17"
|
||||||
tags: ["tech", "lenguajes", "intro", "tutorial", "zig"]
|
tags: ["tech", "lenguajes", "intro", "tutorial", "zig", "VSCode"]
|
||||||
image:
|
image:
|
||||||
url: ""
|
url: ""
|
||||||
alt: ""
|
alt: ""
|
||||||
caption: ""
|
caption: ""
|
||||||
---
|
---
|
||||||
|
|
||||||
|
En este artículo vamos a instalar 2 cosas en nuestro computador:
|
||||||
En este artículo vamos a escribir nuestro primer programa: Hola mundo. Vamos a
|
[Zig](https://ziglang.org/) y
|
||||||
modificarlo y entender algunos otros conceptos.
|
[Visual Studio Code](https://code.visualstudio.com/).
|
||||||
|
Necesitamos estas 2 herramientas antes de poder empezar a programar.
|
||||||
## Hola mundo
|
|
||||||
|
|
||||||
Hola mundo es tradicionalmente el [primer programa](https://es.wikipedia.org/wiki/Hola_mundo)
|
|
||||||
que se escribe cuando se aprende a programar.
|
|
||||||
|
|
||||||
Vamos a empezar con este programa. Entra a la siguiente página web:
|
|
||||||
[https://zig.fly.dev/p/xNluereqmgW](https://zig.fly.dev/p/xNluereqmgW)
|
|
||||||
|
|
||||||
Veras lo siguiente:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Arriba está el nombre de la página: "Zig Playground". A su derecha hay 3 botones en inglés:
|
|
||||||
|
|
||||||
- "Run" ejecuta el programa.
|
|
||||||
- "Format" hace algo llamado 'formatear' el código. No lo usaremos aún.
|
|
||||||
- "Share" comparte el código que escribimos. No lo usaremos.
|
|
||||||
|
|
||||||
Dentro del recuadro plomo está escrito el código **Zig**. No lo modifiques aún.
|
|
||||||
|
|
||||||
Si lo modificaste y quieres volver al código original, cierra la página y vuelve a
|
|
||||||
abrirla con el link de arriba.
|
|
||||||
|
|
||||||
## Ejecutando el código
|
|
||||||
|
|
||||||
Presiona el boton "Run". Aparecerá texto debajo del recuadro del código:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Este texto es el resultado de ejecutar el programa. Se lee:
|
|
||||||
|
|
||||||
- `Hola mundo!` : Este es el resultado del programa.
|
|
||||||
- `Program exited.` : Significa "El programa terminó" en ingles. Nos
|
|
||||||
indica que el programa terminó de ejecutarse. Puedes ignorarlo.
|
|
||||||
|
|
||||||
Felicidades! Has ejecutado tu primer programa.
|
|
||||||
|
|
||||||
> Desafio: Borra todo el código y vuelve a escribirlo, exactamente igual.
|
|
||||||
Utiliza la imágen como guía.
|
|
||||||
|
|
||||||
|
|
||||||
## ¿Qué significan todas estas letras?
|
Ya que este es un tutorial básico de programación, asumo que
|
||||||
|
estas utilizando Windows. Yo usaré Windows 10, pero las instrucciones
|
||||||
Como verás, hay un monton de palabras y símbolos con colorcitos.
|
funcionan igual en Windows 11.
|
||||||
Este es el código, es como un lenguaje especial utilizado
|
|
||||||
para comunicarse con el computador.
|
|
||||||
|
|
||||||
Así como el francés, árabe o coreano, el **lenguaje** de programación Zig
|
|
||||||
tiene un conjunto de reglas. Aprenderemos las reglas a medida que avance
|
|
||||||
el tiempo. Mientras tanto, puedes ignorar todas esas palabras.
|
|
||||||
|
|
||||||
> ¿Que pasa si eliminas alguna de esas palabras y ejecutas el programa
|
|
||||||
(con el boton "Run")? ¿Qué mensaje obtienes? ¿Qué crees que significa?
|
|
||||||
|
|
||||||
|
|
||||||
## Magia negra y abstracción
|
## Descargar e instalar VSCode
|
||||||
|
|
||||||
Según [Significados.com](https://www.significados.com/abstracto/),
|
Si sabes como instalar un programa y no necesitas instrucciones
|
||||||
abstracto significa vago, impreciso, teórico, que no tiene existencia
|
paso a paso, saltate esta sección.
|
||||||
física (entre otras cosas). Algo abstracto suele ser algo difícil
|
|
||||||
de entender, o imaginario.
|
Primero busca `VSCode` en Google, y entra a la primera página que
|
||||||
|
sale.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Una vez en la página descarga VSCode con el boton grande y azul.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Se abrirá una nueva ventana en la esquina superior derecha.
|
||||||
|
Cuando termine de descargarse, ábrelo haciendole click.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
En programación, abstracto tiene otro significado. Puedes buscar su
|
Se abrirá una nueva ventana. Primero selecciona
|
||||||
definición técnica en internet, pero me parece muy confusa para
|
"Acepto el acuerdo" y despues presiona el boton "Siguiente".
|
||||||
un principiante, así que lo explicare en mis términos.
|
|
||||||
|
|
||||||
En programación, abstracto significa que sabemos **qué** hace, pero
|
|
||||||
no **cómo** lo hace. Un ejemplo claro sería un auto. Sabemos que
|
|
||||||
al pisar el acelerador, el auto avanza. Pero no sabemos **cómo**
|
|
||||||
pisar el acelerador ocasiona que el combustible se transforme en
|
|
||||||
energía cinemática.
|
|
||||||
|
|
||||||
Por ejemplo, voy a hablar más adelante de "imprimir" en el programa.
|
Volveran a salir nuevas ventanas. Presiona "Siguiente" en todas.
|
||||||
Imprimir significa mostrar un mensaje en la pantalla. Sin embargo,
|
|
||||||
no te voy a explicar cómo funciona la impresión. El concepto de
|
|
||||||
"imprimir" es abstracto.
|
|
||||||
|
|
||||||
### Magia negra
|
|
||||||
|
|
||||||
Escuché este termino del canal de Youtube Imesi.net. Magia negra
|
Cuando salga "Instalar" en vez de "Siguiente", presionalo.
|
||||||
es algo que: no se qué hace, cómo funciona, ni tampoco me importa.
|
|
||||||
|
|
||||||
Voy a utilizar el término "magia negra" para referirme a algo
|
|
||||||
por lo que no necesitas preocuparte, o intentar entender. Por
|
|
||||||
ejemplo, en el código de más arriba:
|
|
||||||
|
|
||||||
|
Finalmente, saldrá una última ventana. Presiona "Finalizar"
|
||||||
|
y se abrirá VSCode.
|
||||||
|
|
||||||
Todo el texto que dice:
|
|
||||||
|
|
||||||
```zig
|
También puedes abrir VSCode desde el menú de inicio de
|
||||||
const std = @import("std")
|
Windows.
|
||||||
|
|
||||||
pub fn main() {
|
|
||||||
std.debug.print();
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
es magia negra. Funciona, hace algo, pero no importa. No te
|
|
||||||
preocupes en intentar entenderlo.
|
|
||||||
|
|
||||||
Eventualmente, y a medida que aprendas conceptos nuevos,
|
|
||||||
entenderas qué significan esas cosas.
|
|
||||||
|
|
||||||
|
|
||||||
## Inglés
|
|
||||||
|
|
||||||
Como habras visto, prácticamente todo el código está en inglés.
|
|
||||||
Si ya sabes ingles, o lo estas aprendiendo, no tendrás muchos
|
|
||||||
problemas continuando.
|
|
||||||
|
|
||||||
En mi opinion, programar sin saber inglés es contraproducente.
|
|
||||||
Los lenguajes de programación (en su mayoría) se escriben en
|
|
||||||
inglés, las mnemotécnicas están en inglés, y mucha información
|
|
||||||
útil e importante está en inglés. Programar sin saber inglés
|
|
||||||
es sumamente difícil.
|
|
||||||
|
|
||||||
Seguramente aprenderás algunas palabras a lo largo del tutorial,
|
|
||||||
pero lo mejor que podrías hacer es aprender inglés.
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## Introducción a VSCode
|
||||||
|
|
||||||
|
VSCode es un "IDE", un programa que trae muchas funciones
|
||||||
|
útiles a la hora de programar. Lo vamos a utilizar a partir
|
||||||
|
de ahora para aprender a programar en Zig.
|
||||||
|
|
||||||
|
La primera vez que se abre VSCode se ve así:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Hay un monton de botones y divisiones. No te preocupes en
|
||||||
|
entenderlo todo ahora mismo.
|
||||||
|
|
||||||
|
Notarás que el programa está en inglés. Ahora te mostraré
|
||||||
|
cómo ponerlo en español.
|
||||||
|
|
||||||
|
### Cambiar idioma a español
|
||||||
|
|
||||||
|
A la izquierda arriba hay una serie de botones. Presiona el último,
|
||||||
|
que tiene unos cuadros.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Esto abre una pestaña donde podemos buscar "Extensiones".
|
||||||
|
Las extensiones agregan características a VSCode.
|
||||||
|
|
||||||
|
Primero vamos a instalar el idioma español. En la barra de búsqueda
|
||||||
|
escribe "español":
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Y presiona el botón azul "Install" del primer item de la lista
|
||||||
|
que dice "Spanish":
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Luego de eso, abajo a la derecha saldrá un mensaje.
|
||||||
|
Presiona el botón azul:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
El programa se reiniciará, y ahora estará en español.
|
||||||
|
|
||||||
|
Ahora vamos a instalar la extensión de Zig.
|
||||||
|
|
||||||
|
|
||||||
|
### Instalar la extensión de Zig
|
||||||
|
|
||||||
|
Regresa a la pestaña de extensiones:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Y busca "Zig". Instala la extensión que se llama
|
||||||
|
"Zig Language" y dice "ziglang":
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Cuando se haya instalado puedes cerrar la pestaña:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Y volver al inicio:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## Instalar Zig
|
||||||
|
|
||||||
|
Hemos instalado la extensión de Zig, ahora instalaremos algo
|
||||||
|
llamado "Compilador".
|
||||||
|
|
||||||
|
Presiona `Control + Shift + P`, se abrirá una ventana arriba
|
||||||
|
en el centro:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
En la barra de busqueda escribe `Zig`, y presiona el botón
|
||||||
|
`Zig Setup: Install Zig`:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
En el dialogo que sale, presiona "Install".
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Saldrá una nueva ventana, donde hay que escoger una versión.
|
||||||
|
Elije la versión debajo de `nightly`. Al momento de escribir
|
||||||
|
esto es `0.13.0`.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Saldrá una nueva ventana, presiona "Install".
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Y selecciona la misma versión de antes. En mi caso, `0.13.0`.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Con eso terminamos. Hemos instalado Zig en nuestro computador.
|
||||||
|
|
||||||
|
En el siguiente artículo aprenderemos del terminal y
|
||||||
|
crearemos un proyecto.
|
||||||
|
|
||||||
|
|||||||
@ -1,171 +1,170 @@
|
|||||||
---
|
---
|
||||||
layout: ../../../layouts/BlogLayoutEs.astro
|
layout: ../../../layouts/BlogLayoutEs.astro
|
||||||
title: "04: Programación desde cero: Modificando el hola mundo"
|
title: "Cero a Zig 04: Terminal y Proyecto Zig"
|
||||||
description: |
|
description: |
|
||||||
Impresión, strings/cadenas y stdout.
|
Veremos el terminal y cómo crear/ejecutar un proyecto de Zig
|
||||||
pubDate: "2024-07-30"
|
pubDate: "2024-07-18"
|
||||||
tags: ["tech", "lenguajes", "intro", "tutorial", "zig"]
|
tags: ["tech", "lenguajes", "intro", "tutorial", "zig", "VSCode"]
|
||||||
image:
|
image:
|
||||||
url: ""
|
url: "/vid/hacker.webp"
|
||||||
alt: ""
|
alt: ""
|
||||||
caption: ""
|
caption: ""
|
||||||
---
|
---
|
||||||
|
|
||||||
En el artículo anterior escribimos nuestro primer programa:
|
Seguramente has visto imágenes/videos de hackers antes,
|
||||||
Hola mundo. En este artículos vamos a modificar el mensaje
|
escribiendo en una pantalla negra con letras verdes.
|
||||||
y aprender el primer concepto: Strings
|
Ahora tu también, podras escribir en una pantalla negra
|
||||||
|
(pero sin letras verdes).
|
||||||
|
|
||||||
|
En este artículo veremos el terminal, crearemos un proyecto
|
||||||
|
de Zig en nuestro computador, y lo ejecutaremos.
|
||||||
|
|
||||||
|
En el artículo anterior ya instalamos VSCode y Zig, así que a partir
|
||||||
|
de ahora me referiré a ellos.
|
||||||
|
|
||||||
|
|
||||||
## Modificando "Hola mundo"
|
## El terminal
|
||||||
|
|
||||||
Entra a la página web
|
[El/la terminal](https://en.wikipedia.org/wiki/Command-line_interface)
|
||||||
[https://zig.fly.dev/p/xNluereqmgW](https://zig.fly.dev/p/xNluereqmgW),
|
es una forma de interactuar con nuestro computador, y se utiliza
|
||||||
donde se encuentra el programa "Hola mundo". Esta vez vamos a modificar
|
muchisimo en programación.
|
||||||
el mensaje.
|
|
||||||
|
|
||||||
El resto de las palabras son magia negra. Te habras dado cuenta que
|
En el terminal escribimos comandos, el computador los ejecuta,
|
||||||
hay palabras en español: Hola y mundo.
|
y nos responde. En cierto modo es como una versión mini de la
|
||||||
|
programación.
|
||||||
|
|
||||||
|
Dentro de VSCode, en los menus de arriba a la izquierda, selecciona
|
||||||
|
los 3 puntos, `Terminal`, `Nuevo Terminal`:
|
||||||
|
|
||||||
Hay varias cosas que notar:
|
|
||||||
|
|
||||||
- Estan pintadas de color amarillo
|
Aparecerá una nueva ventana en blanco abajo:
|
||||||
- Tienen comillas dobles `"` al inicio y al final
|
|
||||||
|
|
||||||
Dentro de estas comillas `"` podemos escribir el texto que querramos.
|
|
||||||
|
|
||||||
Por ejemplo, si reemplazas `Hola` por `Adios` y ejecutas el programa,
|
Este es nuestro terminal. Aquí escribiremos algunos comandos
|
||||||
se imprimirá `Adios mundo!`
|
para crear un "proyecto" y "ejecutarlo".
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Y también, si reemplazas `mundo` por otra palabra, se imprimirá
|
|
||||||
lo que escribiste.
|
|
||||||
|
|
||||||
Tambien puedes agregar otro texto en ambos lados. Por ejemplo:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## Strings / cadenas de caracteres
|
## Creando un proyecto de Zig
|
||||||
|
|
||||||
Los strings (cadenas de caracteres en inglés) son la forma
|
Un proyecto es una carpeta con una serie de archivos,
|
||||||
en la que almacenamos texto.
|
en los cuales programaremos nuestro programa.
|
||||||
|
|
||||||
Un string empieza con una comilla doble `"`, el contenido
|
Haz click en en el terminal y escribe `mkdir tutorial`
|
||||||
del string, y termina con una comilla doble `"`.
|
|
||||||
|
|
||||||
Unos ejemplos de strings son: `"hola"`, `"adios"`,
|
|
||||||
`"multiples palabras"`, `"123456"`.
|
|
||||||
|
|
||||||
En el programa de arriba hay 2 strings:
|
`mkdir` es el "comando" que ejecutará la computadora,
|
||||||
|
y `tutorial` es un "argumento" que recibe el comando.
|
||||||
|
|
||||||
|
`mkdir` viene del inglés "make directory", y crea una
|
||||||
|
carpeta nueva. En este caso estamos creando una carpeta
|
||||||
|
llamada `tutorial`.
|
||||||
|
|
||||||
Estos strings son lo que se muestra en pantalla al
|
Presiona enter para ejecutar el comando.
|
||||||
ejecutar el programa.
|
|
||||||
|
|
||||||
Los strings tienen algunas características:
|
|
||||||
|
|
||||||
- En el código, los strings tienen otro color para que
|
En el terminal veremos siempre:
|
||||||
sea más fácil identificarlos.
|
|
||||||
- No puede haber comillas dentro de un string.
|
|
||||||
|
|
||||||
El string termina cuando aparece la primera comilla.
|
1. (1) La carpeta en donde estamos
|
||||||
Por ejemplo:
|
2. (2) El comando que escribimos
|
||||||
|
|
||||||
|
Algunos comandos tienen una "respuesta". En la imágen
|
||||||
|
de arriba la respuesta es una confirmación de la carpeta
|
||||||
|
que creamos.
|
||||||
|
|
||||||
Aquí el string termina despues del `Hola `, la palabra
|
Ahora vamos a ejecutar otro comando: `cd tutorial`
|
||||||
`familia` no es parte del string. Puedes ver que el
|
|
||||||
color amarillo del string termina en la segunda comilla,
|
|
||||||
y la palabra familia está de color blanco.
|
|
||||||
|
|
||||||
- No puede haber nuevas lineas en un string. Esto es un error:
|
|
||||||
|
|
||||||
|
`cd` es una abreviación de "change directory", que
|
||||||
|
significa cambiar de carpeta. Usando este comando cambiamos
|
||||||
|
la carpeta en la que estamos.
|
||||||
|
|
||||||
Sin embargo, hay ocasiones donde queremos tener varias lineas
|
Ahora vamos a crear el proyecto de Zig, con el comando
|
||||||
en un string. Para esto se utilizan 2 caracteres especiales:
|
`zig init`:
|
||||||
`\n`. Estos nos permiten "señalar" que ahí va una linea nueva.
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Estos caracteres especiales se conocen como "caracteres de escape".
|
El comando `zig` nos permite realizar varias acciones,
|
||||||
Hay varios de ellos, pero no los veremos por ahora.
|
que veremos con el tiempo.
|
||||||
|
|
||||||
|
Al ejecutar `zig init` creamos un proyecto nuevo en
|
||||||
|
la carpeta actual. Esto crea una serie de archivos
|
||||||
|
y carpeta, que ahora abriremos.
|
||||||
|
|
||||||
|
Esto solo se hace una vez. Luego vamos a reutilizar el proyecto
|
||||||
|
que acabamos de crear.
|
||||||
|
|
||||||
|
|
||||||
## Impresión
|
## Abriendo el proyecto
|
||||||
|
|
||||||
Imprimir es mostrar información a través de la pantalla. Esta
|
Dentro de VSCode, presionamos el boton "Abrir carpeta".
|
||||||
información puede ser palabras, letras, números, símbolos, etc.
|
|
||||||
|
|
||||||
Para imprimir en Zig se escribe lo siguiente:
|
|
||||||
|
|
||||||
|
Si no puedes ver este boton, asegurate de estar en la primera pestaña:
|
||||||
|
|
||||||
`std.debug.print` es una invocación que imprime lo que tenga
|
|
||||||
dentro. Para poner algo dentro, se utilizan parentesis `()`.
|
|
||||||
|
|
||||||
Dentro de los paréntesis va el string que queremos imprimir
|
Aquí seleccionamos la carpeta `tutorial`. Esta es la carpeta que
|
||||||
y una secuencia misteriosa, así: `("Tu mensaje", .{})`.
|
acabamos de crear en el terminal.
|
||||||
|
|
||||||
Y finalmente, muy importante, todas las invocaciones
|
|
||||||
terminan con un punto y coma `;`. Si la invocación
|
|
||||||
no termina con su punto y coma tendrás un error misterioso.
|
|
||||||
|
|
||||||
Por ejemplo, para imprimir un nuevo texto `Me gusta Zig`
|
Nos saldrá el mensaje de la imagen de abajo. Selecciona "Confiar en
|
||||||
se escribiriá el código así:
|
los autores..." y presiona "Si, confio en los autores".
|
||||||
|
|
||||||
`std.debug.print("Me gusta Zig", .{});`
|
|
||||||
|
|
||||||
Podemos tener varias invocaciones a la vez, y ejecutarlas en
|
Ahora veras que en vez del boton "Abrir carpeta" ahora hay una
|
||||||
siempre que la invocación esté bien escrita.
|
serie de archivos.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Y al ejecutar el programa se imprimiran los mensajes en orden.
|
Este es nuestro proyecto. Aquí es donde estarán todos los archivos
|
||||||
|
que usaremos.
|
||||||
|
|
||||||
|
- Carpeta `src`: Contiene el código que ejecutaremos
|
||||||
|
- `build.zig`: Archivo mágico. Es mejor no tocarlo.
|
||||||
|
- `build.zig.zon`: Archivo mágico. Es mejor no tocarlo.
|
||||||
|
|
||||||
|
Haz click en la carpeta `src` y en el archivo `main.zig`:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Este es el archivo donde trabajemos por el resto de la serie.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Veras que hay un monton de código raro, que aun no sabemos qué
|
||||||
|
significa. Por ahora lo vamos a dejar así.
|
||||||
|
|
||||||
|
|
||||||
## Nuevas lineas
|
## Ejecutando el proyecto
|
||||||
|
|
||||||
Notarás que el mensaje se imprimió junto: `Mi primera impresiónMe gusta Zig`.
|
Ahora que instalamos Zig en nuestro computador, tenemos que ejecutar
|
||||||
|
el programa en nuestro computador. Eso lo haremos desde el terminal.
|
||||||
Este es un buen momento para presentar un concepto muy importante:
|
|
||||||
la computadora hace lo que le pides, no lo que quieres.
|
|
||||||
|
|
||||||
El código que ejecutamos no le pide a la computadora que imprima
|
|
||||||
una nueva linea `\n`. Así que la computadora no la imprime.
|
|
||||||
|
|
||||||
Para tener una nueva linea hay que incluirla en los strings, y con
|
|
||||||
eso al ejecutar estará cada linea separada:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
Ve al terminal y ejecuta `zig build run`. Veras un monton de texto
|
||||||
|
raro, pero al final debería quedar así:
|
||||||
|
|
||||||
## Glosario
|
|
||||||
|
|
||||||
No es necesario que memorices o entiendas estas palabras.
|
|
||||||
|
|
||||||
- String: "cadena de caracteres"
|
|
||||||
- `const`: abreviatura de "constante", que no cambia
|
|
||||||
- `std`: abreviatura de "estandar"
|
|
||||||
- `import`: "importar"
|
|
||||||
- `pub`: abreviatura de "público", que es accesible
|
|
||||||
- `fn`: abreviatura de "función". en este artículo les llamé
|
|
||||||
invocaciones
|
|
||||||
- `void`: "vacio"
|
|
||||||
- `main`: "principal"
|
|
||||||
- `debug`: el debugging es un proceso mediante el cual
|
|
||||||
se eliminan errores (tambien conocidos como "bugs")
|
|
||||||
- `print`: "imprimir"
|
|
||||||
|
|
||||||
|
|
||||||
|
Y también notarás que aparecieron 2 carpetas nuevas: `.zig-cache`
|
||||||
|
y `zig-out`. Ignóralas.
|
||||||
|
|
||||||
|
Y listo! Has ejecutado el proyecto!
|
||||||
|
|
||||||
|
En el siguiente artículo empezaremos a escribir nuestro propio
|
||||||
|
código, y a descifrar cada una de las partes que tiene Zig.
|
||||||
|
|
||||||
|
También, en el futuro voy a decir constantemente "Ejecuta el
|
||||||
|
código" o "Ejecuta el programa". Esto significa ir al terminal
|
||||||
|
y ejecutar el comando `zig build run`,
|
||||||
|
como lo acabas de hacer.
|
||||||
|
|
||||||
|
|||||||
@ -1,174 +1,141 @@
|
|||||||
---
|
---
|
||||||
layout: ../../../layouts/BlogLayoutEs.astro
|
layout: ../../../layouts/BlogLayoutEs.astro
|
||||||
title: "05: Cero a Zig: Instalando VSCode y Zig"
|
title: "Cero a Zig 05: Hola mundo"
|
||||||
description: |
|
description: |
|
||||||
Instalamos Zig y VSCode en nuestro computador
|
Escribimos nuestro primer programa: Hola mundo!
|
||||||
pubDate: "2024-08-08"
|
pubDate: "2024-07-19"
|
||||||
tags: ["tech", "lenguajes", "intro", "tutorial", "zig", "VSCode"]
|
tags: ["tech", "lenguajes", "intro", "tutorial", "zig"]
|
||||||
image:
|
image:
|
||||||
url: ""
|
url: ""
|
||||||
alt: ""
|
alt: ""
|
||||||
caption: ""
|
caption: ""
|
||||||
---
|
---
|
||||||
|
|
||||||
En este artículo vamos a instalar 2 cosas en nuestro computador:
|
|
||||||
[Zig](https://ziglang.org/) y
|
|
||||||
[Visual Studio Code](https://code.visualstudio.com/).
|
|
||||||
|
|
||||||
En los artículos anteriores habíamos escrito nuestro código en
|
En este artículo vamos a escribir nuestro primer programa: Hola mundo. Vamos a
|
||||||
una página web. Sin embargo, lo mejor es escribir el código
|
modificarlo y entender algunos otros conceptos.
|
||||||
(programar) y ejecutarlo en nuestro computador.
|
|
||||||
|
|
||||||
Ya que este es un tutorial básico de programación, asumo que
|
## Hola mundo
|
||||||
estas utilizando Windows. Yo usaré Windows 10, pero las instrucciones
|
|
||||||
funcionan igual en Windows 11.
|
|
||||||
|
|
||||||
|
Hola mundo es tradicionalmente el [primer programa](https://es.wikipedia.org/wiki/Hola_mundo)
|
||||||
|
que se escribe cuando se aprende a programar.
|
||||||
|
|
||||||
## Descargar e instalar VSCode
|
Vamos a empezar con este programa. Entra a la siguiente página web:
|
||||||
|
[https://zig.fly.dev/p/xNluereqmgW](https://zig.fly.dev/p/xNluereqmgW)
|
||||||
|
|
||||||
Si sabes como instalar un programa y no necesitas instrucciones
|
Veras lo siguiente:
|
||||||
paso a paso, saltate esta sección.
|
|
||||||
|
|
||||||
Primero busca `VSCode` en Google, y entra a la primera página que
|
|
||||||
sale.
|
|
||||||
|
|
||||||
|
Arriba está el nombre de la página: "Zig Playground". A su derecha hay 3 botones en inglés:
|
||||||
|
|
||||||
Una vez en la página descarga VSCode con el boton grande y azul.
|
- "Run" ejecuta el programa.
|
||||||
|
- "Format" hace algo llamado 'formatear' el código. No lo usaremos aún.
|
||||||
|
- "Share" comparte el código que escribimos. No lo usaremos.
|
||||||
|
|
||||||
|
Dentro del recuadro plomo está escrito el código **Zig**. No lo modifiques aún.
|
||||||
|
|
||||||
Se abrirá una nueva ventana en la esquina superior derecha.
|
Si lo modificaste y quieres volver al código original, cierra la página y vuelve a
|
||||||
Cuando termine de descargarse, ábrelo haciendole click.
|
abrirla con el link de arriba.
|
||||||
|
|
||||||
|
## Ejecutando el código
|
||||||
|
|
||||||
|
Presiona el boton "Run". Aparecerá texto debajo del recuadro del código:
|
||||||
|
|
||||||
Se abrirá una nueva ventana. Primero selecciona
|
|
||||||
"Acepto el acuerdo" y despues presiona el boton "Siguiente".
|
|
||||||
|
|
||||||
|
Este texto es el resultado de ejecutar el programa. Se lee:
|
||||||
|
|
||||||
Volveran a salir nuevas ventanas. Presiona "Siguiente" en todas.
|
- `Hola mundo!` : Este es el resultado del programa.
|
||||||
|
- `Program exited.` : Significa "El programa terminó" en ingles. Nos
|
||||||
|
indica que el programa terminó de ejecutarse. Puedes ignorarlo.
|
||||||
|
|
||||||
|
Felicidades! Has ejecutado tu primer programa.
|
||||||
|
|
||||||
Cuando salga "Instalar" en vez de "Siguiente", presionalo.
|
> Desafio: Borra todo el código y vuelve a escribirlo, exactamente igual.
|
||||||
|
Utiliza la imágen como guía.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Finalmente, saldrá una última ventana. Presiona "Finalizar"
|
## ¿Qué significan todas estas letras?
|
||||||
y se abrirá VSCode.
|
|
||||||
|
|
||||||
|
Como verás, hay un monton de palabras y símbolos con colorcitos.
|
||||||
|
Este es el código, es como un lenguaje especial utilizado
|
||||||
|
para comunicarse con el computador.
|
||||||
|
|
||||||
También puedes abrir VSCode desde el menú de inicio de
|
Así como el francés, árabe o coreano, el **lenguaje** de programación Zig
|
||||||
Windows.
|
tiene un conjunto de reglas. Aprenderemos las reglas a medida que avance
|
||||||
|
el tiempo. Mientras tanto, puedes ignorar todas esas palabras.
|
||||||
|
|
||||||
|
> ¿Que pasa si eliminas alguna de esas palabras y ejecutas el programa
|
||||||
|
(con el boton "Run")? ¿Qué mensaje obtienes? ¿Qué crees que significa?
|
||||||
|
|
||||||
|
|
||||||
|
## Magia negra y abstracción
|
||||||
|
|
||||||
## Introducción a VSCode
|
Según [Significados.com](https://www.significados.com/abstracto/),
|
||||||
|
abstracto significa vago, impreciso, teórico, que no tiene existencia
|
||||||
|
física (entre otras cosas). Algo abstracto suele ser algo difícil
|
||||||
|
de entender, o imaginario.
|
||||||
|
|
||||||
VSCode es un "IDE", un programa que trae muchas funciones
|
|
||||||
útiles a la hora de programar. Lo vamos a utilizar a partir
|
|
||||||
de ahora para aprender a programar en Zig.
|
|
||||||
|
|
||||||
La primera vez que se abre VSCode se ve así:
|
En programación, abstracto tiene otro significado. Puedes buscar su
|
||||||
|
definición técnica en internet, pero me parece muy confusa para
|
||||||
|
un principiante, así que lo explicare en mis términos.
|
||||||
|
|
||||||
|
En programación, abstracto significa que sabemos **qué** hace, pero
|
||||||
|
no **cómo** lo hace. Un ejemplo claro sería un auto. Sabemos que
|
||||||
|
al pisar el acelerador, el auto avanza. Pero no sabemos **cómo**
|
||||||
|
pisar el acelerador ocasiona que el combustible se transforme en
|
||||||
|
energía cinemática.
|
||||||
|
|
||||||
Hay un monton de botones y divisiones. No te preocupes en
|
Por ejemplo, voy a hablar más adelante de "imprimir" en el programa.
|
||||||
entenderlo todo ahora mismo.
|
Imprimir significa mostrar un mensaje en la pantalla. Sin embargo,
|
||||||
|
no te voy a explicar cómo funciona la impresión. El concepto de
|
||||||
|
"imprimir" es abstracto.
|
||||||
|
|
||||||
Notarás que el programa está en inglés. Ahora te mostraré
|
### Magia negra
|
||||||
cómo ponerlo en español.
|
|
||||||
|
|
||||||
### Cambiar idioma a español
|
Escuché este termino del canal de Youtube Imesi.net. Magia negra
|
||||||
|
es algo que: no se qué hace, cómo funciona, ni tampoco me importa.
|
||||||
|
|
||||||
A la izquierda arriba hay una serie de botones. Presiona el último,
|
Voy a utilizar el término "magia negra" para referirme a algo
|
||||||
que tiene unos cuadros.
|
por lo que no necesitas preocuparte, o intentar entender. Por
|
||||||
|
ejemplo, en el código de más arriba:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Esto abre una pestaña donde podemos buscar "Extensiones".
|
Todo el texto que dice:
|
||||||
Las extensiones agregan características a VSCode.
|
|
||||||
|
|
||||||
Primero vamos a instalar el idioma español. En la barra de búsqueda
|
```zig
|
||||||
escribe "español":
|
const std = @import("std")
|
||||||
|
|
||||||
|
pub fn main() {
|
||||||
|
std.debug.print();
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
Y presiona el botón azul "Install" del primer item de la lista
|
es magia negra. Funciona, hace algo, pero no importa. No te
|
||||||
que dice "Spanish":
|
preocupes en intentar entenderlo.
|
||||||
|
|
||||||
|
Eventualmente, y a medida que aprendas conceptos nuevos,
|
||||||
|
entenderas qué significan esas cosas.
|
||||||
|
|
||||||
Luego de eso, abajo a la derecha saldrá un mensaje.
|
|
||||||
Presiona el botón azul:
|
|
||||||
|
|
||||||
|
## Inglés
|
||||||
|
|
||||||
El programa se reiniciará, y ahora estará en español.
|
Como habras visto, prácticamente todo el código está en inglés.
|
||||||
|
Si ya sabes ingles, o lo estas aprendiendo, no tendrás muchos
|
||||||
|
problemas continuando.
|
||||||
|
|
||||||
Ahora vamos a instalar la extensión de Zig.
|
En mi opinion, programar sin saber inglés es contraproducente.
|
||||||
|
Los lenguajes de programación (en su mayoría) se escriben en
|
||||||
|
inglés, las mnemotécnicas están en inglés, y mucha información
|
||||||
|
útil e importante está en inglés. Programar sin saber inglés
|
||||||
|
es sumamente difícil.
|
||||||
|
|
||||||
|
Seguramente aprenderás algunas palabras a lo largo del tutorial,
|
||||||
|
pero lo mejor que podrías hacer es aprender inglés.
|
||||||
|
|
||||||
### Instalar la extensión de Zig
|
|
||||||
|
|
||||||
Regresa a la pestaña de extensiones:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Y busca "Zig". Instala la extensión que se llama
|
|
||||||
"Zig Language" y dice "ziglang":
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Cuando se haya instalado puedes cerrar la pestaña:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Y volver al inicio:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## Instalar Zig
|
|
||||||
|
|
||||||
Hemos instalado la extensión de Zig, ahora instalaremos algo
|
|
||||||
llamado "Compilador".
|
|
||||||
|
|
||||||
Presiona `Control + Shift + P`, se abrirá una ventana arriba
|
|
||||||
en el centro:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
En la barra de busqueda escribe `Zig`, y presiona el botón
|
|
||||||
`Zig Setup: Install Zig`:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
En el dialogo que sale, presiona "Install".
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Saldrá una nueva ventana, donde hay que escoger una versión.
|
|
||||||
Elije la versión debajo de `nightly`. Al momento de escribir
|
|
||||||
esto es `0.13.0`.
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Saldrá una nueva ventana, presiona "Install".
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Y selecciona la misma versión de antes. En mi caso, `0.13.0`.
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Con eso terminamos. Hemos instalado Zig en nuestro computador.
|
|
||||||
En el siguiente artículo utilizaremos estas herramientas.
|
|
||||||
|
|
||||||
|
|||||||
@ -1,209 +1,171 @@
|
|||||||
---
|
---
|
||||||
layout: ../../../layouts/BlogLayoutEs.astro
|
layout: ../../../layouts/BlogLayoutEs.astro
|
||||||
title: "06: Cero a Zig: Terminal y Proyecto Zig"
|
title: "Cero a Zig 06: Modificando el hola mundo"
|
||||||
description: |
|
description: |
|
||||||
Veremos el terminal y cómo crear/ejecutar un proyecto de Zig
|
Impresión, strings/cadenas y stdout.
|
||||||
pubDate: "2024-08-09"
|
pubDate: "2024-07-30"
|
||||||
tags: ["tech", "lenguajes", "intro", "tutorial", "zig", "VSCode"]
|
tags: ["tech", "lenguajes", "intro", "tutorial", "zig"]
|
||||||
image:
|
image:
|
||||||
url: "/vid/hacker.webp"
|
url: ""
|
||||||
alt: ""
|
alt: ""
|
||||||
caption: ""
|
caption: ""
|
||||||
---
|
---
|
||||||
|
|
||||||
Seguramente has visto imágenes/videos de hackers antes,
|
En el artículo anterior escribimos nuestro primer programa:
|
||||||
escribiendo en una pantalla negra con letras verdes.
|
Hola mundo. En este artículos vamos a modificar el mensaje
|
||||||
Ahora tu también, podras escribir en una pantalla negra
|
y aprender el primer concepto: Strings
|
||||||
(pero sin letras verdes).
|
|
||||||
|
|
||||||
En este artículo veremos el terminal, crearemos un proyecto
|
|
||||||
de Zig en nuestro computador, y lo ejecutaremos.
|
|
||||||
|
|
||||||
En el artículo anterior ya instalamos VSCode y Zig, así que a partir
|
## Modificando "Hola mundo"
|
||||||
de ahora me referiré a ellos.
|
|
||||||
|
|
||||||
|
Entra a la página web
|
||||||
|
[https://zig.fly.dev/p/xNluereqmgW](https://zig.fly.dev/p/xNluereqmgW),
|
||||||
|
donde se encuentra el programa "Hola mundo". Esta vez vamos a modificar
|
||||||
|
el mensaje.
|
||||||
|
|
||||||
## El terminal
|
El resto de las palabras son magia negra. Te habras dado cuenta que
|
||||||
|
hay palabras en español: Hola y mundo.
|
||||||
|
|
||||||
[El/la terminal](https://en.wikipedia.org/wiki/Command-line_interface)
|
|
||||||
es una forma de interactuar con nuestro computador, y se utiliza
|
|
||||||
muchisimo en programación.
|
|
||||||
|
|
||||||
En el terminal escribimos comandos, el computador los ejecuta,
|
Hay varias cosas que notar:
|
||||||
y nos responde. En cierto modo es como una versión mini de la
|
|
||||||
programación.
|
|
||||||
|
|
||||||
Dentro de VSCode, en los menus de arriba a la izquierda, selecciona
|
- Estan pintadas de color amarillo
|
||||||
los 3 puntos, `Terminal`, `Nuevo Terminal`:
|
- Tienen comillas dobles `"` al inicio y al final
|
||||||
|
|
||||||
|
Dentro de estas comillas `"` podemos escribir el texto que querramos.
|
||||||
|
|
||||||
Aparecerá una nueva ventana en blanco abajo:
|
Por ejemplo, si reemplazas `Hola` por `Adios` y ejecutas el programa,
|
||||||
|
se imprimirá `Adios mundo!`
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Este es nuestro terminal. Aquí escribiremos algunos comandos
|
|
||||||
para crear un "proyecto" y "ejecutarlo".
|
|
||||||
|
|
||||||
|
Y también, si reemplazas `mundo` por otra palabra, se imprimirá
|
||||||
|
lo que escribiste.
|
||||||
|
|
||||||
## Creando un proyecto de Zig
|
Tambien puedes agregar otro texto en ambos lados. Por ejemplo:
|
||||||
|
|
||||||
Un proyecto es una carpeta con una serie de archivos,
|
|
||||||
en los cuales programaremos nuestro programa.
|
|
||||||
|
|
||||||
Haz click en en el terminal y escribe `mkdir tutorial`
|
|
||||||
|
|
||||||
|
## Strings / cadenas de caracteres
|
||||||
|
|
||||||
`mkdir` es el "comando" que ejecutará la computadora,
|
Los strings (cadenas de caracteres en inglés) son la forma
|
||||||
y `tutorial` es un "argumento" que recibe el comando.
|
en la que almacenamos texto.
|
||||||
|
|
||||||
`mkdir` viene del inglés "make directory", y crea una
|
Un string empieza con una comilla doble `"`, el contenido
|
||||||
carpeta nueva. En este caso estamos creando una carpeta
|
del string, y termina con una comilla doble `"`.
|
||||||
llamada `tutorial`.
|
|
||||||
|
|
||||||
Presiona enter para ejecutar el comando.
|
Unos ejemplos de strings son: `"hola"`, `"adios"`,
|
||||||
|
`"multiples palabras"`, `"123456"`.
|
||||||
|
|
||||||
|
En el programa de arriba hay 2 strings:
|
||||||
|
|
||||||
En el terminal veremos siempre:
|
|
||||||
|
|
||||||
1. (1) La carpeta en donde estamos
|
Estos strings son lo que se muestra en pantalla al
|
||||||
2. (2) El comando que escribimos
|
ejecutar el programa.
|
||||||
|
|
||||||
Algunos comandos tienen una "respuesta". En la imágen
|
Los strings tienen algunas características:
|
||||||
de arriba la respuesta es una confirmación de la carpeta
|
|
||||||
que creamos.
|
|
||||||
|
|
||||||
Ahora vamos a ejecutar otro comando: `cd tutorial`
|
- En el código, los strings tienen otro color para que
|
||||||
|
sea más fácil identificarlos.
|
||||||
|
- No puede haber comillas dentro de un string.
|
||||||
|
|
||||||
|
El string termina cuando aparece la primera comilla.
|
||||||
|
Por ejemplo:
|
||||||
|
|
||||||
`cd` es una abreviación de "change directory", que
|
|
||||||
significa cambiar de carpeta. Usando este comando cambiamos
|
|
||||||
la carpeta en la que estamos.
|
|
||||||
|
|
||||||
Ahora vamos a crear el proyecto de Zig, con el comando
|
Aquí el string termina despues del `Hola `, la palabra
|
||||||
`zig init`:
|
`familia` no es parte del string. Puedes ver que el
|
||||||
|
color amarillo del string termina en la segunda comilla,
|
||||||
|
y la palabra familia está de color blanco.
|
||||||
|
|
||||||
|
- No puede haber nuevas lineas en un string. Esto es un error:
|
||||||
|
|
||||||
El comando `zig` nos permite realizar varias acciones,
|
|
||||||
que veremos con el tiempo.
|
|
||||||
|
|
||||||
Al ejecutar `zig init` creamos un proyecto nuevo en
|
Sin embargo, hay ocasiones donde queremos tener varias lineas
|
||||||
la carpeta actual. Esto crea una serie de archivos
|
en un string. Para esto se utilizan 2 caracteres especiales:
|
||||||
y carpeta, que ahora abriremos.
|
`\n`. Estos nos permiten "señalar" que ahí va una linea nueva.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## Abriendo el proyecto
|
Estos caracteres especiales se conocen como "caracteres de escape".
|
||||||
|
Hay varios de ellos, pero no los veremos por ahora.
|
||||||
|
|
||||||
Dentro de VSCode, presionamos el boton "Abrir carpeta".
|
|
||||||
|
|
||||||
|
## Impresión
|
||||||
|
|
||||||
Si no puedes ver este boton, asegurate de estar en la primera pestaña:
|
Imprimir es mostrar información a través de la pantalla. Esta
|
||||||
|
información puede ser palabras, letras, números, símbolos, etc.
|
||||||
|
|
||||||
|
Para imprimir en Zig se escribe lo siguiente:
|
||||||
|
|
||||||
Aquí seleccionamos la carpeta `tutorial`. Esta es la carpeta que
|
|
||||||
acabamos de crear en el terminal.
|
|
||||||
|
|
||||||
|
`std.debug.print` es una invocación que imprime lo que tenga
|
||||||
|
dentro. Para poner algo dentro, se utilizan parentesis `()`.
|
||||||
|
|
||||||
Nos saldrá el mensaje de la imagen de abajo. Selecciona "Confiar en
|
Dentro de los paréntesis va el string que queremos imprimir
|
||||||
los autores..." y presiona "Si, confio en los autores".
|
y una secuencia misteriosa, así: `("Tu mensaje", .{})`.
|
||||||
|
|
||||||
|
Y finalmente, muy importante, todas las invocaciones
|
||||||
|
terminan con un punto y coma `;`. Si la invocación
|
||||||
|
no termina con su punto y coma tendrás un error misterioso.
|
||||||
|
|
||||||
Ahora veras que en vez del boton "Abrir carpeta" ahora hay una
|
Por ejemplo, para imprimir un nuevo texto `Me gusta Zig`
|
||||||
serie de archivos.
|
se escribiriá el código así:
|
||||||
|
|
||||||
|
`std.debug.print("Me gusta Zig", .{});`
|
||||||
|
|
||||||
Este es nuestro proyecto. Aquí es donde estarán todos los archivos
|
Podemos tener varias invocaciones a la vez, y ejecutarlas en
|
||||||
que usaremos.
|
siempre que la invocación esté bien escrita.
|
||||||
|
|
||||||
- Carpeta `src`: Contiene el código que ejecutaremos
|
|
||||||
- `build.zig`: Archivo mágico. Es mejor no tocarlo.
|
|
||||||
- `build.zig.zon`: Archivo mágico. Es mejor no tocarlo.
|
|
||||||
|
|
||||||
Haz click en la carpeta `src` y en el archivo `main.zig`:
|
Y al ejecutar el programa se imprimiran los mensajes en orden.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Este es el archivo donde trabajemos por el resto de la serie.
|
|
||||||
|
|
||||||
|
## Nuevas lineas
|
||||||
|
|
||||||
Veras que hay un monton de código raro, que aun no sabemos qué
|
Notarás que el mensaje se imprimió junto: `Mi primera impresiónMe gusta Zig`.
|
||||||
significa. Por ahora lo vamos a dejar así.
|
|
||||||
|
|
||||||
|
Este es un buen momento para presentar un concepto muy importante:
|
||||||
|
la computadora hace lo que le pides, no lo que quieres.
|
||||||
|
|
||||||
## Ejecutando el proyecto
|
El código que ejecutamos no le pide a la computadora que imprima
|
||||||
|
una nueva linea `\n`. Así que la computadora no la imprime.
|
||||||
|
|
||||||
Ahora que instalamos Zig en nuestro computador, tenemos que ejecutar
|
Para tener una nueva linea hay que incluirla en los strings, y con
|
||||||
el programa en nuestro computador. Eso lo haremos desde el terminal.
|
eso al ejecutar estará cada linea separada:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Ve al terminal y ejecuta `zig build run`. Veras un monton de texto
|
|
||||||
raro, pero al final debería quedar así:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Y también notarás que aparecieron 2 carpetas nuevas: `.zig-cache`
|
## Glosario
|
||||||
y `zig-out`. Ignóralas.
|
|
||||||
|
|
||||||
Has ejecutado el proyecto! Ahora vamos a hacerlo con nuestro propio código.
|
No es necesario que memorices o entiendas estas palabras.
|
||||||
|
|
||||||
|
- String: "cadena de caracteres"
|
||||||
## Reemplazando el código
|
- `const`: abreviatura de "constante", que no cambia
|
||||||
|
- `std`: abreviatura de "estandar"
|
||||||
En artículos anteriores vimos un programa llamado "Hola mundo":
|
- `import`: "importar"
|
||||||
|
- `pub`: abreviatura de "público", que es accesible
|
||||||
```zig
|
- `fn`: abreviatura de "función". en este artículo les llamé
|
||||||
const std = @import("std");
|
invocaciones
|
||||||
|
- `void`: "vacio"
|
||||||
pub fn main() !void {
|
- `main`: "principal"
|
||||||
std.debug.print("Hola mundo!", .{});
|
- `debug`: el debugging es un proceso mediante el cual
|
||||||
}
|
se eliminan errores (tambien conocidos como "bugs")
|
||||||
```
|
- `print`: "imprimir"
|
||||||
|
|
||||||
Ahora vamos a ejecutarlo en nuestro computador, en vez de
|
|
||||||
la página web.
|
|
||||||
|
|
||||||
Entra a `src/main.zig` y reemplaza todo el código que está ahí
|
|
||||||
por el código de arriba.
|
|
||||||
|
|
||||||
> Nota: Puede que notes que las imágenes no sean exáctamente
|
|
||||||
iguales a como cuando tu escribas el código.
|
|
||||||
No te preocupes, no es un problema.
|
|
||||||
|
|
||||||
Una vez que hayas modificado el código, verás un punto blanco arriba:
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Esto significa que el archivo está modificado, pero no guardado.
|
|
||||||
Presiona `Control + S` para guardar el archivo.
|
|
||||||
|
|
||||||
Ahora, ejecuta el código: Ve al terminal y ejecuta el comando
|
|
||||||
`zig build run`:
|
|
||||||
|
|
||||||
> Nota: Verás que mi terminal se ve diferente. Pero lo importante
|
|
||||||
son los comandos, y el resultado.
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
El resultado sale abajo: `Hola mundo!`.
|
|
||||||
|
|
||||||
|
|
||||||
## Siguentes pasos
|
|
||||||
|
|
||||||
Ya estamos listos para seguir aprendiendo Zig.
|
|
||||||
|
|
||||||
Ahora intenta ejecutar los programas que escribimos
|
|
||||||
antes en VSCode. Copia y pega el código, o aún mejor,
|
|
||||||
escríbelo tú mismo.
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
---
|
---
|
||||||
layout: ../../../layouts/BlogLayoutEs.astro
|
layout: ../../../layouts/BlogLayoutEs.astro
|
||||||
title: "07: Cero a Zig - Impresión con formatos"
|
title: "Cero a Zig 07: Impresión con formatos"
|
||||||
description: |
|
description: |
|
||||||
Imprimiendo información adicional.
|
Imprimiendo información adicional.
|
||||||
pubDate: "2024-08-10"
|
pubDate: "2024-08-10"
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
---
|
---
|
||||||
layout: ../../../layouts/BlogLayoutEs.astro
|
layout: ../../../layouts/BlogLayoutEs.astro
|
||||||
title: "08: Cero a Zig - Variables"
|
title: "Cero a Zig 08: Variables"
|
||||||
description: |
|
description: |
|
||||||
Introducción a las variables
|
Introducción a las variables
|
||||||
pubDate: "2024-08-11"
|
pubDate: "2024-08-11"
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
---
|
---
|
||||||
layout: ../../../layouts/BlogLayoutEs.astro
|
layout: ../../../layouts/BlogLayoutEs.astro
|
||||||
title: "09: Cero a Zig - Comentarios y Números"
|
title: "Cero a Zig 09: Comentarios y Números"
|
||||||
description: |
|
description: |
|
||||||
Comentarios, números y operaciones matemáticas
|
Comentarios, números y operaciones matemáticas
|
||||||
pubDate: "2024-08-17"
|
pubDate: "2024-08-17"
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user