Project Summary
CarePulse is a patient appointment web application I built while following a JavaScript Mastery tutorial on YouTube. The app simulates a real-world clinical booking system where patients can register, book appointments, and upload documents, while administrators manage scheduling and patient communications. The project deepened my practical knowledge of complex form handling and data management in a production-style Next.js app, and introduced me to integrating SMS notifications using Twilio. CarePulse is both a learning exercise and a demonstrable piece in my portfolio that showcases full-stack patterns for appointment workflows, secure file handling, and real-time notifications.
Test the live project including the administrator dashboard with the admin passcode: 999999.
Project Goals and Challenges
The primary goal for CarePulse was to recreate a complete appointment lifecycle: patient registration, booking, administrative confirmation or cancellation, and patient notification. I wanted a system that honored role separation—patients should have a simple, guided booking experience, while admins need a consolidated view to manage and adjust appointments. Building this brought several challenges. Designing complex, multi-step forms for booking that validate inputs and handle edge cases required careful state management and UX design. Coordinating data between client, server, and Appwrite's backend services demanded robust API patterns and error handling. Integrating Twilio for SMS confirmations introduced additional security and rate-limiting concerns, and ensuring reliable file uploads with Appwrite storage meant thinking through file validation, storage rules, and access control. Finally, adding Sentry for performance and error tracking forced me to consider observability from the start, so issues could be detected and triaged quickly.
Tech Stack Overview
CarePulse is built on Next.js with TypeScript for a typed, modern frontend and server routes. Appwrite serves as the backend platform for authentication, database, and file storage. TailwindCSS and Shadcn UI deliver a responsive, accessible design system that scales across device sizes. Twilio powers SMS delivery for appointment confirmations, and Sentry is used for monitoring and performance tracking. This combination allowed me to focus on app logic and UX while relying on well-supported services for authentication, storage, and communications.
Core Features
Patient Registration
Patients can create an account, complete a profile, and manage personal details. Using Appwrite's authentication and user management endpoints simplified session handling and secure data storage. On the client, forms validate input progressively and provide clear feedback; on the server, I implemented checks to prevent duplicate accounts and to sanitize profile uploads, ensuring data integrity across the system.
Booking Flow
The booking experience supports multi-step interactions where patients register/login, choose a doctor, select a date and time, and upload relevant documents. Managing this required splitting the booking into discrete form states with local validation and optimistic UI updates. I used controlled components with TypeScript-typed schemas to keep the form state predictable, and built reusable validation utilities so edge cases—like overlapping bookings or invalid time windows—are handled gracefully before submission.
Administrative Dashboard
Administrators access a secured dashboard where all appointments are listed, filterable by status, date, and patient. Admins can confirm, schedule, or cancel appointments; those actions update the central database and trigger downstream effects such as SMS notifications. To ensure consistency, state-changing operations are performed server-side with immutability in mind, and admin actions are gated by role-based checks enforced by Appwrite.
SMS Notifications with Twilio
When an admin confirms an appointment, CarePulse sends an SMS confirmation to the patient via Twilio. Implementing this required secure server-side integration so credentials never reach the client. I built a webhook-friendly flow where appointment state transitions call a server route that creates and queues Twilio messages, and I added basic retry logic for transient failures. This integration improved the user experience by delivering timely appointment details and reminders directly to patients' phones.
File Uploads
Patients can attach medical documents and histories using Appwrite's storage service. The upload flow validates file types and sizes client-side, then streams the files securely to Appwrite with properly scoped permissions. Stored files are referenced in appointment records, and access checks ensure only authorized users (the patient and relevant admins) can retrieve them.
Error Tracking with Sentry
To maintain a production-ready mindset, I integrated Sentry into both client and server sides to capture runtime errors and performance bottlenecks. Sentry dashboards make it easy to correlate user actions with errors, helping to prioritize fixes. This level of observability was particularly helpful while experimenting with Twilio integrations and file upload edge cases.
Key Learnings and Takeaways
Working on CarePulse significantly improved my confidence with complex form and state management in TypeScript. I learned practical patterns for splitting multi-step forms into manageable, testable units and for synchronizing optimistic UI states with the server. Integrating Twilio taught me how to design notification flows through its SMS messaging service (and to brace myself for steep pricing pages). Appwrite's unified feature set demonstrated the benefits of a backend-as-a-service for speeding development, while Sentry emphasized the necessity of observability even in prototype projects. Overall, CarePulse reinforced best practices for building user-focused workflows that balance functionality, security, and maintainability. It provided clear, hands-on experience that I can apply to future healthcare or scheduling products.