Samband och Värdering vid val av programmeringsteknik vid utveckling av dynamiska webbplatser

📜 Webbhistorik och jämförelse

Långt tillbaka i början av webben, fanns bara statisk webbplatser som innehåller enkel HTML. Den första webbplatsen i historien, byggdes av Tim Berners-Lee 1990. För cirka 20 år sedan insåg företag som Microsoft och Macromedia att människor behövde verktyg för att bygga webbplatser. Problemet som utvecklarna kom emot var att om de hade en webbplats med 20 eller 100 sidor och om de behövde uppdatera huvudmenyn på deras webbsidan, var de tvungna att uppdatera alla 10 eller 20 eller 100 sidor, vilket var riktigt tråkigt. En av lösningarna på detta problem var att skapa så kallade DWT, eller dynamiska webbmallar. Man skapar en mall som innehåller de vanliga elementen, som huvudmenyn och sidhuvudet och sidfoten, och sedan definierar man redigerbara områden, sedan använder man den mallen för att skapa nya sidor, vi redigerar bara de redigerbara områdena, sedan mallen tar hand om resten . Och sedan kör vi en liten process, och ut kommer de statiska HTML-sidorna. tre år efter den första webbplatsen infördes Common Gateway Interface (CGI) och tillät webbplatser att kommunicera med en databas. Efter ungefär tio år till hade webben utvecklats långt bortom DWT till vad som kallas CMS eller Content Management Systems. CMS, som Drupal och WordPress tog ett nytt och revolutionerande tillvägagångssätt för problemet med att hantera ett 1000 tal sidor på en webbplats. Alttså i stället för att använda dynamiska webbmallar och automatiskt generera statiska sidor introducerade de ett PHP-baserat mallsystem som genererade sidor snabbt när användaren begärde dem genom att hämta data från en databas och placera dessa data i mallar. Strax efter ytterligare 10 år med DWT och fram till idag dominerar CMS nätet. Men det fanns ett problem till , lot oss säga att om en webbplats är populär med tiotusentals eller mer besök per dag, då genererar sidor hela tiden enorma serverkostnader. Så utvecklare har börjat cacha sina sidor, de lagra statiska versioner av sidorna på och utanför CDM och sedan servera dem istället för de genererade sidorna.

Gatsby som anväder JavaScript React framework och andra statiska webbplatsgenererande lösningar liksom Hugo som är uppbyggde av GO , Jekyll uppbyggde av Ruby, Nikola skrivet i Python, ReactStaic som använder react för att generera statiska sidor, till skillnad från Gatsby ReacStatic beror inte på GraphQL och slutligen VuePress vilet är en minimal installation med markdown projektstruktur som hjälper utvecklare att fokusera på att skriva.

Denna statisk generator lösningar som nämnts ovan, kommer med moderna verktyg vilket är resultatet av lång work på 20-åriga sedan. Men det finns en viktig skillnad till de andra statiska generatorlösningar att med Gatsby kan man hämta innehåll från vilken datakälla som helst, blanda och samla in data på vilket sätt man vill och skapa avancerade dynamiska mallar för att generera dessa statiska sidor, det här är vad Gatsby-teamet kallar Content Mesh. Så med Gatsby är allt gammalt nytt igen och vad som är nytt kommer att forma nätets framtid tror jag.

I den ovannämnda statiska webbplatsgeneratorn behöver vi några verktyg i vår "web development toolkit". För det första behöver vi en goda förståelse för grunderna, HTML eller Pug vilket är en elegant html som fungerar bra med nodejs, den är strukturerad med "indent" och kort syntax som gör koden läsbar snabbare än att kolla på all html-filen för att hitta det element som behövs. För det andra behöver vi också goda kunskap om CSS, SAAS eller LESS, naturligtvis har man med SASS eller Less några alternativ som inte erbjuds av CSS ensam, till exempel variabler som man skappas och används igen senare, också matematiska funktioner eller matematiska operationer, och en annan fördel med SASS är möjligheten att ställa in "loops".I Sass finns också mixins mallar som man kan skapa dem själv ... sedan behöver man känna til modern JavaScript. Därefter behöver man lite kunskap med att arbeta med kommand lines och npm.

Styling i Gatsby, React , Angular VueJs Next och även Laravel hanteras på samma sätt, det vill säga att det finns ingen standard för hur man hanterar stilar och CSS. Istället har man flera tillvägagångssätt och man kan mixa och matcha vilket som passar best me kodningsmetod och krav man behöver uppfylla. Det finns fyra huvudmetoder för stilar och CSS: Vanlig CSS (old fashion) , CSS-moduler vilket är ett tillvägagångssätt utformat för att lösa problemet med det globala scope i CSS, CSS ramverk, de mest kända Css ramverk är Bootstrap, Tailwind, Materialise och Bulma, det är sant att css ramverk gör vårt jobb enklare men Jag gillar personligen inte css-ramverk eftersom jag har använt i olika projeker, det gör html-koden väldigt ful med de variabler och classer <div class="mt-4 md:mt-0 md:ml-6">. Det sista huvudmetod är CSS-in-JS som tillåter JavaScript-utvecklare att skriva JavaScript även när hen skriver CSS, och det kopplar också stilen direkt till det element som utformas, vilket gör det enkelt att förstå vad som händer.Men från vad jag sa var jag mer i den styled komponentent, jag har nyligen kännat till styled komponentent template som varit introducerad av min Lärare Sohail. Anledningen till varför jag tyckte om styled component är att du har frihet att bygga anpassade komponenter med CSS och ingen klasspolicy och det inkluderar nested stilar som i Sass.

💭 Slutsats

Oavsett om du vill använder Gatsby, Vue Js, Next, Angular eller andra programmeringstekniker detta beror väldigt mycket på ditt användningsfall. Nu när jag vet hur man sysslar med gatsby föredrar jag att det bästa att använda den för att skapa min blog än att använda wordpress som är ett gammalt CMS och om vi tittar på internet vet man direkt vilken webbplats är gjord av wordpress eftersom mallarna ser ut i de flesta fall samma. Gatsby är väldigt snabb jämfört med wordpress och webbsidor som är uppbyggda med gatsby rankas verkligen högre i googles sökresultat. Idag i denna innovativa världsteknik bör vi sätta ett mål och skäl för att välja det rätta programmeringsteknik vid utvecklingen och det finns viktiga punkter att känna till innan vi sätter igång. Det första punk som utvecklare eller företag behöver man tänka på tid för att koda och uppbygga all project. Som utvecklare måste jack också välja det lämplig ramverket som användes mer i någon specifik länd där jag bor i, till exempel i Indien använder de mest Angularjs än Reactjs ramar enligt google trends också behöver man tänka på framtida ramverkets stöd, vad är fördelen med att välja ett ramverk som inte kommer att stödjas i framtiden? i så fall får vi mycket problem med säkerhet och ramverketshantering, då jag föredrar att välja den sista programmeringsteknik liksom ✔️ React eller ✔️ Vuejs för att bygga mina komplexa projekter, dessa två ramverker är mest kända och de attrahera många företag att jobba med.