QuiglyCare is a dynamic care service application that allows users to learn more about the services of QuiglyCare and quickly book appointments.
QuiglyCare is a user-friendly web application designed to offer seamless access to a range of dedicated care services. Upon entering the home page, users can easily navigate through the navigation bar, which provides direct links to different sections of the website.
Additional sections include:
-
Meet the Team — This provides insights into each team member including names, roles, brief descriptions, and photos to allow users to connect with the team on a personal level.
-
FAQs — where users will find clear and concise instructions on utilizing the booking feature, along with step-by-step guidance and essential details to facilitate a smooth booking process.
-
Services — which provides detailed information on the types of care available, pricing details, and any special offerings or packages.
Planned future sections include:
Calendar section — For those seeking drop-in care appointments, the Calendar section displays the availability of QuiglyCare team members and is integrated with the team's Google Calendar. This allows users to effortlessly schedule appointments.
Upon submitting a booking, users receive a confirmation email with appointment details and a notification is sent to the relevant person, ensuring efficient communication.
- As a user looking for drop-in care service,
- I want to easily access information about QuiglyCare's services,
- So that I can learn more about the team, understand the booking process through an FAQ section, and efficiently book appointments with the team members.
Navbar -
Enquiry Form -
About Us -
Services -
Meet the Team -
FAQs -
Footer -
QuiglyCare is built using React.js (version 18.2.0), a popular JavaScript library for building user interfaces.
The site also uses React UI Components, including:
- React Bootstrap
- React Smooth Scrolling
- React Carousel
- React Burger Menu
QuiglyCare utilises the Web3Forms API to add functionality to the applications enquiry form. This API allows confirmation emails to be sent when to the user when they submit a form and also sends a notification email to the intended recipient.
- Documentation on the Web3Forms API can be found here.
- A new Web3Forms access key can be created here.
The Google Calendar API will be utilised in the future to sync the QuiglyCare application calendar with the calendars of care staff. This will enable available appointments to show for users visiting the site.
- Documentation for the Google Calendar API can be found here.
To run QuiglyCare locally, follow these steps:
Ensure you have the following installed on your machine:
- Node.js (https://nodejs.org/)
- npm (https://www.npmjs.com/)
- Clone the repository to your local machine:
git clone https://github.com/your-username/quiglycare.git
- Navigate to the project directory:
cd QuiglyCare
- Install the project dependencies via terminal:
npm install
npm install bootstrap react-bootstrap
npm install react-responsive-carousel
npm install react-burger-menu
npm install react-scroll
- Start the development server:
npm run dev
This will launch the application locally, which you can access via the 'localhost' link in your terminal.
QuiglyCare is automatically deployed using Netlify. Any changes pushed to the 'main' branch will trigger a new deployment.
You can visit the deployed site here.
Once QuiglyCare is deployed, no other configuration is required.
We welcome contributions! If you'd like to contribute to QuiglyCare, please reach out to a member of the team via the GitHub details at the bottom of this page.
MIT License
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
- @vitejs/plugin-react uses Babel for Fast Refresh
- @vitejs/plugin-react-swc uses SWC for Fast Refresh