React CRM Amsternannies part 1

Hi all,

This post will be about another react.js for our new client Amsternannies. Amsternannies is an babysitter agency in Amsterdam. They have 900 or so nannies and they distribute these nannies to the family that needs them. So far they have been managing all of this in the excel sheets. For them to grow, they need a CRM system to manage all of the families, nannies, appointments, and invoicing module.

I have been trying to do more react.js work instead of wordpress at Whello. WordPress is our where most of our clients is, however it has becoming less challenging for me. Therefore, when the opportunity came, I said yes. We will make you CRM in react. I have made a similar application in react before (UTU prestasi part 1 & UTU prestasi part 2) and I think I can re-used most of the components.


Basically they want to have a system that has:

  1. Families module – every family will have contact person (parent), the children, and list of all their appointments.
  2. Nannies module – every nanny will have personal details and work experience
  3. Appointments module – every appointment will have the family, nanny, date and time and price
  4. Invoice module – every family will have a monthly invoice on how much they have spent on a nanny

Family module

They can register, edit, and delete families. Every family has a PDF can be uploading with all of their information, start date, etc. Within this family they can also add/edit/delete a contact person. This contact person has the email, phone number, and IBAN number for invoicing. They can also add/edit/delete a child. A child has a basic information and where he/she goes to school and day care.

Nanny module

In this module they can add/edit/delete nannies. Every nanny has a personal and work details. In addition, they also have 2 separate uploaded document containing their CV and Identity (Passport and Driver License).

Appointment module

In this module, an appointment can be set for a family. They will select a family and a date and then a list of nannies will appear. They will select multiple nannies and emails will be sent to these nannies asking if they are available. Once they received back the confirmation from nanny, they can change the appointment status and sent confirmation email to the family. In this module as well we can see how many appointment a family or a nanny has within certain periods of time. They will then be able to download a generated PDF invoices that can be send to the family.


I have Argo design this project for me. It is basically a dashboard interface. Here are some of the design from him.

  1. Login Pagereact crm amsternannies
  2. All Familiesreact crm amsternannies
  3. Family detailsreact crm amsternannies
  4. All Nanniesreact crm amsternannies
  5. Nannies Detailsreact crm amsternannies
  6. All Appointmentsreact crm amsternannies
  7. New appointmentreact crm amsternannies
  8. Appointment detailsreact crm amsternannies

This will be end of part 1 of this project. I hope you have some ideas what the application can do. Stay tuned for the part 2!

Leave a Reply