1 Тема від Kniy

  • Kniy
  • Користувач
  • Поза форумом
  • Дата реєстрації: 25.09.2017
  • Повідомлень: 31
    • Репутація: 8

Тема: Roadmap по frontend

Я бикендер, ніразу не зверстав ні одної сторінки, хіба-що дуже давно коли тільки вчився, табличним способом. Єдине з чим робив, це в готовій верстці розставляв місця для даних. По JavaScript'у часто писав ajax, звичайно використовуючи jquery для роботи з DOM. JavaScript рівень знань: пройшов посібник learn javascript : основи, dom, ajax, OOP і не став йти далі до прототипів.
Звісно колись пройшов всі теги HTML та стилі CSS. Проте через брак практики зовсім не памʼятаю, що там і як там)

Як довго вчитись до такого рівня, щоб бути в змозі на готових дизайні і верстці починити поломану верстку, добавити форму слідуючи дизайну, таблицю, діалогові вікна і тд?

Вірніше, питання буде - що ще треба вивчити для цього?

Програмування, ООП, деякі шаблони проектування - з цим всім маю багато досвіду, тому вивчення api javascript фреймворків не будуть проблемою.

Кому не важко складіть, будь-ласка, roadmap з посиланнями на доки.(можна англійською)

PS: хочу дійти до легкого використання css фреймворків (типу bootstrapcss).

Подякували: 0xDADA11C71

2 Відповідь від 221VOLT

  • 221VOLT
  • 221VOLT
  • ♥ pattern matching
  • Поза форумом
  • Звідки: Львів
  • Дата реєстрації: 26.09.2015
  • Повідомлень: 2 719
    • Репутація: 1876

Re: Roadmap по frontend

бикендер

якщо енд-це кінець, то бикендер - то такий кінець з биком?
чи бик з кінцем? :D

по темі - блочна верстка, флекси, успіхів)

Подякували: Monolith, leofun012

221VOLT вебсайт

3 Відповідь від Kniy

  • Kniy
  • Користувач
  • Поза форумом
  • Дата реєстрації: 25.09.2017
  • Повідомлень: 31
    • Репутація: 8

Re: Roadmap по frontend

типу бик кароче)
Ну.. верстка, я і сам знав, шо мені потрібна верстка. Мені б список тем, з чого почати, посиланнячка на бест парктайси і тд.

4 Відповідь від FakiNyan

  • FakiNyan
  • FakiNyan
  • Робітниця.
  • Поза форумом
  • Дата реєстрації: 27.06.2013
  • Повідомлень: 14 116
    • Репутація: 5674

Re: Roadmap по frontend

будемо друзями?

Подякували: 0xDADA11C71

5 Відповідь від FakiNyan

  • FakiNyan
  • FakiNyan
  • Робітниця.
  • Поза форумом
  • Дата реєстрації: 27.06.2013
  • Повідомлень: 14 116
    • Репутація: 5674

Re: Roadmap по frontend

я тут поки сидів, усвідомив одну просту і геніяльну річ
на ютабі повно стрімів/довгих туторіалів, де фахівці з тих чи інших галузей роблять ті чи інші речі, наприклад - верстають щось.
От можна дивитись ці стрімі, і все, що не є зрозумілим - запам'ятовувати, а потім гуглити інфу по цьому і вчивчати.

Подякували: Monolith1

6 Відповідь від karmeljuk

  • karmeljuk
  • karmeljuk
  • Replace Team
  • Поза форумом
  • Дата реєстрації: 28.01.2014
  • Повідомлень: 1 497
    • Репутація: 816

Re: Roadmap по frontend

Для початку буде достатньо курсів на codecademy.com
А далі більше практики, інакше ніяк
По тегам, атрибутам, css правилам достатньо мати уявлення про 20%, інші 80% майже не використовуються

karmeljuk вебсайт

7 Відповідь від Key

  • Key
  • Key
  • Користувач
  • Поза форумом
  • Звідки: Lviv
  • Дата реєстрації: 27.12.2013
  • Повідомлень: 125
    • Репутація: 85

Re: Roadmap по frontend

Элизабет Фримен, Эрик Фримен. Изучаем HTML, XHTML и CSS
Дэвид Макфарланд. Большая книга CSS3
+ ютуб + практика.

8 Відповідь від FakiNyan

  • FakiNyan
  • FakiNyan
  • Робітниця.
  • Поза форумом
  • Дата реєстрації: 27.06.2013
  • Повідомлень: 14 116
    • Репутація: 5674

Re: Roadmap по frontend

баньте кія за російську

9 Відповідь від javascriptIsLife

  • Звідки: Козин
  • Дата реєстрації: 03.07.2017
  • Повідомлень: 1 306
    • Репутація: 421

Re: Roadmap по frontend

Kniy, як так сталося? Ягадав що таких людей не існує.

Як довго вчитись до такого рівня, щоб бути в змозі на готових дизайні і верстці починити поломану верстку, добавити форму слідуючи дизайну, таблицю, діалогові вікна і тд?

Місяць, два.

Подякували: leofun011

10 Відповідь від Key

  • Key
  • Key
  • Користувач
  • Поза форумом
  • Звідки: Lviv
  • Дата реєстрації: 27.12.2013
  • Повідомлень: 125
    • Репутація: 85

Re: Roadmap по frontend

FakiNyan написав:

баньте кія за російську

Тихенько.
Це назви книг.
Я тут щоб допомагати або щоб допомогли мені а не для вирішення якихось мовних штук.
Якщо маєш переклад українською то знайди і скинь людям.
Я тільки за.

Подякували: 0xDADA11C7, ostap34PHP, sensei3

11 Відповідь від Kniy

  • Kniy
  • Користувач
  • Поза форумом
  • Дата реєстрації: 25.09.2017
  • Повідомлень: 31
    • Репутація: 8

Re: Roadmap по frontend

Там на codeAcademy сучасний гайд?

12 Відповідь від leofun01

  • leofun01
  • leofun01
  • Replace Team
  • Поза форумом
  • Дата реєстрації: 15.03.2014
  • Повідомлень: 3 295
    • Репутація: 2723

Re: Roadmap по frontend

все про HTML5 (w3.org),
CSS (w3.org, сторінка навіть українською),
все про CSS3 (w3.org),
Основи CSS (на w3schools),
Bootstrap v3.3 (оф.сайт),
Bootstrap (на w3schools).

Подякували: 221VOLT, 0xDADA11C72

leofun01 вебсайт

13 Відповідь від karmeljuk Востаннє редагувалося karmeljuk (24.10.2017 11:56:48)

  • karmeljuk
  • karmeljuk
  • Replace Team
  • Поза форумом
  • Дата реєстрації: 28.01.2014
  • Повідомлень: 1 497
    • Репутація: 816

Re: Roadmap по frontend

по правді кажучи, те як подається інформація на w3.org мені зовсім не подобається. Читати вкрай тяжко, а щось розібрати ще складніше. Там по суті нагромадження всіх можливих властивостей, більшість з яких майже не використовуються. Я би радив читати щось бульш інтерактивніше, а ще краще відразу пробувати реалізовувати - на codecademy або схожому сервісу

karmeljuk вебсайт

14 Відповідь від 0xDADA11C7

  • Звідки: Дніпрожидівськ
  • Дата реєстрації: 14.02.2014
  • Повідомлень: 5 707
    • Репутація: 5777

Re: Roadmap по frontend

Там на codeAcademy сучасний гайд?

Так, тіки його замало для повноцінної роботи, але пройти варто.

15 Відповідь від Kniy Востаннє редагувалося Kniy (27.10.2017 12:02:56)

  • Kniy
  • Користувач
  • Поза форумом
  • Дата реєстрації: 25.09.2017
  • Повідомлень: 31
    • Репутація: 8

Re: Roadmap по frontend

Дякую всім, codeAcademy якраз для мене був, осучаснив знання, повторив важливі властивості, типу floating, вирівнювання, box model, reset.css. І головне відкрив для себе grid - якраз те що й хотів найбільше.

    І в мене назбиралось декілька запитань:

    1. Чому в w3school довіднику у властивості "display"

▼Прихований текст

немає значення "grid"?

    2. У w3school написали, що існує 4 методи створення макетів розмітки сайту на секції:

  • HTML tables
    CSS float property
    CSS framework
    CSS flexbox

,
то до якої відносяться методи з використанням властивості grid? І зв'язане питання - і який метод використовує Bootstrap CSS (чи я забіжав вперед? там насправді декілька способів?)

    3. Якими методами створення макетів користуються в сучасності?

16 Відповідь від FakiNyan

  • FakiNyan
  • FakiNyan
  • Робітниця.
  • Поза форумом
  • Дата реєстрації: 27.06.2013
  • Повідомлень: 14 116
    • Репутація: 5674

Re: Roadmap по frontend

Kniy написав:

Дякую всім, codeAcademy якраз для мене був, осучаснив знання, повторив важливі властивості, типу floating, вирівнювання, box model, reset.css. І головне відкрив для себе grid - якраз те що й хотів найбільше.

    І в мене назбиралось декілька запитань:

    1. Чому в w3school довіднику у властивості "display"

▼Прихований текст

немає значення "grid"?

    2. У w3school написали, що існує 4 методи створення макетів розмітки сайту на секції:

  • HTML tables
    CSS float property
    CSS framework
    CSS flexbox

,
то до якої відносяться методи з використанням властивості grid? І зв'язане питання - і який метод використовує Bootstrap CSS (чи я забіжав вперед? там насправді декілька способів?)

    3. Якими методами створення макетів користуються в сучасності?

w3school може проігнорити grid, бо це відносно нова штуковина, і вона доступна не у всіх браузерах http://caniuse.com/#search=grid
bootstrap 3 і нижче має використовувати сітку пороблену на float'ах, а ось bootstrap 4 вже використовує flexbox

Подякували: Kniy, 0xDADA11C7, leofun013

17 Відповідь від leofun01

  • leofun01
  • leofun01
  • Replace Team
  • Поза форумом
  • Дата реєстрації: 15.03.2014
  • Повідомлень: 3 295
    • Репутація: 2723

Re: Roadmap по frontend

Kniy написав:

1. Чому в w3school довіднику у властивості "display"

▼Прихований текст

немає значення "grid"?

Вони ще не оновили списки.
Про display:grid читайте тут і тут.

Подякували: 0xDADA11C71

leofun01 вебсайт

18 Відповідь від kaxesazo

  • kaxesazo
  • Користувач
  • Поза форумом
  • Дата реєстрації: 08.02.2019
  • Повідомлень: 1
    • Репутація: 0

Re: Roadmap по frontend

Як довго вчитись до такого рівня, щоб бути в змозі на готових дизайні і верстці починити поломану верстку, добавити форму слідуючи дизайну, таблицю, діалогові вікна і тд?

Вірніше, питання буде - що ще треба вивчити для цього?

Програмування, ООП, деякі шаблони проектування - з цим всім маю багато досвіду, тому вивчення api javascript фреймворків не будуть проблемою.

Кому не важко складіть, будь-ласка, roadmap з посиланнями на доки.(можна англійською)

PS: хочу дійти до легкого використання css фреймворків (типу https://www.welookups.com/bootstrap/boo … basic.html).

19 Відповідь від FakiNyan

  • FakiNyan
  • FakiNyan
  • Робітниця.
  • Поза форумом
  • Дата реєстрації: 27.06.2013
  • Повідомлень: 14 116
    • Репутація: 5674

Re: Roadmap по frontend

найкращий спосіб розібратись в фреймворкові - почати розбиратись з фреймворком