No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Ejemplo de CRUD

16/22
Recursos

Aportes 20

Preguntas 2

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

o inicia sesión.

tuve problema con la libreria de faker, y lo solucione de la siguiente manera:

el import entre corchetes, (ya no es default):

import {faker} from '@faker-js/faker';

y algunas props ahora estan en otros lados:

color: faker.color.human(),
tags: faker.helpers.arrayElements(),
size: faker.helpers.arrayElement(['M', 'S', 'XL', 'L']),

Para los que tuvieron errores en la implementacion de faker, yo lo resolvi de esta forma:

import {faker} from '@faker-js/faker';
import { addProduct, products } from "./products/product.service";

for (let index = 0; index < 50; index++) {
    addProduct({
        id: faker.datatype.uuid(),
        title: faker.commerce.productName(),
        description: faker.commerce.productDescription(),
        image: faker.image.imageUrl(),
        size: faker.helpers.arrayElement(['M','S','L', 'XL']),
        color: faker.commerce.color(),
        isNew: faker.datatype.boolean(),
        tags: faker.helpers.arrayElement(),
        price: parseInt(faker.commerce.price()),
        createAt: faker.date.recent(),
        updateAt: faker.date.recent(),
        stock: faker.datatype.number({min: 10, max: 100}),
        category: {
            id: faker.datatype.uuid(),
            name: faker.commerce.department(),
            createAt: faker.date.recent(),
            updateAt: faker.date.recent(),
        }
    })   
}

console.log(products)

De nada XD

En caso de que se les dificulte crear la funcion de Update, Read y Delete del CRUD, acá les dejo mi aporte.

Para no repetir codigo, cree el tipo Id en el archivo Base.model para mantener ese tipado mejor.

export type Id = string | number

También cree una funcion que retorna el index y otro que lanza un error. en el archivo product.service

const getIndex = (id: Id) => products.findIndex(product => product.id === id)
const throwError = (error: string) => new Error(error)

Acá la funcion update: updateProduct

export const updateProduct = (id: Id, changes: object) => {
  const index: number = getIndex(id)
  const product: Product = products[index]
 index === -1 && throwError('Product not Found')

  products[index] = {
    ...product,
    ...changes
  }
  return products[index]
}

Acá la función delete: deleteProduct

export const deleteProduct = (id: Id) => {
  const index: number = getIndex(id)
  index === -1 && throwError('Product not Found')
  products.splice(index, 1)
  return id
}

finalemnte la funcion Find: findProduct

export const findProduct = (id: Id) => {
  const index: number = getIndex(id)
  index === -1 && throwError('Product not Found')
  return products[index]
}

Espero les sirva.

ahora array elements y array element estan dentro de helpers.

faker.helpers.arrayElements(),

Les dejo mis soluciones para las funciones getProduct(), updateProduct() y deleteProduct()
Decidí hacerlas por mi cuenta para ver cómo me iba. Primero les doy un poco de contexto de lo que usé y algo que cambié:
.

<h5>Overloading</h5>

Utilicé en todas las funciones overloading, ya que quise que getProduct() retornara un string si no encontraba el producto con el ID indicado.
Y las demás tienen overloading ya que utilizan a getProduct()
.

<h5>Cambios en product.model.ts</h5>

Concretamente modifiqué Product interface, ya que al utilizar updateProduct() no quería modificar el id ni tampoco createdAt; no tenía sentido hacer esas modificaciones.
Entonces, Product interface cambió por ProductEdit interface.
Y creé un nuevo Product interface que extiende de BaseModel interface y de ProductEdit interface. Al hacer esto tuve que agregar updatedAt en ProductEdit interface y funciona todo perfecto.
.
Ahora sí, les dejo cada función:

let products: Product[] = []; // cambié el `const` por `let`


// getProduct()
function getProduct(id: string): Product;
function getProduct(id: string): string;

function getProduct(id: string): unknown {
  const product = products.find(product => product.id === id);

  return product ?? `Product with ID '${id}' does not exist.`;
}


// updateProduct()
function updateProduct(id: string, changes: ProductEdit): Product;
function updateProduct(id: string, changes: ProductEdit): string;

function updateProduct(id: string, changes: ProductEdit):unknown {
  const product = getProduct(id);

  if (product) {
    products.map(product => {
      product.id === id && Object.assign(product, changes);
    });
  }

  return product;
}


// deleteProduct()
function deleteProduct(id: string):Product;
function deleteProduct(id: string):string;

function deleteProduct(id: string):unknown {
  const product = getProduct(id);

  if (product) {
    products = products.filter(product => product.id !== id);
  }

  return product;
}

Espero les sirva😁

Algunos métodos han cambiado de ruta en la librería de faker.

En la API Reference pueden buscar cada método que no sea accesible como lo señala la clase.

Les dejo como quedó mi main.ts, más que nada por si alguno también tuvo problemas con ciertas funciones que estaban deprecadas o que no existían en la propiedad usada.
/


/
Primero que nada el import no tiene que ser default, debería ser así:

import { faker } from '@faker-js/faker';

/


/
Ya para el producto que vamos a crear usando faker-js hay algunas funciones que fueron colocadas en otras propiedades.

  • color, por ejemplo:
addProduct({
	...
	color: faker.commerce.color(),
	...
})

Ya no se encuentra en la propiedad commerce, sino que tiene su propia propiedad color con varias funciones. Para la clase usé human(), que es la misma función que tenía commerce.

addProduct({
	...
	color: faker.color.human(),
	...

/


/
Y así con otras propiedades y/o funciones. Les dejo mi addProduct({…}) a continuación:

addProduct({
    id: faker.datatype.uuid(),
    title: faker.commerce.productName(),
    category: {
      id: faker.datatype.uuid(),
      name: faker.commerce.department(),
      createdAt: faker.date.recent(),
      updatedAt: faker.date.recent(),
    },
    price: parseFloat(faker.commerce.price()),
    stock: faker.datatype.number({min: 10, max: 100}),
    isNew: faker.datatype.boolean(),
    image: faker.image.imageUrl(),
    description: faker.commerce.productDescription(),
    tags: faker.helpers.arrayElements(),
    size: faker.helpers.arrayElement(['S', 'M', 'L', 'XL']),
    color: faker.color.human(),
    createdAt: faker.date.recent(),
    updatedAt: faker.date.recent(),
  });

Espero les sirva 😄

Faker cambio la forma de utilizar arrayElement a:

faker.helpers.arrayElement(['16','S','M','L','XL'])

Con color lo mismo:

faker.color.human()

Así creo que podría ser para delete y get (en get podemos buscar un producto por su ID o por su título):

import { Product } from "./product.model"

export const products: Product[] = []

export const addProduct = (data: Product) => {
  products.push(data)
}

export const updateProduct = (id: string | number, changes: Product) => {

}

export const deleteProduct = (id: string | number) => {

}

export const getProduct = (id?: string | number, title?: string) => {

}

npm install --save-dev @faker-js/faker

Acá esta mi solución para el CRUD, espero que a alguien le sirva

export const addProduct = (data: Product): void => {
    products.push(data);
}
export const getProduct = (productID: string): any => {
    let product = products.filter(product => product.id === productID)
    return product
}
export const uploadProduct = (productID: string, data: object): void => {
    let newData = {...data, updatedAt: new Date() }
    let productIndex = products.findIndex(product => product.id === productID)
    Object.assign(products[productIndex], newData) 
}
export const deleadProduct = (productID: string): void => {
    let productIndex = products.findIndex(product => product.id === productID)
    products.splice(productIndex, 1)
}

En enero del 2022 paso algo curioso con el creador de la lib
Faker.js, saboteo su propio repositorio en simbolo protesta, dejo de funcionar y muchas big companies tambien se vieron afectadas, les dejo mi articulo acerca de ello, tiene muucho que ver con los ideales del opensource…

https://cr0wg4n.medium.com/es-un-buen-momento-para-hablar-de-ideales-en-el-mundo-del-software-f8f618a6bfb6

en las nuevas versiones usar:

faker.color.human()

en vez de: faker.commerce.color()

Aquí les dejo mi función para el update:

export const updateProduct = (id: string, changes: Product) => {
  let index = products.findIndex(item => {
    id === item.id
  })

  products.splice(index, 1, changes)
}

A

OLD

faker.random.arrayElements()

NEW

faker.helpers.arrayElements()

Pocos entenderán:

Para los tags lo implemente asi: le di un array de opciones… el toma el random en cantidades y tipos y los asigna:

tags: faker.helpers.arrayElements(['perro','gato','raton','pajaro','culebra','peces','pollito']),

Por alguna razón la nueva versión de faker no encontre la manera de hacer un array de string, ya que el método está en dataType y retorna, (string | number)[] así que hice un pequeño método para rellenar los tags, de una manera más natural… este fue el código que utilice

const productTagsArray = (times: number): string[] => {
  let productsArray: string[] = [];
  for(let i=0; i<times; i++){
    productsArray.push(faker.commerce.productAdjective());
  }
  return productsArray;
}

Lo agregue a product service.ts y lo importe a main.ts este es un resultado de ejemplo:

 tags: [
      'Small',      'Generic',
      'Luxurious',  'Awesome',
      'Gorgeous',   'Tasty',
      'Recycled',   'Luxurious',
      'Electronic', 'Rustic'
    ]

Librería Faker

Instalación
npm install @faker-js/faker --save-dev

Importando Librería
import faker from '@faker-js/faker';

Los otros templates que faltan son delete y get.

const deleteProduct = (id: string): void => {
  //code
}

const getProduct = (id: string): void => {
  //code
}