Twitter-liknande chatt-applikation byggd med .NET 6 och React. Realtidskommunikationen är skapad med SignalR.

Förbered och starta applikationen

1. Ladda ner repot från https://github.com/jajo21/Meddelandecentralen.
2. Leta upp valfri terminal och utgå från nerladdad Meddelandecentralen mapp, navigera sedan in i mappen client via terminalen och skriv där: npm ci nu laddas alla nödvändiga paket ner som behövs för att kunna köra klienten.
3. När alla paket har laddats klart skriver du i terminalen: npm start det här startar både backend-api:et och klientgränssnittet.
4. Normalt ska programmet öppnas i din webbläsare, om det inte gör det, öppna valfri webbläsare och navigera in på http://localhost:5000/.

Logga in

1. Logga in genom att skriva valfritt användarnamn.
2. När du är inloggad kan du använda applikationen.

Det här är en fortsättning på Chelsea-international-hostel uppgiften, nu ska vi bygga en meddelandecentral för hotellet. Vi har fått en beskrivning av VD:n med olika krav som ska uppfyllas, sedan är det mitt jobb att bygga en lösning.

Projekt Meddelandecentralen Uppgiftsbeskrivning.pdf

Från uppdragsebeskrivningen: "Applikationen ska vara baserad på en av de fyra idéerna som finns i uppgiftsbeskrivningen." - Jag har bestämt mig för att skapa nummer 3 "Något i stil med twitter, fast bara för de anställda på hotellet - också här är det viktigt att kunna sortera information per rum".

Min tanke är därför att skapa en plattform likt twitter där användare ska kunna skapa inlägg som resten av personalen på hotellet kan ta del av i realtid. Personal ska även kunna kommentera inlägg samt filtrera dessa inlägg efter rum.

Applikationen ska använda ramverket SignalR för realtidskommunikationen mellan klientgränssnittet och server-side API:et. Det grafiska klientgränssnittet kommer att byggas i React och server-side API:et kommer att byggas i ASP.NET Core och C#.

Skapades och lämnades in under lägesrapporten (tagg lagesrapport).
Vill också förtydliga att de olika färgerna på strecken från contexterna i diagrammet inte har någon betydelse i sig, dessa är endast färgade för att göra det lättare att visuellt tyda diagrammet.
(Tryck på bilden för att göra den större)

Bild på det initiala kanban-brädet
Jag har valt att skapa två "att göra" kolumner enbart för att kunna visa alla kort visuellt på en bild.
(Tryck på bilden för att göra den större)

Uppdaterad bild över projektets kanban-bräde vid lägesrapporten (tagg lagesrapport)
Kolumnen "Färdiga" har fler kort än vad som är visuellt synligt på bilden, klicka vidare in på länken för att se alla kort.
(Tryck på bilden för att göra den större)

Nuvarande status på kanban-brädet vid inlämning (tagg inlamning)
(Tryck på bilden för att göra den större)

• Inlämningsuppgift i kursen Webbapplikationer med realtidskommunikation - Oktober 2022
• Meddelandecentralen: Skapa en Twitter-liknande chatt-applikation byggd med .NET 6 och React. Realtidskommunikationen skapad med hjälp av SignalR.
• Resultat: 100/100 (G)

• C#
• ASP.NET Core
• SignalR
• WebSockets
• REST-API
• React.js
• Fetch-API
• Parcel
• HTML
• CSS