Kurs Java

Bootstrap & Material

Tu jesteś
Java - Mapa kariery Tu jesteś 7 Aplikacja Webowa
[BACKEND]
8 Mikroserwisy
Webserwisy
[BACKEND]
Tworzenia backendu mikroserwisów można
uczyć się już gdy tylko opanujemy Springa,
albo też dopiero po zdobyciu
nieco prostszej umiejętności tworzenia
backendu aplikacji webowej.
Mówimy prostszej, ponieważ najczęściej
frontend aplikacji webowej tworzy
z backendem relacje 1:1.
Natomiast mikroserwisy to zwykle
środowisko rozproszone, co często
prowadzi do sytuacji,
w której występuje kilka "frontendów"
komunikujących się z kilkoma "backendami".
9 HTML, CSS, Sass
Po opanowaniu backendu można
rozwijać się w stronę pozycji fullstack
dewelopera. W tym celu wymagane
jest nauczenie się kolejnych rozwiązań
frontendowych. Oczywiście nic nie stoi na
przeszkodzie, by rozwijać się w kierunku
frontendu już w trakcie nauki backendu.
10 Bootstrap
 Material
11 Javascript 12 Typescript 13 Angular / React / Vue.js 14 Aplikacja Webowa / Mikroserwisy
[FULLSTACK]
StartAPPa
Przystanek Backend
Przystanek Fullstack
Zanim pojawił się Typescript i Angular,
programowanie kodu działającego po
stronie przeglądarki wykonywane było
najczęściej za pomocą jQuery.
Obecnie jQuery jest używane w starych
systemach oraz służy jako dodatkowe
wsparcie dla Angulara oraz Typescriptu.
Niemniej, zgodnie z dobrymi praktykami,
nie zaleca się mieszania tych rozwiązań.
Kolejnym punktem w drodze do kariery fullstackowca jest zapoznanie się z mechanizmami ułatwiającymi pracę nad warstwą wizualną strony, portalu czy też aplikacji. W tym miejscu przedstawimy zajawkę na temat najpopularniejszych (subiektywnie) obecnie rozwiązań na rynku. Mowa oczywiście o Bootstrapie i Material Design.

Bootstrap

Bootstrap to platforma CSS o otwartym kodzie źródłowym, która jest bezpłatna i używana głównie do tworzenia responsywnych widoków gotowych do wyświetlenia zarówno na komputerze, jak i na urządzeniach mobilnych. Oznacza to, że framework pozwala tak napisać style, aby nasza strona wyglądała dobrze zarówno na dużym ekranie o rozdzielczości 1920 x 1080, jak i na smartfonie o rozdzielczości 360 x 640 pikseli.

Framework został stworzony przez programistów Twittera (Mark Otto and Jacob Thornton) w celu rozwiązania problemów ze spójnością obsługi wewnętrznych narzędzi. Projekt nazywał się wtedy Twitter Blueprint. Okazał się na tyle dobrym patentem, że w 2011 roku został udostępniony publicznie, a jego nazwę przemianowano na Bootstrap.

Tak naprawde obecnie Bootstrap to coś więcej niż tylko platforma CSS. To zbiór narzędzi do programowania w HTML, CSS i JS (Javascript). Udostępnia cały system predefiniowanych styli oraz szablonów, a także posiada bogaty zestaw pluginów JS. Pluginy są dostępne w wersjach podstawowych i są oparte o jQuery, ale można też znaleźć praktycznie wszystkie możliwe kombinacje pluginów do Angulara.

Nasza aplikacja oraz cały portal zostały napisane z użyciem Bootstrapa. Obecnie dostępna jest wersja 4 ale wersja 3 też prezentuje się całkiem nieźle. Aby zacząć przygodę z Bootstrapem potrzeba niewiele. Wystarczy zacząć od kursu dostępnego pod pierwszym linkiem poniżej.

Przydatne linki:

Bootstrap 3 Tutorial
Bootstrap 4 Tutorial
Bootstrap - Szybki start
UI Bootstrap - AngularJS
NG Bootstrap - Angular

Material Design

Material Design to "język projektowania" stworzony przez Google w 2014 roku. Określa on zestaw wytycznych, które pokazują, jak najlepiej zaprojektować stronę internetową. Wskazuje jakich przycisków używać, jak je animować lub gdzie je umieścić. Nastawiony jest bardzo mocno w stronę urządzeń mobilnych, niemniej doskonale sprawdza się również na większych urządzeniach.

Podobnie jak w przypadku Bootstrapa, Material Desing jest dostarczany z wieloma komponentami, które zapewniają podstawowy wygląd oraz pozwalają na ich dalszy rozwój. W porównaniu z Bootstrapem, Material jest nieco bardziej atrakcyjny wizualnie dzięki zastosowaniu optymalnej palety kolorów wraz z ciekawymi animacjami. Choć tak naprawdę przy dobrze wykorzystanym potencjale Bootstrapa, też możemy osiągnąć naprawde satysfakcjonujące efekty.

Material Design podobnie jak Bootstrap posiada własny system siatki wspomagający rozkład komponentów, jednak jest on mniej zaawansowany od tego znanego z Bootstrapa. Jeśli chcemy używać Materiala razem z Angularem, również możemy skorzystać ze sporej ilości pluginów dedykowanych temu frameworkowi.

Prawdą jest, że Material wyrósł niejako z potrzeby stworzenia kart na urządzeniach mobilnych i tak naprawdę przez dłuższy czas jego popularność była największa właśnie tam. Przez to niektórym użytkownikom jego wygląd na stronach webowych może nieco kojarzyć się z tym znanym z urządzeń mobilnych.

Przydatne linki:

Material Design
Angular Material
AngularJS Material
Mapa umiejętności programisty Java

Stale się rozwijamy, a więc bądź na bieżąco!
Na ten adres będziemy przesyłać informacje o ważniejszych aktualizacjach, a także o nowych materiałach pojawiających się na stronie.
Polub nas na Facebooku:
Nasi partnerzy: stackshare
Javappa to również profesjonalne usługi programistyczne oparte o technologie JAVA. Jeśli chesz nawiązać z nami kontakt w celu uzyskania doradztwa bądź stworzenia aplikacji webowej powinieneś poznać nasze doświadczenia.
Kliknij O nas .


Pozycjonowanie stron: Grupa TENSE