{"id":3361,"date":"2021-11-08T13:34:52","date_gmt":"2021-11-08T12:34:52","guid":{"rendered":"https:\/\/visionslabs.io\/aky-frontend-framework-zvolit\/"},"modified":"2021-11-08T13:34:56","modified_gmt":"2021-11-08T12:34:56","slug":"aky-frontend-framework-zvolit","status":"publish","type":"post","link":"https:\/\/visionslabs.io\/sk\/aky-frontend-framework-zvolit\/","title":{"rendered":"Ak\u00fd frontend framework zvoli\u0165?"},"content":{"rendered":"\n

V dne\u0161nom \u010dl\u00e1nku sa pozrieme na frontendov\u00e9 frameworky<\/strong>, ktor\u00e9 s\u00fa dnes najbe\u017enej\u0161ie v r\u00e1mci v\u00fdvoja webov\u00fdch aplik\u00e1ci\u00ed.<\/strong> Nadv\u00e4zujeme tak na n\u00e1\u0161 minul\u00fd \u010dl\u00e1nok, ktor\u00fd sa zaoberal NestJS \u2013 backend framework pre webov\u00e9 aplik\u00e1cie<\/a>.<\/p>\n\n

CSS framework vs JS framework<\/h2>\n\n

Najprv si mus\u00edme ur\u010di\u0165, o ak\u00fdch frameworcoch budeme hovori\u0165, preto\u017ee sa t\u00e1to t\u00e9ma da\u0165 poja\u0165 z viacer\u00fdch uhlov. Prv\u00fd uhol je, \u010di ide o CSS framework<\/strong> alebo JS framework. <\/strong>Ak\u00fd je medzi nimi rozdiel? Z\u00e1sadn\u00fd je ten, \u017ee CSS framework<\/em> – ako n\u00e1zov napoved\u00e1 – je hlavne o \u0161t\u00fdloch, grafike<\/strong> a podobne. Naopak JS framework<\/em> je kompletn\u00e1 sada ako grafick\u00fdch, tak funk\u010dn\u00fdch, \u0161truktur\u00e1lnych mo\u017enost\u00ed<\/strong>. Tzn., \u017ee pomocou JS frameworku<\/em> m\u00f4\u017eeme tvori\u0165 SPA<\/strong> (single page application<\/em>) – \u010do s\u00fa plne funguj\u00face aplik\u00e1cie, ktor\u00e9 maj\u00fa svoju logiku. A pomocou CSS framework v\u00e4\u010d\u0161inou pou\u017e\u00edvame ako kni\u017enicu do na\u0161ej webovej aplik\u00e1cie, ktor\u00e1 obsahuje r\u00f4zne defin\u00edcie \u0161t\u00fdlov, fontov pr\u00edpadne nejak\u00fdch komponentov.<\/p>\n\n

Typick\u00fdm z\u00e1stupcom CSS frameworku<\/strong> je Bootstrap<\/a>, ktor\u00fd bol vo svojej dobe ve\u013emi popul\u00e1rny, predov\u0161etk\u00fdm ke\u010f i\u0161lo o MVC frameworky<\/strong> (Model – View – Controller<\/em>), kedy webov\u00e1 aplik\u00e1cia bola ako jednotn\u00fd celok a to ako backend tak frontend. Typick\u00fdm z\u00e1stupcom tak\u00e9hoto MVC frameworku<\/strong> boli (s\u00fa) .NET<\/a> , Laravel<\/strong><\/a>, Symfony<\/strong><\/a>, Zend<\/a> alebo slovensk\u00e9 Nette<\/a>. \u010eal\u0161\u00edmi z\u00e1stupcami CSS frameworkov s\u00fa dnes ve\u013emi popul\u00e1rne Tailwind CSS<\/a> alebo „material design“ Materialize<\/a><\/strong>.<\/p>\n\n

TOP JS frameworky<\/h2>\n\n

Tak\u017ee sme si u\u017e vysvetlili, ktor\u00e9 frontend frameworky<\/strong> n\u00e1s zauj\u00edmaj\u00fa pri tvorbe webov\u00fdch aplik\u00e1ci\u00ed <\/strong> a to konkr\u00e9tne JS (JavaScript<\/em>) frameworky. Je to pr\u00e1ve modern\u00fd pr\u00edstup k v\u00fdvoju webov\u00fdch aplik\u00e1ci\u00ed, kedy vzl\u00e1\u0161\u0165 vyv\u00edjame backendov\u00fa aplik\u00e1ciu<\/strong> (server<\/em>) a frontendov\u00fa aplik\u00e1ciu<\/strong> (client<\/em>), ktor\u00e9 spolu komunikuj\u00fa pomocou API<\/strong> a to ako vo forme REST API <\/strong>(REpresentational State Transfer<\/em>) alebo GraphQL API<\/strong>.<\/p>\n\n

Teraz sa u\u017e m\u00f4\u017eeme pozrie\u0165 na zoznam najpou\u017e\u00edvanej\u0161\u00edch JS frameworkov.<\/p>\n\n

N\u00e1zov JS frameworku<\/th>Logo<\/th>URL<\/th><\/tr><\/thead>
React<\/strong><\/td>\"React\"<\/td>https:\/\/reactjs.org\/<\/a><\/td><\/tr>
Angular<\/strong><\/td>\"angular<\/td>https:\/\/angular.io\/<\/a><\/td><\/tr>
Vue.JS<\/strong><\/td>\"vuejs\"<\/td>https:\/\/vuejs.org\/<\/a><\/td><\/tr>
Svelte<\/strong><\/td>\"svelte\"<\/td>https:\/\/svelte.dev\/<\/a><\/td><\/tr>
Backbone<\/strong><\/td>\"backbone<\/td>https:\/\/backbonejs.org\/<\/a><\/td><\/tr>
Ember<\/strong><\/td>\"ember<\/td>https:\/\/emberjs.com\/<\/a><\/td><\/tr><\/tbody><\/table><\/figure>\n\n

Framework, ktor\u00fd sme do tabu\u013eky nezahrnuli, ale zasl\u00fa\u017ei si zmienku, je jQuery<\/a>. Tento framework sa d\u00e1 pova\u017eova\u0165 za ak\u00e9hosi praotca dne\u0161n\u00fdch frameworkov, preto\u017ee sa jedn\u00e1 o prv\u00fd viac roz\u0161\u00edren\u00fd typ. Ale na dne\u0161n\u00e9 po\u017eiadavky u\u017e pr\u00edli\u0161 nie je v hodn\u00fd a zost\u00e1va v podstate hlavne ako doplnok pre webov\u00e9 str\u00e1nky vo WordPresse.<\/p>\n\n

Ke\u010f sa pozrieme na z\u00e1ujem o jednotliv\u00e9 JS frameworky pre webov\u00e9 aplik\u00e1cie<\/strong> optikou ot\u00e1zok vo vyh\u013ead\u00e1van\u00ed na Google pomocou n\u00e1stroja Google Trends<\/a>, tak dostaneme tento obr\u00e1zok.<\/p>\n\n