Har du någonsin föreställt dig att bygga en webbplats eller en webbapplikation och undrat hur komplicerat det skulle vara? Om ja, skulle du tro att det bara är en enkel sak och att det inte finns någon raketvetenskap bakom? Handlar webbutveckling om enorma programmeringskoncept, algoritmer och massor av grejer? Absolut inte! Det är inget annat än bara en sekvens av steg du behöver följa.
I den här artikeln kommer jag att diskutera de grundläggande kraven och vägen som du behöver följa upp för att bli en webbutvecklare.
I grund och botten finns de tre typerna av webbutvecklare.
-
Front-end-utvecklare — En front-end-utvecklare arkitekter och utvecklar webbplatser och applikationer med hjälp av webbteknik
-
Back-end-utvecklare — Typ av programmerare som skapar den logiska back-end- och kärnberäkningslogiken för en webbplats, programvara eller informationssystem.
-
Full-stack-utvecklare — Utvecklare som utvecklar både backends och frontends.
Bli en frontend-utvecklare
Front-end är det användargränssnitt som vi ser när vi går till en webbapp. Här är stegen som du måste följa för att bli en frontend-utvecklare.
HTML — (Hyper Text Markup Language) HTML används för att bygga upp skelettet av webbapparna. Det är inte ett programmeringsspråk. Så du kan inte hacka NASA eller Google genom att använda HTML. 😂 Det finns massor av resurser som du kan hänvisa till för att lära dig HTML. Att lära sig HTML är mycket viktigt för att förstå strukturen i en webbapp. Här är några resurser som du kan följa för att lära dig HTML. w3schools, tutorialspoint
CSS — (Cascading Style Sheets) CSS används för att utforma webbappen. Som ett exempel om du behöver ändra bakgrundsfärg, teckenstorlek måste du ändra CSS-egenskaperna för html-element. Här är några resurser som du kan följa för att lära dig CSS. w3schools, tutorialspoint
JavaScript — Javascript är det mest populära programmeringsspråket i världen. I webbapplikationen tillhandahåller den funktionaliteten till appen. Som att göra api-samtal, animationer etc... JavaScript är lätt att lära sig. När vi använder JS i webbapparna använde vi Vanilla JS. Här är några resurser som kan följa för att lean JavaScript. w3schools, tutorialspoint
Genom att lära dig HTML, CSS och JS kan du bygga kraftfulla webbplatser. Men det krävs mycket ansträngning för att bygga webbappar med bara ren HTML, CSS och JS. Därför finns det bibliotek och ramverk som gör arbetet lättare. Men innan du lär dig dessa bibliotek och ramverk bör du ha en gedigen förståelse för HTML, CSS och JS. Då kan du enkelt förstå alla bibliotek eller ramverk.
När du utvecklar UI-elementen måste du definiera anpassad CSS för varje element. Och att använda rena HTML-element är inte användarvänligt. Därför finns det några UI-ramverk som du kan använda för att utforma UI-elementen. Av dem är den mest populära Bootstrap.
Bootstrap — Bootstrap är ett gratis CSS-ramverk med öppen källkod riktat mot responsiv, mobil-först front-end webbutveckling. Den innehåller HTML, CSS och JavaScript-baserade designmallar för typografi, formulär, knappar, navigering och andra gränssnittskomponenter. Genom att lära dig HTML, CSS, JS och Bootstrap ger dig en tydlig förståelse för front-end-utvecklingen. Efter att ha lärt dig dessa grunder måste du göra några små projekt. Annars skulle det inte vara sist i ditt minne. Här är några projektidéer som du kan göra.
Din biografisida (Skapa en responsiv sida genom att inkludera dina detaljer. Lägg till några bilder och snygga stilar och gör mer professionell)
Skapa en grundläggande kalkylatorapp.
Skapa en att göra-lista-app.
Efter att ha slutfört dessa utmaningar kan du fräscha upp dina färdigheter i att utveckla front-end av webbappar.
Använda bibliotek och ramverk för frontend
Om du hade utvecklat webbsidor med HTML, CSS och JS kommer du att möta stora problem som att koden upprepas om och om igen och vi kan inte återanvända UI-element på olika platser. Men genom att använda ramverk och bibliotek kan vi övervinna dessa problem.
I webbutvecklingsperspektivet finns det många ramverk och bibliotek vi kan använda. Men i den här artikeln kommer jag att diskutera mest om NodeJS-ramverket och dess associerade bibliotek.
Node.js är en öppen källkod, plattformsoberoende, back-end JavaScript-runtime-miljö som körs på V8-motorn och exekverar JavaScript-kod utanför en webbläsare, som designades för att bygga skalbara nätverksapplikationer. För att bygga webbappar måste vi först installera nodejs på vår dator. Det är bara en enkel uppgift som du kan göra individuellt.
Ovanpå NodeJS finns det bibliotek som vi kan använda för att skapa webbappar. Av dem är den mest populära ReactJS.
React är ett gratis och öppen källkods frontend JavaScript-bibliotek för att bygga användargränssnitt baserat på UI-komponenter. Det underhålls av Meta och en gemenskap av enskilda utvecklare och företag.
Det är lätt att lära sig React. Det finns många onlineresurser som du kan följa för att lära dig React. Skriv bara "Reagera tutorials" på google och följ den mest förståeliga för dig. När vi använder React kan vi återanvända UI-komponenterna. Därför är kodupprepningen mycket låg. Och React har en stor gemenskap, därför finns det många människor som du kan få hjälp.
Efter att ha lärt dig grunderna i React kan du bygga några mindre projekt och fräscha upp färdigheterna. Några idéer för projekten är,
Bygg en webbapp för e-handel
Kalkylator
Liten messenger-app
Det finns många bibliotek som vi kan använda med react för olika ändamål. Några av dem är,
Redux — För statsledningen
Axios — För api-samtal
MUI — Användargränssnittskomponenter
react-router — För att lägga till routing till appen
Förutom React finns det många UI-bibliotek och ramverk som du kan använda för att utveckla frontend. Några exempel är,
Angular JS
Vue JS
Det är inte nödvändigt att lära sig alla tillgängliga UI-bibliotek och ramverk för att bli en front-end-utvecklare. Om du har tid och lust kan du göra det. Men om du kan grundläggande begrepp kan du lära dig vilket ramverk som helst inom kort tid.
Bli en backend-utvecklare
Back-end, även kallad serversidan, består av servern som tillhandahåller data på begäran, applikationen som kanaliserar den och databasen som organiserar informationen. Som ett exempel om en kund surfar på mobiltelefoner i front-end, då är backend ansvarig för att skicka tillgängliga mobiltelefoner till front-end.
För närvarande finns det massor av ramverk som vi kan använda för att bygga backends. Några exempel är,
ExpressJS (Javascript)
Spring Boot (Java)
Django (Python)
Laravel (PHP)
NestJS (Javascript)
Du behöver inte lära dig alla tillgängliga ramverk för att bli en backend-utvecklare. Grunderna i alla dessa ramar är nästan desamma. Därför räcker det att lära sig ett ramverk och öva på det.
Genom att använda dessa ramverk kan vi bygga de api-slutpunkter som kunderna kan komma åt. Som ett exempel,
Här är slutpunkten "/signup" och metoden är POST. Denna slutpunkt kan nås av alla applikationer. I denna slutpunkt vill vi registrera användaren. För att registrera användardata bör sparas. Var lagrar man data? Svaret är enkelt "Databas"
Det finns huvudsakligen två typer av databaser vi använder med backend.
- Relationsdatabaser
- Icke-relationella databaser (dokument)
Från backend ansluter vi till databasen och sedan frågar vi databasen enligt användarens krav. Därför bör du ha en klar förståelse för frågor och metoder om databaser.
MySQL, PostgreSQL är några av exemplen för relationsdatabaser. För att arbeta med dem bör du ha kunskap om SQL-frågor. Genom att hänvisa till följande länkar kan du hitta några av handledningarna om SQL. w3schools,tutorialspoint
Efter att ha lärt dig grunderna bör du behöva bygga några exempel på projekt för att vässa dina färdigheter. Nedan följer några exempel på projekt som du kan bygga.
Backend för e-handelssajt
Backend för att göra-appen
Messenger-appens backend
Eftersom backend-serverns slutpunkter är tillgängliga för alla bör du också behöva tänka på säkerheten. Annars kan hackare komma åt data och se dem. Det är inte heller bra för dig och din produkt. Därför spelar säkerhet en viktig roll i backends.
Handledningar för att lära dig om backend-programmering
