Git Product home page Git Product logo

corpoayapelpage-project's Introduction

CorpoAyapel: Conexiones Solidarias para Causas Ben茅ficas

CorpoAyapel LadingPage es un proyecto de software dise帽ado para crear una experiencia de usuario intuitiva, dirigido tanto a organizaciones como a individuos comprometidos con hacer una diferencia a trav茅s de donaciones y contribuciones ben茅ficas.

Aspectos Destacados del Proyecto

  1. Experiencia Intuitiva de Donaci贸n: CorpoAyapel ofrece una plataforma f谩cil de usar que permite a los usuarios donar sin esfuerzo, ya sea mediante una contribuci贸n 煤nica o una suscripci贸n peri贸dica. El proceso es sencillo, lo que permite a las personas apoyar sus causas elegidas sin complicaciones.

  2. Gesti贸n Eficiente del Sitio: Con CorpoAyapel, las organizaciones tienen control total sobre el contenido de su sitio web. Pueden actualizar informaci贸n, compartir noticias, subir im谩genes, videos y gestionar consultas de los usuarios de manera efectiva. Esta caracter铆stica agiliza la administraci贸n del sitio, asegurando que la informaci贸n est茅 siempre actualizada.

  3. Interacci贸n Directa: CorpoAyapel fomenta la comunicaci贸n directa entre las organizaciones y sus interesados. Los usuarios, voluntarios y empresas que desean hacer donaciones pueden interactuar uno a uno con la organizaci贸n, fomentando la transparencia y estableciendo conexiones significativas.

  4. Dise帽o Moderno y Minimalista: El proyecto presenta un dise帽o moderno y minimalista del sitio web, ofreciendo una experiencia de navegaci贸n sin complicaciones para los usuarios. Este enfoque garantiza que la informaci贸n se presente de manera clara y concisa, facilitando la navegaci贸n por todo el sitio.

Para CorpoAyapel (Administradores y Personal)

  • F谩cil administraci贸n del sitio, incluida la edici贸n de contenido y las actualizaciones de noticias.
  • Comunicaci贸n directa con usuarios, voluntarios y posibles donantes.
  • Modernizaci贸n del aspecto y funcionalidad del sitio web.
  • Compartir noticias y actualizaciones en plataformas de redes sociales.

Para los Usuarios

  • Navegaci贸n r谩pida, sencilla y sin complicaciones.
  • Contacto directo uno a uno con CorpoAyapel para interacciones personalizadas.
  • Opciones flexibles de donaci贸n, permitiendo contribuciones 煤nicas o peri贸dicas.
  • Compartir noticias y actualizaciones en diversas redes sociales.
  • Notificaciones instant谩neas de validaci贸n al interactuar con el Chat, el Formulario de Contacto o el Formulario de Programas.

Caracteristicas/Funcionalidades

  • Actualizar, Editar, Agregar contenido
  • Subscripciones mensuales, o pago unico
  • Live Chat
  • Formularios de Contacto, Programas Voluntariado/Empresas

Tech Stack

Desarrollo Front-end

  • SASS: Un popular preprocesador de CSS que mejora las capacidades de estilizado de CSS al proporcionar variables, anidamiento y m谩s.
  • Webpack y Babel: Webpack es un potente empaquetador de m贸dulos, y Babel es un compilador de JavaScript. Juntos, permiten utilizar caracter铆sticas modernas de JavaScript y empaquetar los activos del proyecto de manera eficiente.

Gesti贸n del Estado:

  • Redux: Un contenedor de estado predecible para aplicaciones JavaScript, ampliamente utilizado con React para gestionar el estado de la aplicaci贸n.

Framework de Desarrollo Front-end:

  • React: Una popular biblioteca de JavaScript para construir interfaces de usuario, que ofrece un desarrollo basado en componentes y una eficiente renderizaci贸n del DOM.

Sistema de Gesti贸n de Contenidos (CMS):

  • Sanity: Un CMS headless que te permite crear, gestionar y entregar contenido a varias plataformas de manera fluida.

Marketing y Gesti贸n de Relaciones con el Cliente (CRM):

  • HubSpot: Una plataforma vers谩til para el marketing entrante, ventas y servicio al cliente que te ayuda a hacer crecer tu negocio y gestionar las relaciones con los clientes de manera efectiva.

Gesti贸n de Medios:

  • Cloudinary: Una plataforma de gesti贸n de medios basada en la nube que te permite almacenar, gestionar y entregar im谩genes y videos para tu aplicaci贸n.

Demo

Insert gif or link to demo

FAQ

Question 1

Answer 1

Question 2

Answer 2

Instalaci贸n

Requisitos previos:

-Asegurarse de tener instalado Node js, puede correr el comando en su terminal

node js -v

En caso de no tener node instalado puede instalarlo con el comando:

npm install node

Proceso de instalaci贸n

  1. Clonar el proyecto corpoAyapelPage-project-front-4

    -Asegurarse de crear una carpeta en su directorio antes de correr el siguiente comando

    git clone https://github.com/MAKAIABootcamp/corpoAyapelPage-project-front-4.git

    -Abrir el proyecto instalado

    cd corpoAyapelPage-project-front-4
  2. Instalaci贸n de paquetes y dependencias

    npm install
  3. Abrir el proyecto en su editor, en caso de estar usando VSC

    code .
  4. Iniciar el servidor de desarrollo

    npm start

Documentacion

Documentacion image

Samples

Despliegue

Requisitos previos:

-Asegurarse de contar con las credenciales de la cuenta en Cpanel de CorpoAyapel

Proceso de despliegue

  1. Iniciar el deploy en la terminal

    npm run build
  2. Abrir la carpeta en el directorio del proyecto y seleccionar el archivo build

  • Comprimir el archivo build
  1. Acceder a la interfaz de Cpanel

-Ingresar con el usuario y contrase帽a proporcionados:

Login Cpanel

  1. Realizar la carga de archivos

    • En el dashboard de Cpanel, seleccionar la opci贸n en el men煤 > Archivos > Administrador de archivos
    • Ingresar al directorio > public_html
    • Eliminar los archivos exceptuando: backup.zip | .htaccess | google34549c30e72072c7.html
    • Dar click en cargar y adjuntar el archivo comprimido build.zip
    • Al finalizar la carga dar click en volver a /home/corpoaya/public_html
    • Seleccionar el archivo buil.zip y con click derecho extraer
    • Cuando la carpeta este descomprimida, seleccionar todos los archivos y dar click en mover indicando la ruta /public_html/
  2. Verificar que el proyecto est茅 corriendo perfectamente

    CorpoAyapel

Autores

Equipo de Desarrollo


Juan Esteban Ciro

Lider de Proyecto


Front-End Developer


Maria Antonieta Pereira

Desarrolladora


FullStack Developer


Valentina Jim茅nez Salazar

Desarrolladora


Front-End Developer


Alexis Tamayo

Desarrollador


Front-End Developer


Usado por

Este proyecto es usado por:

License

MIT

corpoayapelpage-project's People

Contributors

marianto38 avatar j-ciro avatar 02alexis avatar valentinasj avatar whitneyst 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.