DEV Community: Manuel Ortega Carcamo

Iniciando con typeOrm para Nodejs

Manuel Ortega Carcamo — Sun, 16 May 2021 18:40:21 +0000

¿Qué es SQL TypeOrm?

TypeORM es un Object-Relational Mapper / Mapping-tool, o un ORM, es decir una librería que los desarrolladores utilizan para crear bases de datos y manipular sus datos sin la necesidad de conocer / usar SQL.

¿Porqué usar un ORM?

Los ORM han ganado popularidad debido a que lidiar con el lenguaje SQL directamente requiere de mucho esfuerzo en la mayoría de los casos. El objetivo del ORM entonces es simplificar la mantención de tus datos.

Básicamente, con un ORM no tendrás que escribir SQL otra vez (95% del tiempo) y podrás trabajar con objetos.

Por ejemplo:

Para insertar un usuario con SQL tienes que escribir:

INSERT INTO user (name, last_name) VALUES ('Juan', 'McDonals');

Con un ORM tu código sigue siendo un código familiar como este:

user = User()
user.name = 'Juan'
user.last_name = 'McDonals'

# agrega el user a la base de datos
user.save();

Basta con que digas: user.save() y todo lo que hayas hecho con tu código se traducirá a código de lenguaje SQL.

Decoradores

TypeOrm utiliza el patrón de diseño llamado decorador para modificar el comportamiento de una clase. Estos decoradores nos sirven para definir los elementos de un modelo, como crear una columna, definir si tiene una llave primaria,etc.

Para construir nuestro modelo utilizaremos los siguientes decoradores que nos proporciona typeOrm.

@Entity(): Al usar este decorador, se crea una clase que asigna a una tabla de base de datos.
@PrimaryGeneratedColumn() :Indica que la columna es Primary Key y que su valor debe ser autoincrementado. Es posible pasarle un parámetro (‘uuid’) que hace que los valores de esta columna sean cadenas de texto aleatorios en lugar de números enteros secuenciales.
@Column(): Una columna común y corriente de la base de datos. Podemos especificar varios parámetros como el tipo (varchar, int, tinyint, decimal), si es obligatoria (nullable: true | false), la longitud máxima (length: int) y muchas cosas más.
Ver Documentación
@CreateDateColumn() y @UpdateDateColumn(): Son decoradores especiales que indican que el valor de estas columnas se asigna automáticamente al crear un nuevo registro o al actualizar uno ya existente respectivamente.

Revisemos las operaciones de base de datos más típica

Creando nuestra base de datos

El primer paso sería definir nuestro modelo

@Entity()
export class Users extends BaseEntity{
  @PrimaryGeneratedColumn()
  id: number;

  @Column()
  first_name: string;

  @Column()
  last_name: string;

  @Column({unique: true})
  email: string;

  @Column()
  password: string;

}

INSERT: Insertando un registro en la base de datos


    const usersRepo = getRepository(User);
    const user = usersRepo.create(req.body as ObjectLiteral);  //Creo un usuario

    const result = await usersRepo.save(user); //Grabo el nuevo usuario

SELECT: Buscando o recuperando registros

Hay 2 formas para devolver data de la base de datos:

    1. Buscar/Recuperar/Devolver todo los registros desde un Table/Model en particular usando `getRepository(MyModel).find()`

2. Buscar/Recuperar/Devolver un solo registro basado en su primary key usando `getRepository(MyModel).findOne({campoBaseDatos: valorBuscado})`

# aqui es como se buscan todas las personas
const users = await getRepository(Users).find();

# aqui es como se busca un grupo de personas con name = alex
const users = await getRepository(Users).find("first_name":"alex");

# aquí es cómo se busca a una persona con id = 3 (solo funciona con las primary key)
const user = await getRepository(Users).findOne(req.params.id:"3");

DELETE: Eliminando un registro de la base de datos.

Todo lo que tiene que hacer es utilizar el método .delete() e indicar el ID del usuario a eliminar.

const users = await getRepository(Users).delete(ID_USER);

UDPATE: Actualizar un registro.

Para actualizar, primero necesitas devolver/seleccionar el registro de la base de datos, luego puedes actualizar la propiedad que desees y grabar.

    const user = await getRepository(Users).findOne(req.params.id); //Busco el usuario en la tabla por el ID recibido
    getRepository(Users).merge(user, req.body);  // Hace un merge de los datos existentes con los que se reciben a través de body
    const results = await getRepository(Users).save(user);  // Almacena el cambio en la base de datos

Relaciones

Uno a uno

En ingles one-to-one se utiliza el decorador @OneToOne,es una relación en la que A contiene una instancia de B y B contiene una instancias de A.

Por ejemplo, tomemos las entidades User y Profile. El usuario puede tener solo un perfil y un perfil es propiedad de un solo usuario.

import {Entity, PrimaryGeneratedColumn, Column} from "typeorm";

@Entity()
export class Profile {

    @PrimaryGeneratedColumn()
    id: number;

    @Column()
    gender: string;

    @Column()
    photo: string;

}
import {Entity, PrimaryGeneratedColumn, Column, OneToOne, JoinColumn} from "typeorm";
import {Profile} from "./Profile";

@Entity()
export class User {

    @PrimaryGeneratedColumn()
    id: number;

    @Column()
    name: string;

    @OneToOne(() => Profile)
    @JoinColumn()
    profile: Profile;

}

Para almacenar este tipo de relación: a continuación veremos un ejemplo donde se crean una instancia de Profile, luego se crea una instancia del usuario y Profile se asigna a la entidad User.

const profile = new Profile();
profile.gender = "male";
profile.photo = "me.jpg";
await connection.manager.save(profile);

const user = new User();
user.name = 'Joe Smith';
user.profile = profile;
await connection.manager.save(user);

Muchos a uno o uno a muchos

En ingles many-to-one donde se utiliza el decorador @ManyToOne o one-to-many que utiliza le decorador @OneToMany. Este tipo de relación definie que una entidad A contiene múltiples instancias de B, pero B contiene solo una instancia de A

En el siguiente ejemplo se define la entidad User que puede tener varios registros de la entidad Photo , pero cada foto es propiedad de un solo dueño.

import {Entity, PrimaryGeneratedColumn, Column, ManyToOne} from "typeorm";
import {User} from "./User";

@Entity()
export class Photo {

    @PrimaryGeneratedColumn()
    id: number;

    @Column()
    url: string;

    @ManyToOne(() => User, user => user.photos)
    user: User;

}
import {Entity, PrimaryGeneratedColumn, Column, OneToMany} from "typeorm";
import {Photo} from "./Photo";

@Entity()
export class User {

    @PrimaryGeneratedColumn()
    id: number;

    @Column()
    name: string;

        # aqui definimos la relación one-to-many y se especifica la relación con la entidad User
    @OneToMany(() => Photo, photo => photo.user)
    photos: Photo[];

}

Para almacenar este tipo de relación: a continuación veremos un ejemplo donde se crean las instancias de las fotos y luego se asignan como un array a la entidad User

const photo1 = new Photo();
photo1.url = "me.jpg";
await connection.manager.save(photo1);

const photo2 = new Photo();
photo2.url = "me-and-bears.jpg";
await connection.manager.save(photo2);

const user = new User();
user.name = "John";
user.photos = [photo1, photo2];
await connection.manager.save(user);

Muchos a muchos

En ingles Many-to-many se utiliza el decorador @ManyToMany,es una relación en la que A contiene varias instancias de B y B contiene varias instancias de A.

Un ejemplo es la relación existente entre una entidades Pregunta con otra Categoría. Una pregunta puede tener varias categorías y cada categoría puede tener varias preguntas.

import {Entity, PrimaryGeneratedColumn, Column} from "typeorm";

@Entity()
export class Category {

    @PrimaryGeneratedColumn()
    id: number;

    @Column()
    name: string;

}

@Entity()
export class Question {

    @PrimaryGeneratedColumn()
    id: number;

    @Column()
    title: string;

    @Column()
    text: string;

    @ManyToMany(() => Category, { 
            cascade: true 
        })

    @JoinTable()
    categories: Category[];

}

@JoinTable() se utiliza para definir la entidad propietaria en la relación. Ene ste ejemplo se debe utilizar el decorador @ManyToMany.

Para almacenar una relación @ManyToMany: a continuación veremos une ejemplo donde se crean las instancias de las categorías y luego se asignan como un array a la entidad Question

const category1 = new Category();
category1.name = "animals";
await connection.manager.save(category1);

const category2 = new Category();
category2.name = "zoo";
await connection.manager.save(category2);

const question = new Question();
question.title = "dogs";
question.text = "who let the dogs out?";
question.categories = [category1, category2];
await connection.manager.save(question);

Eliminar la una relación @ManyToMany:

Para eliminar una relación de varios a varios entre dos registros, elimínela del campo correspondiente y guarde el registro.

const question = getRepository(Question);
question.categories = question.categories.filter(category => {
    category.id !== categoryToRemove.id
})
await connection.manager.save(question)

¿Listo para empezar a codificar?

Hemos preparado este ejemplo de codificación en vivo que puede ejecutar tu mismo en Gitpod y utilizarlo como base para su proyecto.

Expressjs Rest Hello: https://github.com/4GeeksAcademy/expressjs-rest-hello

Construyendo APIs REST utilizando Expressjs

Manuel Ortega Carcamo — Sun, 18 Apr 2021 00:54:57 +0000

Si no sabes qué es una API REST, recomiendo leer sobre esto aquí.

A modo de breve resumen, construir una API de forma REST significa que tienes que construir sus endpoints de URL agrupados por "recursos". Un recurso es algo que quieres gestionar, por ejemplo: un estudiante, un usuario, un auto, etc. Un recurso es algo similar a una tabla de base de datos, pero los llamamos "recursos" debido a algunas excepciones.

Aquí hay un ejemplo de endpoints RESTful API para gestionar Estudiantes:

Método	URL	Descripción
GET	/estudiante	Debería devolver todos los estudiantes
GET	/estudiante/1	Debería devolver un solo estudiante con el id=1
GET	/cohort/1/estudiantes	Debería devolver todos los estudiantes de la clase con el id=1
POST	/estudiante	Debería crear un nuevo estudiante
PUT	/estudiante/1	Debería actualizar la información del estudiante con el id=1
DELETE	/estudiante/1	Debería eliminar al estudiante con el id=1

Echa un vistazo a las URL, ellas siguen un patrón. Después de un tiempo, los endpoints hablarán por sí mismos, tendrán sentido y podrás adivinar a lo que hacen o incluso adivinar algunos endpoints. Esa es la idea.

[[info]]
| ☝️ Puede leer más sobre las API REST en esta lección de BreatheCode.
Aquí hay un video de 8 minutos que explica REST: https://www.youtube.com/watch?v=7YcW25PHnAA

Ahora hablemos sobre Expressjs

Expressjs es librería que nos permite construir un servidor web API de una forma rápida, minimalista y flexible utilizando nodejs. El primer paso para utilizarla es realizando la instalación en tu proyecto, para esto en tu terminal debes ejecutar:

$ npm install express --save

Una vez finalizada la instalación podemos crearas un archivo server.js ya agregaremos las siguientes líneas, el computar comenzará a escuchar las solicitudes HTTP:

const express = require('express');
const app = express();

app.get('/', (req, res)=>{
    res.send("Hello World!")
})


app.listen(4000, function(){
    console.log('API en ejecución en el puerto 4000');
})

Haz clic para probar este código en vivo.

Expressjs Hello-Wold explicado

const express = require('express'); #aquí importamos la librería Expressjs en nuestro archivo.
const app = express(); #aquí creamos una nueva instancia del servidor Expressjs.

app.get('/', (req, res)=>{  #aquí definimos el primer path de la API: GET /
    res.send("Hello World!")  #expressjs devolverá "Hello World, esto podría ser un string HTML o un string JSON.
})


app.listen(4000, function(){  #finalmente iniciamos el servidor en el localhost.
    console.log('API en ejecución en el puerto 4000');
})

En Expressjs podemos agregar nuevos endpoints utilizando la variable app que es la instancia que definimos de expressjs y agregando el método http donde se encontrará disponible nuestro endpoint app.get('/', (req, res)=>{}, como puedes ver tendremos una función de devolución de llamada que recibirá 2 parámetros req, res. El detalle de estos parámetros es el siguiente:

req : Es un objeto que representa la solicitud HTTP y nos entrega información del request como el body, query params, HTTP headers.
res : Es un objeto que representa la respuesta HTTP que envía la aplicación Express cuando recibe una solicitud HTTP

En el siguiente link puedes acceder a la documentación de (Expressjs)[http://expressjs.com/es/api.html]

Agregando nuevos endpoints

Si deseas agregar otro endpoint a tu API que se ejecuta cuando un cliente haga el GET/person, tendrás que agregar otro bloque de código como este:

app.get('/', (req, res)=>{  #aquí definimos el primer path de la API: GET /
    res.send("Hello World!")  #expressjs devolverá "Hello World, esto podría ser un string HTML o un string JSON.
})

Especificando el método: GET, PUT, POST, DELETE

Si deseas que tu endpoint responda a POST, PUT o DELETE, puedes especificarlo de la siguiente manera:

const express = require('express');
const app = express();

app.get('/', (req, res)=>{  #aquí definimos el primer path de la API: GET /
    res.send("Se recibió un GET")
})

app.post('/', (req, res)=>{  #aquí definimos el primer path de la API: POST /
    res.send("Se recibió un POST")
})

app.listen(4000, function(){  #finalmente iniciamos el servidor en el localhost.
    console.log('API en ejecución en el puerto 4000');
})

Respondiendo un cuerpo JSON

La respuesta puede ser básicamente lo que quieras siempre que sea un string: HTML, JSON, CSS, imágenes, etc. Solo asegúrate de convertir en string lo que quieras responder.

En el siguiente ejemplo, estamos utilizando el método JSON.stringify para convertir un objeto llamado person1 en en un string JSON antes de devolverlo al cliente.

const express = require('express');
app.get('/person', (req, res)=>{
    const person1 = {
        "name": "Bob"
    }
    res.status(200).json(person1);
})

El código de respuesta

El código de respuesta es 200 por defecto, y 500 si hay un error desconocido. Si deseas responder al cliente con un código diferente, deberás especificarlo así:

const express = require('express');
app.get('/person', (req, res)=>{
    const contenido = {
      "detalles": "Hubo un error en la solicitud"
    }
    res.status(400).json(contenido); # aquí cambiamos el código de estado a 400 (código muy común en caso de errores de solicitud)
})

Manejo de errores y validaciones

Pero ¿y si la solicitud viene con errores? Por ejemplo: si tenemos un endpoint para crear una persona y debemos especificar el first_name Y el last_name, pero solo se encontró el first_name en la solicitud, así es como lo validaríamos:

const express = require('express');

app.use(express.json()) // Permite parsear el contenido en un tipo application/json
app.use(express.urlencoded({ extended: true })) // Permite parsear el contenido en un tipo application/x-www-form-urlencoded


app.post('/person', (req, res) => {
    const { body } = req; 

    if (!body) {
        return res.status(400).json({ message: "The request body is null" });
    }

    if (!body.hasOwnProperty('first_name')) {
        return res.status(400).json({ message: "The request first_name is null" });
    }

    if (!body.hasOwnProperty('last_name')) {
        return res.status(400).json({ message: "The request last_name is null" });
    }

    return res.status(400).json(body);
})

La librería express-validator nos entrega una forma más cómoda para el manejo de las validaciones, pueden obtener más información de como usarla visitando su documentación https://express-validator

Midlewares

Un midleware es una función que tiene acceso al objeto de solicitud o request, al objeto de respuesta o response y a la siguiente función de midleware a ejecutarse en el ciclo de solictud/respuesta. Una vez que nuestro midleware termine su ejecución es importante ejecutar la función next() o la solicitud quedara colgada.

A continuación un ejemplo de un midleware que imprimirá por consola la fecha y hora en la que ocurren las consultas a la API

const express = require('express');

app.use(function (req, res, next) {
  console.log('Time:', Date.now());
  next();  # aquí invoca al siguiente midleware
});

¿Qué es Typescript?

Manuel Ortega Carcamo — Thu, 01 Apr 2021 19:14:53 +0000

Javascript es un lenguaje que tiene un tipado débil, esto quiere decir que las variables son declaradas sin un tipo y dependiendo del valor que se asigne es el tipo de dato que asume la variable. Podemos modificar, operar y comparar los los valores entre ellos sin que tengamos que hacer una conversión previa.

En el siguiente ejemplo podemos ver como cambiamos el tipo de datos sin algún tipo de conversión:


let name = "Aprendiendo Javascript"
console.log(typeof name)
// "string"

name = 33
console.log(typeof name)
// "number"

¿Qué es typeScript?

Typescript es un lenguaje de programación que agregar nuevas funcionalidades a Javascript, esto es conocido como un superset. Un superset se escribe tomando como base otro lenguaje de programación aplicando mejoras en el lenguaje original. Por esta razón Typescript se escribió sobre javascript para agregar nuevas funcionalidades que veres más adelante.

Typescript es la solución a muchos de los problemas de JavaScript, está pensado para el desarrollo de aplicaciones robustas, implementando características en el lenguaje que nos permitan desarrollar herramientas más avanzadas para el desarrollo de aplicaciones.

Tipado estático

El tipado estático define que :

Las variables tienen un solo tipo de datos
Los valores asignados a las variables deben tener el mismo tipo que la variable.

En el siguiente ejemplo se está declarando la variable message del tipo string. El valor que asignaremos a nuestra variable debe ser del mismo tipo, por esta razón se asigna el string Conociendo TypeScript

let message: string;
message: 'Conociendo TypeScript';

Tipos de Datos en TypeScript

Las variables pueden tener diferentes tipos de valores, a continuación detallaremos como podemos definir cada tipo usando TypesCript:

Boolean: Solo acepta valores: Verdadero o Falso

let isExist:boolean =  true

String: Cualquier serie de caracteres

let message:string = "Conociendo TypeScript"

Number: Solo acepta números

let age:number = 33

null: Acepta valores indefinidos o vacíos

let isNotExist:null = null

Array: Una lista con un tipo de dato.

let arrayNumber:Array<number> = [1, 2, 3, 4]
let arrayNumber:Array<string> = ["uno", "dos", "tres", "cuatro"]

Tuplas: Acepta una lista con tipos de datos predefinidos.

let arraytupla: = [number, string, number]
arraytupla = [23, 'Hello World', true]

Void: Se utiliza para indicar que no tenemos un tipo de datos definido

let notDataType:void = undefined

Enum: Permite definir posibles valores que pueden ser asignados a la variable

enum Animals {cat, lion, dog, cow, monkey}
let c: Animals = Animals.cat;

Any: Se utiliza cuando el tipo de datos puede ser cualquiera de los anteriores

let wherever: any = 14;
wherever = "people";

Clases

Así como en cualquier otro lenguaje de programación orientado a objetos, en TypeScript las clases tienen campos, constructores, propiedades y funciones. Las clases actúan como contenedores que encapsulan código para ser consumidos de una manera más fácil.

Al definir una clase utilizamos la palabra class y cerramos con llaves {}, así como en c# y java por ejemplo y luego definimos adentro nuestros campos, constructores, propiedades y funciones.


class User {
    # fields
    private name: string;
    private lastName: string;

    # Constructor
    constructor(name: string, lastName: string){
        this.name = name;
        this.lastName = lastName;
    }

    # Properties
    get getName(): string {
        return this.name;
    }

    set setName(value : string): string {
        if(value === undefined) throw 'Ingrese un valor válido';
        this.name = value;
    }

    #Functions
    fullName(){
        return this.name + ' ' + this.lastName
    }
}

const newUser = new User('Juanin','JanJarri');
console.log('El nuevo usuario es:', newUser.fullName())

En el ejemplo anterior se define un método constructor() que recibe los parámetros name: String, lastName: String, estos parámetros son asignados a los valores internos de la clase utilizando el método this para referenciarlos.

Además las Properties nos permiten obtener y asignar datos de variables o métodos internas de la clase. En el ejemplo el método setName() permite asignar el valor recibido como parámetro a la propiedad interna llamada name. El método getName() permite obtener el valor de la propiedad interna 'name'

Las Functions nos permiten ejecutar funciones o métodos internos de las clase, en el ejemplo el metódo fullName() devuelve la unión de las propiedades internas name más lastName.

Para crear una instancia de la clase User definimos la siguiente constante const newUser = new User('Juanin','JanJarri'); En estas lineas de código se puede apreciar que al crear esta instancia se envían los parámetros 'Juanin','JanJarri' al constructor para inicializar la clase con esos valores.

Interfaces

En oportunidades llamadas firmas, es el mecanismo que usa Typescript para definir tipos en las clases. Permiten definir la estructura o el tipo de objetos más complejos.

La forma en que se utiliza una interface es muy similar a como se define una clase, pero solo se declaran atributos y métodos si su implementación.

Al igual que los tipos de variables simples, estos objetos también deberán seguir un conjunto de reglas creadas por ti. Esto puede ayudarlo a escribir código con más confianza y con menos posibilidades de error.

En el siguiente ejemplo definimos una interface llamada Lakes:

interface Lakes {
    name: string,
    area: number,
    length: number,
    depth: number,
    isFreshwater: boolean,
    countries: string[]
}

La Lakes interface contiene el tipo de cada propiedad que vamos a utilizar al crear nuestros objetos. A continuación crearemos un nuevo objeto firstLake que heredará las propiedades que tiene la interface Lakes.

let firstLake: Lakes = {
    name: 'Caspian Sea',
    length: 1199,
    depth: 1025,
    area: 371000,
    isFreshwater: false,
    countries: ['Kazakhstan', 'Russia', 'Turkmenistan', 'Azerbaijan', 'Iran']
}

Como puede ver, no importa el orden en el que asigne un valor a estas propiedades. Sin embargo, no puedes omitir un valor.
Deberás asignar un valor a cada propiedad para evitar errores al compilar el código.

De esta manera, TypeScript se asegura de que no se pierda ninguno de los valores requeridos por error.

Propiedades opcionales

A veces, es posible que necesites una propiedad solo para algunos objetos específicos.

Por ejemplo, supongamos que desea agregar una propiedad para especificar los meses en los que se congela un lago. Si agrega la propiedad directamente a la interfaz, como hemos hecho hasta ahora, obtendrá un error para otros lagos que no se congelan y por lo tanto no tienen la propiedad frozen. De manera similar, si agrega esa propiedad a los lagos que están congelados pero no en la declaración de la interfaz, aún obtendrá un error.

En tales casos, puede agregar un signo de interrogación ? después del nombre de una propiedad para establecerla como opcional en la declaración de la interfaz. De esta manera, no obtendrá un error por propiedades faltantes o propiedades desconocidas. El siguiente ejemplo se vuelve a definir la interface Lakes pero la propiedad area queda como opcional.

interface Lakes {
    name: string,
    area?: number,
    length: number,
    depth: number,
    isFreshwater: boolean,
    countries: string[]
}

Playground

Playground typeScript

Conclusión

Esta lectura presentó todos los tipos que están disponibles en TypeScript. Aprendimos cómo la asignación de un tipo diferente de valor a una variable mostrará errores en TypeScript. Esta comprobación puede ayudarlo a evitar muchos errores al trabajar en aplicaciones grande y robustas.

Instalación Python, Flask, PipEnv en Linux Ubuntu 20

Manuel Ortega Carcamo — Tue, 23 Mar 2021 16:03:48 +0000

Guía de instalación

Abrir una terminal y ejecutar los siguientes pasos:

Actualizar los paquetes disponibles y sus versiones.

sudo apt update

Instalar Python 3

sudo apt install python3-pip python3-dev build-essential libssl-dev libffi-dev python3-setuptools

Verificar la versión de Python instalada

python3 --version

Instalar pipenv

sudo apt install pipenv

Creación de mi primer API usando Flask

Crear un carpeta e ingresar en ella

mkdir miApi
cd  miApi

Crear el entorno virtual

pipenv shell

Instalar Flask

pipenv install flask

Verificar las versiones instaladas

python3 -m flask --version

Crear un archivo hello.py

touch hello.py

Pegar el siguiente código en el archivo hello.py

from flask import Flask
app = Flask(__name__)

@app.route('/')
def hello_world():
    return 'Hello World!'

Agregar una variable de entorno con el nombre de la app

export FLASK_APP=hello.py

Ejecutar la API

flask run

Instalación Mysql en Linux Ubuntu 20

Manuel Ortega Carcamo — Tue, 23 Mar 2021 03:35:07 +0000

Guía de instalación

Abrir una terminal y ejecutar los siguientes pasos:

Actualizar los paquetes disponibles y sus versiones.

sudo apt update

Instalar Mysql

sudo apt install mysql-server

Instalar la secuencia de comandos de seguridad, esta opción agrega seguridad a la instalación de nuestra base de datos

sudo mysql_secure_installation

Output

Output
Please set the password for root here.


New password:

Re-enter new password:

Ajustar la autenticación y los privilegios de usuario

sudo mysql

SELECT user,authentication_string,plugin,host FROM mysql.user;

ALTER USER 'root'@'localhost' IDENTIFIED WITH caching_sha2_password BY 'password';

Ejecutamos este comando para indicar al servidor que vuelva a cargar la tabla de permisos y aplique sus nuevos cambios:

FLUSH PRIVILEGES;

Instalación de WorkBench

Ingresar al Link
Descargar el archivo presionando la opción Download
Presionar la opción No thanks, just start my download
Arrastrar el archivo descargado a la terminal quedando de la siguiente forma

sudo apt install '/home/student/Downloads/mysql-apt-config_0.8.16-1_all.deb'

Actualizar los paquetes disponibles y sus versiones.

sudo apt update

Instalar MySQL Workbench

sudo apt install mysql-workbench-community

Ejecutar desde la terminal MySQL Workbench

mysql-workbench

Fuente: DigitalOceans

Instalación de VCode en Linux Ubuntu

Manuel Ortega Carcamo — Tue, 23 Mar 2021 02:50:35 +0000

Guía de instalación

Abrir una terminal y ejecutar los siguientes pasos:

Actualizar los paquetes disponibles y sus versiones.

sudo apt update

Instalar Vcode

sudo apt install software-properties-common apt-transport-https wget

Importar la clave GPG de Microsoft

wget -q https://packages.microsoft.com/keys/microsoft.asc -O- | sudo apt-key add -

Habilitar repositorios de Vcode

sudo add-apt-repository "deb [arch=amd64] https://packages.microsoft.com/repos/vscode stable main"

Instalar Vcode

sudo apt install code

Abrir Vcode, escribiendo en la barra de búsqueda de Actividades ‘Visual Studio Code‘

Instalación de Git en Linux Ubuntu

Manuel Ortega Carcamo — Tue, 23 Mar 2021 02:27:14 +0000

Guía de instalación

Abrir una terminal y ejecutar los siguientes pasos:

Actualizar los paquetes disponibles y sus versiones.

sudo apt update

Instalar Git

sudo apt install git

Verificar la versión de Git instalada

git --version

git version 2.25.1

Clonar el boilerplate de la academia react-hello

git clone https://github.com/4GeeksAcademy/react-hello.git

cd react-hello

npm install

npm run start

Instalación Node en Linux Ubuntu 20

Manuel Ortega Carcamo — Tue, 23 Mar 2021 02:03:59 +0000

Guía de instalación

Abrir una terminal y ejecutar los siguientes pasos:

Actualizar los paquetes disponibles y sus versiones.

sudo apt update

Instalar Node.js

sudo apt install nodejs

Verificar la versión de Node.js instalada

node -v

v10.19.0

Instalar npm

sudo apt install npm

Verificar la versión de npm instalada

npm -v

6.14.4

Crear una App de Reactjs de ejemplo

npx create-react-app test

cd test

npm run start

Configurar terminal de Git Bash en Vcode

Manuel Ortega Carcamo — Sat, 06 Mar 2021 16:25:12 +0000

Para los usuarios que utilizan sistemas operativo Windows, es necesario instalar una terminal para poder utilizar los comandos que se usan en servidores Linux.

¿Qué necesito instalar?

Debemos instalar la terminal Git Bash

¿Como configurar Visual Studio Code para usar Git Bash?

Debemos seguir estos pasos:

Copiar la ruta donde se instalo Git Bash, en mi caso fue en la carpeta c:\Program Files\Git\git-bash.exe.
Abrir Visual Studio Code y en el menú superior seleccionar la opción File luego Preferences luego Settings.
Se nos desplegará una pantalla con opciones y debemos seleccionar la que dice Extensions
En la opción Explorer Kind, seleccionamos la opción external y luego pegamos la ruta donde se encuentra instalada Git-Bash, en mi caso era c:\Program Files\Git\git-bash.exe.
Luego debemos abrir una nueva terminal
Y debería verse de esta forma

FlexBox

Manuel Ortega Carcamo — Fri, 19 Feb 2021 21:18:16 +0000

¿Que es Flexbox?

es un conjunto de nuevos atributos (propiedades) y valores de CSS que podemos aplicar a los elementos de una página y que permiten simplificar la forma en que los posicionamos y se adaptan a los distintos dispositivos.

¿Como empiezo a usarlo?

Para usarlo debo crear un contenedor y todo los elementos dentro tendrán las propiedades de Flexbox.

El siguiente ejemplo crea un contenedor que se aplica a la etiqueta html section usando css.

Código html

  <section>
     <article>1</article>
     <article>2</article>
     <article>3</article>
     <article>4</article>
  </section>

Código css

section{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

article{
    background-color: #9ef;
    padding: 3px;
    margin: 5px;
    width: 40%;

}

En el código css se puede ver que a la etiqueta section se aplican 3 propiedades de flexbox:

display: flex; que indica que esta etiqueta será un contenedor flexbox
flex-direction: row; Indica que los elementos dentro de este contenedor tendrán una dirección en forma de filas
flex-wrap: wrap; Si el elemento no tiene espacio pasará a la siguiente linea.

Acá esta el código del ejercicio

¿Qué más puedo hacer?

Cambia la propiedad flex-direction: row; por flex-direction: column;
Cambia la propiedad flex-wrap: wrap; por flex-wrap: nowrap;