PetCloud

Sistema de veterinarios y dueños de mascota que permite digitalizar la ficha veterinaria de manera simple y en tiempo real

Funcionalidades 🔨

Dueños de Mascota

• registrarse y loguearse como usuario
• ver la información de la o las mascotas que tiene en su perfil
• personalizar la foto de sus mascotas

Médico Veterinario

• registrarse y loguearse como usuario

• crear nuevas mascotas asociadas a su CHIP (identificador único)

• crear nuevos controles de mascotas

  • peso
  • diagnóstico
  • vacunas

• actualizar los controles ya creados en la ficha de las mascotas

Tecnologías Utilizadas 🚀

Front-End
HTML
SASS
JavaScript
React.Js

Back-End
Python
Flask
SQLAlchemy
PostgreSQL

API	Descripción de Uso en la app
HL7 FHIR	Estándar sintáctico de salud
Google API Places	Facilitar ingreso de direcciones
Cloudinary	Sirve para personalizar foto de la mascota
Cloudinary	Contacte con nosotros (PetCloud)

Librerias
EmailJS
React-Bootstrap
Sweet Alert 2

Prerequisitos 📋

Que se debe instalar

Formato de codigo

Instalación 🔧

Paso a paso como correr el entorno de desarrollo

Formato de codigo

Autores ✒️

Nicolás Araya - https://github.com/NicolasArayaB

Francisco Correa - https://github.com/francisco-correa

Alvaro Brante - https://github.com/CablCode

Licencia

WebApp boilerplate with React JS

Styles

You can update the styles/index.scss or create new .scss files inside styles/ and import them into your current scss or js files depending on your needs.

Components

Add more files into your ./src/js/components or styles folder as you need them and import them into your current files as needed.

💡Note: There is an example using the Context API inside views/demo.js;

Views (Components)

Add more files into your ./src/js/views and import them in ./src/js/layout.jsx.

Context

This boilerplate comes with a centralized general Context API. The file ./src/js/store/flux.js has a base structure for the store, we encourage you to change it and adapt it to your needs.

React Context docs BreathCode Lesson view

The Provider is already set. You can consume from any component using the useContext hook to get the store and actions from the Context. Check /views/demo.js to see a demo.

import { Context } from "../store/appContext";
const MyComponentSuper = () => {
  //here you use useContext to get store and actions
  const { store, actions } = useContext(Context);
  return <div>{/* you can use your actions or store inside the html */}</div>
}

Back-End Manual Installation:

It is recomended to install the backend first, make sure you have Python 3.8, Pipenv and a database engine (Posgress recomended)

1. Install the python packages: $ pipenv install
2. Create a .env file based on the .env.example: $ cp .env.example .env
3. Install your database engine and create your database, depending on your database you have to create a DATABASE_URL variable with one of the possible values, make sure yo replace the valudes with your database information:

Engine	DATABASE_URL
SQLite	sqlite:////test.db
MySQL	mysql://username:password@localhost:port/example
Postgress	postgres://username:password@localhost:5432/example

4. Migrate the migrations: $ pipenv run migrate (skip if you have not made changes to the models on the ./src/api/models.py)
5. Run the migrations: $ pipenv run upgrade
6. Run the application: `$ pipenv run start

Front-End Manual Installation:

• Make sure you are using node version 14+ and that you have already successfully installed and runned the backend.

1. Install the packages: $ npm install
2. Start coding! start the webpack dev server $ npm run start

Publish your website!

This boilerplate it's 100% integrate with Herkou, just by pushing your changes to the heroku repository it will deploy: $ git push heroku main