Vad är frontend?
Skillnaden mellan en bra och dålig användarupplevelseDet du ser och upplever på webbplatsen
Front-end eller frontend, beroende på vad man föredrar, är texter, bilder, länkar, formulär, knappar m.m som utgör det visuella gränssnittet. Front-end är det användaren ser i sin webbläsare, gränssnittet för webbplatsen som användaren interagerar med. Front-end presenterar vad du kan göra med en webbsida på samma sätt som en bils instrumentpanel, ratt och växelspak ger en bilförare möjlighet att interagera med en bil. Front-end har även stor inverkan på hur sökmotorer som exempelvis Google, Yahoo och Bing rangordnar en webbplats i sina sökresultat. Med bra kod för HTML, CSS och JavaScript, som är front-end-utvecklarens primära redskap, ger det din webbplats möjlighet att både synas och fungera bra. Frontend som begrepp kan idag även innefatta lite mer på djupet såsom t.ex. CI/CD-processen och viss operations-setup för en separata frontendkoden hanteras, t.ex. i en uppsättning med ett headless cms.
Varför specialisera sig på front-end?
Idag är kraven på responsiva användargränssnitt som bara fungerar utan krångel extremt höga. Tidigare kunde ett företag komma undan med att bygga en webbplats för en specifik webbläsare, man behövde heller inte anpassa sajten så att den kunde falla isär på ett snyggt sätt i en smart-phone. Idag skulle en sådan webbplats inte ge så bra användarupplevelse. Dagens breda utbud av olika webbläsare och webbtjänster gör att nya webbprojekt som har med dedikerade kompetenser för front-end kan tillhandahålla den kvalité som användaren förväntar sig av dagens webb. Det behövdes inte innan juli 2008, då Apple släppte sin Iphone 3G. Genomtänkt front-end säkerställer att webbplatsen fungerar tillfredsställande på majoriteten av mobila enheter. Med anpassad och specialiserad front-end kan en webbplats mobila version vara ett bra alternativ till en native app. Även webbläsarna har blivit mycket mer avancerade då de inte längre bara är informativa hemsidor med statiska bilder och texter. Användarna är inte heller längre enbart konsumenter av information utan har nu också blivit producenter. Genomtänkt front-end bidrar även till grundläggande tillgänglighet vilket medför att webbplatsen inte utesluter de många funktionshindrade Internet-användare som finns världen över. Anpassningar som medför att t.ex. funktionshinder som synfel (nedsatt syn eller blindhet) inte påverkar användarens förmåga att nyttja webbplatsen eller tjänsten.
Front-end, både kod och arkitektur
Dagens Internet-miljö är tekniskt krävande och ställer därför krav på hur du konstruerar din webbplats. Vi förespråkar att bygga webb med open-source-verktyg för att din webbplats enklare ska kunna få tillgång till uppdateringar och utvecklingar som görs av utvecklare från hela världen, hela tiden. Ramverk som vi på We ahead idag gärna använder är React, Angular och Ember, samtliga är ramverk för JavaScript.
För att kunna hantera och utveckla front-end-delen av din webbplats utan att alltid behöva ändra i backend krävs att din webbplats har en arkitektur som gör det möjligt. Många CMS (Content Management System) idag som t.ex. Wordpress, Drupal och Joomla gör det lättare att managera din webbplats men på bekostnad av din flexibilitet. En lösning som gör att du kan utveckla front-end utan att behöva byta hela din miljö, är att använda arkitekturmodellen microservices. Microservices innebär praktiskt att man kan nyttja, förändra och jobba med de olika delarna, front-end och back-end, separat då de nyttjar varandra genom ett så kallat API. Tidigare behövde man ofta göra förändringar i båda delarna för att nya features eller releaser skulle fungera som tänkt. Genom att nyttja ett API kan utvecklaren eller utvecklarna som ansvarar för front-end fokuserat jobba med sin JavaScript, CSS och HTML utan att behöva ha ständig kontakt med backend teamet för att se att man tänker lika och samtidigt.
Utöver flexibiliteten kan man då även bygga upp ett tilltalande administratörsgränssnitt som gör att även administratörer som inte är utvecklare i grunden kan redigera och förändra webbplatsen.