Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jmatochepascual/crm-crud-json-server
Gestión de Clientes JSON-SERVER
https://github.com/jmatochepascual/crm-crud-json-server
api-rest css3 html5 javascript json-server nodejs tailwindcss
Last synced: 12 days ago
JSON representation
Gestión de Clientes JSON-SERVER
- Host: GitHub
- URL: https://github.com/jmatochepascual/crm-crud-json-server
- Owner: JmAtochePascual
- Created: 2024-05-26T02:01:11.000Z (8 months ago)
- Default Branch: main
- Last Pushed: 2024-08-04T12:37:27.000Z (5 months ago)
- Last Synced: 2024-11-08T02:50:08.070Z (2 months ago)
- Topics: api-rest, css3, html5, javascript, json-server, nodejs, tailwindcss
- Language: HTML
- Homepage: https://jmatochepascual.github.io/CRM-CRUD-JSON-SERVER/
- Size: 149 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 📚 Gestión de Clientes
Esta aplicación web permite gestionar información de clientes utilizando una API simulada con json-server. Puedes agregar, editar, eliminar y listar clientes en una interfaz sencilla y eficiente.
**Nota:** Para el uso de este proyecto es muy importante contar con la instalación de json-server para poder usarlo.
## 🎯 Contenido
1. 📝[Descripción](#descripción)
2. 🛠️[Tecnologías y Herramientas](#tecnologías-y-herramientas)
3. 🚀[Estructura del Proyecto](#estructura-del-proyecto)
4. 🧑💻[Uso](#uso)
5. 📌[Instalación](#instalación)
6. 🏗️[Contribución](#contribución)
7. ✨[Licencia](#licencia)
8. 🙈[Imagen de Referencia](#imagen-de-referencia)
9. 🌐[Ver Proyecto en la WEB](#ver-proyecto-en-la-web)
## Descripción
Esta aplicación web permite gestionar información de clientes utilizando una API simulada con json-server. Puedes agregar, editar, eliminar y listar clientes en una interfaz sencilla y eficiente..
## Características
- **Agregar Cliente:** Permite agregar un nuevo cliente a la base de datos mediante un formulario.
- **Editar Cliente:** Llena los campos del formulario con los datos de un cliente para su edición.
- **Eliminar Cliente:** Elimina un cliente de la lista.
- **Listar Clientes:** Muestra una lista de todos los clientes en la interfaz.
- **Validación de Campos:** Verifica que todos los campos del formulario estén completos antes de enviar.
- **Alertas Personalizadas:** Muestra alertas para informar sobre acciones como agregar, editar o eliminar clientes.
## Tecnologías y Herramientas
- **HTML:** Estructura de la página.
- **CSS:** Estilos de la página.
- **JavaScript:** Lógica de la aplicación, incluyendo manipulación del DOM, validación y consultas a la API.
- **Tailwind CSS:** Framework CSS para estilos y componentes.
- **json-server:** Servidor para simular una API REST.
## Estructura del Proyecto
- **css/**: Carpeta con los estilos.
- **js/**: Carpeta con la lógica del proyecto.
- `app.js`: Archivo principal con la lógica de la aplicación.
- `API.js`: Funciones para interactuar con la API.
- `funciones.js`: Funciones auxiliares para validar y mostrar alertas.
- `selectores.js`: Exportaciones de selectores DOM.
- **db.json**: Archivo de datos para json-server.
- **index.html**: Página principal.
## Uso
1. Clona el repositorio: git clone [URL del repositorio]
2. Navega a la carpeta del proyecto: cd [nombre del proyecto]
3. Abre el archivo index.html en un navegador de tu elección.
## Instalación
Para poder usar este proyecto es necesario instalar json-server. Puedes instalarlo globalmente usando npm:
```
json-server --watch db.json --port 4000
```
## Solicitudes de API REST
El proyecto hace uso de las distintas solicitudes de API REST:
- GET: Obtener la lista de clientes y un cliente específico.
- POST: Agregar un nuevo cliente.
- PUT: Actualizar un cliente existente.
- DELETE: Eliminar un cliente de la lista.
## Contribución
Si estás interesado en contribuir al proyecto, por favor sigue estos pasos:
1. Haz un fork del repositorio.
2. Crea una nueva rama para tu característica (`git checkout -b mi-nueva-característica`).
3. Compromete tus cambios (`git commit -am 'Añadir alguna característica'`).
4. Empuja la rama (`git push origin mi-nueva-característica`).
5. Abre un pull request.
## Licencia
Este proyecto está bajo la licencia [MIT](https://opensource.org/licenses/MIT).
## Imagen de Referencia
## Ver Proyecto en la WEB
Puedes ver el proyecto en funcionamiento [aquí](https://jmatochepascual.github.io/CRM-CRUD-JSON-SERVER/).
Todos los derechos reservados Gestión de Clientes 2024 ©.