FULL STACK REACT CON PERN ADMINISTRADOR DE PRODUCTOS Y REST API

FULL STACK REACT CON PERN ADMINISTRADOR DE PRODUCTOS Y REST API

Ivan Sosa Tovar @istovar
Ivan Sosa Tovar @istovar

ADMINISTRADOR DE PRODUCTOS UTILIZANDO API’S CON EXPRESS, REACT,AXIOS ETC

Aplicación web que permite la administración de productos mediante una API RESTful. La aplicación utiliza tecnologías modernas tanto en el frontend como en el backend, ofreciendo una experiencia fluida para gestionar productos de manera eficiente.

  • Herramientas utilizadas

Frontend: React Zustand (para la gestión del estado) Axios (para realizar peticiones HTTP al servidor) Backend: Express.js Node.js con TypeScript PostgreSQL como base de datos Swagger (para la documentación de la API)

Características Principales:

Permite agregar, editar, eliminar y actualizar productos. Interfaz de usuario intuitiva y fácil de usar. Documentación clara de la API utilizando Swagger. Gestión eficiente del estado de la aplicación en el frontend mediante Zustand. Implementación de seguridad en las peticiones HTTP.

Documentación

Imagen Documentación

Código de Ejemplo:

     // Función para agregar un producto
export async function addProduct(data: ProductData) {
    // Código de implementación...
}

// Función para obtener todos los productos
export async function getProducts() {
    // Código de implementación...
}

// Función para obtener un producto por su ID
export async function getProductById(id: Product['id']) {
    // Código de implementación...
}

// Función para actualizar un producto
export async function updateProduct(data: ProductData, id: Product['id']) {
    // Código de implementación...
}

// Función para eliminar un producto
export async function deleteProduct(id: Product['id']) {
    // Código de implementación...
}

Visita el sitio web

Repositorio - Backend

Repositorio - Frontend