ITI #8 – Przygoda z bootstrapem

W poprzednim tutorialu zobaczyliśmy przykład użycia bootstrapu. Jeżeli jeszcze nie zrobiłeś tego poradnika od Sebastiana, to zapraszam na http://irys.rocksoft.pl/2017/08/iti-7-prosty-system-logowania. Dla reszty mamy krótki poradnik, który sprawdzi Twoje umiejętności programistyczne i zdolności “googlowania” 🙂

Czym właściwie jest Bootstrap? Jest to jedno z najbardziej znaych narzędzi do tworzenia stron i aplikacji internetowych. Paczka składa się z kombinacji HTML, CSS i JS. Zapraszam do lektury na stronie domowej Bootstrapa oraz innych źródłach wiedzy. Temat jest niezwykle interesujący i może znacząco ułatwić Twoją pracę.

Poradnik będzie składał się z listy kroków/zadań, które zaprowadzą Cię do wyniku.

  1. Utwórz nowy projekt na swoim lokalnym komputerze i dodaj Bootstrapa do głównego pliku, który będzie jako pierwszy uruchamiany po wejściu na stronę.
  2. Zmodyfikuj menu w template zwanym “Starter Template”. Elementy menu, które mają się pojawić to: Home, About Me oraz Contact.
  3. Strona Home będzie zawierała domyślną stronę template’u.
  4. Strona About Me ma otworzyć inną stronę, która ma być podzielona na kolumny w stosunku 1 i 2. W kolumnie z lewej strony ma się pojawić zdjęcie użytkownika i krótki opis lub motto. Z prawej strony ma się pojawić dłuższy opis + mapka lokalizacji zamieszkania.
  5. Strona Contact powinna zawierać formularz: Nadawca, Tytuł, Wiadomość, Przycisk “Send”. Formularz nie musi wysyłać wiadomości. Punktowana jest tylko struktura HTML.

Ocena będzie zależna od pomysłowości oraz od ilości zrobionych punktów – za każdy punkt otrzymasz 2 diamenty.

“Diamenty na szóstkę”. Dodatkowo będzie można zarobić 5 diamentów za stworzenie jednej strony (layout) z wykorzystaniem podstron. Można do tego użyć języka PHP lub JS.

Całkowita liczba diamentów do zdobycia: 15!

 

 

Form could not be loaded. Contact the site administrator.
Piotr C

Piotr Czyż

Programista z pasją. Zainteresowanie w nowych technologiach i automatyce. Hobbystyczny bassista.

Like
Like Love Haha Wow Sad Angry
2

3 Replies to “ITI #8 – Przygoda z bootstrapem”

  1. Muszę się bardziej zagłębić w temat bootstrapa bo coś czuję, że to może być interesujące

  2. Bardzo mi się podoba taki typ poradników że są zadania i sam musisz coś zrobić a nie tylko kopiować linie kodu. Thumbs up za pomysł

  3. Bootstrap to duże ułatwienie, oby więcej tego typu zadań.

Dodaj komentarz