Taak: Chatmelding maken

Ontwikkel een mechanisme om een melding weer te geven alleen wanneer een gebruiker ongelezen berichten heeft. Controleer of de gebruiker ongelezen berichten heeft. Als deze voorwaarde waar is, toon dan een melding met het aantal berichten. Als de gebruiker geen berichten heeft, wordt er niets weergegeven.

De opdracht is:

• Maak twee componenten: App als oudercomponent en Notification als kindcomponent.
• De oudercomponent, App, moet een prop genaamd messages doorgeven aan de kindcomponent. De prop messages is een array met berichten. In de kindcomponent controleer je de lengte van de messages array.
• Als er berichten in de array staan, geef dan een string weer: You have <amount> of unread messages. Vervang <amount> door het daadwerkelijke aantal ongelezen berichten.

1. Om te bepalen of er berichten in de array staan, controleer je de length met de eigenschap length. De syntaxis is - array.length.
2. In React wordt de operator && gebruikt om de logica van een if-statement te implementeren.
3. Om de string correct samen te stellen, vervang je de placeholder amount door de daadwerkelijke lengte van de array.
4. Gebruik accolades {array.length} om de lengte van de array in de string te plaatsen.