Code Monkey home page Code Monkey logo

react_dentalclinic's Introduction

FrontEnd - Clinica Dental

Proyecto 4 - FrontEnd para GeeksHubs

Tecnologías utilizadas

CSS3 Vercel DOCKER SEQUELIZE Postman JWT

Índice

🎯 Objetivo 🎯

El objetivo de este proyecto es desarrollar desde cero una API SPA (Single Page Application) funcional para una clinica dental con registros de lectura y edición sobre la bbdd mediante el backend del anterior proyecto.

Para cumplir el objetivo se han incluido las vistas para cumplir con la funcionalidades básicas de una página web con las siguientes carácteristicas: login, registro,visualización de datos del usuario, edición de datos del usuario, visualización de citas en detalle, búsqueda de citas, edición de citas y panel de control de admin.

🪛 Desarrollo 🪛

La API ha sido desarrollada por Carlos Redondo como parte de la formación Full Stack Developer de GeeksHubs.

Para la realización del proyecto, se han utilizado el siguiente stack tecnologico:

Se ha utilizado Vite-React-JS como base del proyecto y estructura básica para conseguir una SPA funcional.

Para la gestión de información entre los diferentes componentes de la APP se ha implementado REDUX. En este caso, el uso de REDUX se ha limitado a las credenciales del usuario ya que no se ha sido necesario implementarlo en el resto de vistas/componentes.

REDUX-PERSIST y REDUX-THUNK se han añadido como librerias adicionales para la conservación de las credenciales de la página a pesar del cierre de la pestaña o ventana del navegador.

En cuanto al diseño, se han utilizado componentes de Bootstrap y MDB-Bootstrap para conseguir un diseño atractivo y responsive. Como elementos adicionales, se han incluido: REACT-SELECT para mejora la visualización de los dropdowns y facilita la gestión de datos y MOMENT.JS para el formateo de fechas y las validaciones pertinentes.

Por último, como herramientas utilitarias hemos usado JWC_DECODED con el objetivo de desencriptar los datos del token recibido por el backend y poder trabajar con las credenciales correspondientes.

📍 Vistas 📍

Vista administrador:

Vista usuario:

Vista empleado:

👏 Agradecimientos 👏

Este proyecto no habría sido posible sin el inestimable ayuda de los docentes:David Ochando, Mara Scampini y Dani Tarazona.

Si eres desarrollador, te apasiona el mundo de la programación y te gusta colaborar, puedes ponerte en contacto con nuestro equipo en: [email protected].

react_dentalclinic's People

Contributors

redkarriv avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.