Sailmore projektbeskrivelse

Beskrivelse

Sailmore er et afsluttende semesterprojekt på webudvikling, designet til at fremme forbindelsen mellem skippere og gaster til tursejlads. Projektet blev udviklet af et team på fire udviklere, hvor vi alle bidrog til designfasen og havde hver vores specifikke ansvarsområder. Min primære rolle var at stå for implementeringen af funktionalitet for gaster. Både front-end delen og CRUD-funktionaliteter. Dette involverede at give brugerne mulighed for til at tilmelde sig, logge ind, redigere deres profiler og slette dem, hvis nødvendigt.

Frontenden er udviklet med React.js og CSS for at skabe et brugervenlig interface, mens backenden er bygget i PHP og understøttet af en MySQL-database for sikker datahåndtering og lagring. Brugen af React.js tillod os at bygge en dynamisk og interaktiv webapplikation, der udnyttede komponentbaseret udvikling for at sikre en god brugeroplevelse.

SailMore blev udviklet som en mobil app med fokus på brugervenlighed og mobilitet. Denne mobil-first tilgang betyder, at brugerne kan nyde en sømløs oplevelse på deres smartphones, hvilket gør det lettere end nogensinde at engagere sig i sejlsportsfællesskabet uanset tid og sted.

Showcase

Forside

På forsiden er der mulighed for at browse og søge på ture, der er lagt op. Man kan klikke ind på hver enkelt tur og se detaljer om den pågældende tur, hvilken skipper der har lagt turen op og detaljer om skipperens båd. Der er også mulighed for at melde sig til en tur, men klikker på man på "apply"-knappen bliver man bedt om at logge ind eller oprette sig som bruger, hvis ikke man er det.

Nederst på siden har vi navigationsbaren hvor brugeren kan navigere rundt på app'en, og få adgang til flere nøglefunktioner for at udforske og interagere med sitet.

Sign-up and Log-in

På signup-siden har brugeren mulighed for at oprette en konto ved at gennemgå en registreringsproces. I løbet af processen bliver brugeren opfordret til at udfylde en række felter med personlige data, herunder navn, email, et ønsket password samt en gentagelse af passwordet for bekræftelse, sammen med andre relevante oplysninger. Dette trin er afgørende for at sikre en personlig og sikker brugeroplevelse på platformen.

Efter succesfuld registrering bliver brugeren ført til login siden, hvor man så kan logge ind med de oplysninger man er registreret med. Her er der implementeret validering, så brugeren promptes, hvis det er de forkerte oplysninger der tastes ind.

Profil side

Efter en bruger har logget ind, bliver vedkommende omdirigeret til sin profilsiden. På denne side præsenteres brugeren for sine egne oplysninger. Der findes en redigeringsknap, som giver mulighed for at foretage ændringer i brugerens oplysninger eller, hvis ønsket, slette profilen helt. Dette tillader brugere at have fuld kontrol over deres personlige information og sikrer en tilpasset brugeroplevelse på platformen.

Yderligere, som en del af de tilgængelige funktioner for indloggede brugere, tilbydes der muligheden for at tilmelde sig forskellige ture.

Læring

Sailmore var mit første størrere projekt med React og komponentbaseret udvikling. Jeg lærte meget om, hvordan man opbygger responsive og brugervenlige webapplikationer og arbejdet med SQL-databasen i sammenhæng med React gav mig praktisk erfaring med databasemanipulation og datahåndtering på klient-siden. Denne erfaring har givet mig en bedre forståelse af, hvordan man effektivt kan integrere front-end og back-end teknologier for at skabe en funktionel og tiltalende applikation.

Gennem arbejdet med Sailmore lærte jeg ikke kun om tekniske færdigheder, men også om vigtigheden af teamwork og kommunikation inden for et udviklerhold. At arbejde sammen om at designe appen og derefter fordele ansvarsområderne, mens vi stadig støttede hinanden gennem udviklingsprocessen, var en lærerig oplevelse.