Укр Рус
Який фреймворк обрати Front-end розробнику-початківцю

Який фреймворк обрати Front-end розробнику-початківцю

  • 10 грудня, 2021
  • читати 7 хв
Сергій Журавель
Сергій Журавель Lead Front-end Developer у Temy, Викладач Комп'ютерної школи Hillel.

Для багатьох людей IT — це окремий світ, в який багато хто хоче потрапити і зробити кар'єру.

У цьому світі існує багато країн, у яких розмовляють різними мовами — мовами програмування. Одна з таких країн — це веб-розробка. Веб-розробка своєю чергою ділиться на Front-end та Back-end.

Сьогодні поговоримо про Front-end розробку, а точніше про фреймворки, які використовують Front-end розробники, і про те, який фреймворк краще обрати розробнику-початківцю.

Розвиток веб-додатків та JS фреймворків

Колись для людства можливість написати повідомлення на глиняній табличці, передати цю табличку іншій людині в сусідньому поселенні, щоб вона могла її прочитати, стала справжнім проривом і піком прогресу.

Так і у світі IT — перша веб-сторінка, яка дозволяла перейти на іншу сторінку за допомогою гіперпосилання, була просто дивом та небувалою подією, яка перевернула весь світ. Сьогодні для нас така проста сторінка здається такою ж примітивною, як і та глиняна табличка, а веб-сторінки та їх розробка стали дуже складними та дорогими.

Разом з розвитком веб-сторінок розвивалися інструменти розробки. Здається, ще зовсім недавно найкрутішим і найвідомішим фреймворком був jQuery.

Що таке фреймворк? Це каркас, який значно полегшує процес об'єднання певних компонентів під час створення коду.

jQuery, однак, не вистачало можливостей послідовної обробки даних за представленими уявленнями. Для вирішення цієї проблеми була створена ціла плеяда фреймворків, які дуже швидко стали популярними, наприклад, Backbone, Knockout та Ember. Події розвивалися швидко, і на зміну цим фреймворкам прийшли фреймворки іншого рівня: Angular, React, Vue.

Про них і поговоримо.

AngularJS та Angular 2+

AngularJS був випущений у жовтні 2010 року і дуже швидко став найпопулярнішим MVC-фреймворком JavaScript. Він пропонував двостороннє зв'язування даних (two ways binding), впровадження залежностей (dependency injection), роутинг та багато іншого.

AngularJS допоміг розробникам вирішити безліч проблем, з якими вони стикалися у роботі над веб-додатками. Але водночас AngularJS приніс і свої проблеми. Також зростала складність AngularJS.

Команда AngularJS розуміла, що «корабель йде не туди», і прийняла рішення повністю переробити фреймворк і назвати його Angular 2. До речі, це перейменування принесло чимало плутанини, багато розробників досі не завжди розуміють різницю в назвах. Новий фреймворк називається Angular (у співтоваристві його часто називають Angular 2+), а старий — AngularJS.

На жаль, ця нова версія була абсолютно несумісна з AngularJS. Немає міграції з AngularJS на Angular. Це розчарувало багатьох розробників, які використовували AngularJS, і призвело до повної відмови від цього фреймворку. З того часу Angular так і не повернув собі популярність, хоча сам фреймворк дуже гарний.

React

У травні 2013 року на конференції з JavaScript у США було представлено нову бібліотеку, яка змінила правила гри на ринку веб-розробки — React.

Багато хто думає, що творцем або співзасновником React був Ден Абрамов, але це не так. Створив її Джордан Вовк (Jordan Walke), інженер із Facebook. Ден Абрамов створив Redux двома роками пізніше. Redux став супер популярним, а Ден Абрамов став частиною команди React.

Ще на конференції аудиторія була захоплена багатьма інноваційними функціями React, такими як віртуальний DOM, одностороння передача даних та Flux-шаблони. Після цієї конференції React набула великої популярності, яка продовжує зростати й у наші дні.

До речі, не закінчуються суперечки, чи можна назвати React фреймворком.

З одного боку, React справді лише UI бібліотека. На відміну від інших фреймворків, для повноцінної роботи розробнику необхідно додатково встановити набір інших бібліотек (наприклад, Redux, React-router, Axios тощо). У той же час, у Angular все це є з коробки. Спочатку деякі бібліотеки (наприклад, роутинг) входили до складу React, але були винесені окремо для більшої гнучкості. Коли я називаю React фреймворком, то маю на увазі не лише бібліотеку React, а й всю її екосистему.

Як би ми її не називали, але залишається фактом, що на сьогоднішній день React — це найпопулярніша JavaScript-технологія. Екосистема бібліотек та інструментів для React багата та різноманітна. Якщо ви використовуєте React, то підібрати бібліотеку, яка вирішить вашу проблему, зазвичай легко.

Рекомендуємо курс по темі

Vue.js

Падіння фреймворку AngularJS призвело до того, що розробники почали шукати інші варіанти. Хтось перейшов повністю на React, а хтось продовжував пошуки. Можливо, частково через це з'явився новий фреймворк, який мав спільні риси з Angular та React.

Vue.js вийшов у лютому 2014 року і досить швидко став популярним. Розробив цей фреймворк Еван Ю, який працював у Google та Meteor. Якщо React виділяється своєю гнучкістю, а Angular — строгими правилами, Vue намагається дотримуватися золотої середини.

Vue.js досить легкий фреймворк з гарною екосистемою.

Майбутнє фреймворків

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

Існувала думка, що ось-ось з'являться нові фреймворки, які замінять React та Angular. Наприклад, фреймворк Sapper, який використовує Svelte, подавав великі надії. Багато розробників намагалися вчити його наперед і навіть вже використовувати у своїх проектах, очікуючи, що він стане новою зіркою замість того ж React.

Але це поки не сталося, і швидше за все, на нас чекає ще кілька років стабільності з незмінною трійкою лідерів.

Рекомендуємо публікацію по темі

Найкращі фреймворки для новачків

Існує думка, що саме Angular — найкращий фреймворк для новачків. Справа в тому, що при використанні Angular новачкові не потрібно думати про структуру програми, багато рішень вже прийняті, і потрібно тільки дотримуватися правил, які добре описані в документації.

Єдина проблема з Angular — це так звана крива навчання (learning curve). Щоб почати розробляти на цьому фреймворку, необхідно багато вивчити на початку роботи. Але коли знання отримані, то потім вже все дуже просто, тому що це потужний фреймворк, який містить вирішення багатьох проблем із коробки.

Інша думка — для новачків сьогодні найкращими фреймворками є Vue та React. Чому не лише React?

Справа в тому, що сам по собі React, звичайно, дуже простий. Ви можете не повірити, але React можна вивчити за пару днів. Але щоб розробляти складніші веб-додатки на React, потрібно вивчити багато інших додаткових бібліотек.

У той же час, Vue пропонує багато необхідних інструментів із коробки. Vue запозичив дещо з React та дещо з Angular і часто вважається чимось середнім між цими фреймворками. Хоча самі Vue розробники вважають цей фреймворк найпростішим для новачків.

Який фреймворк краще вивчити першим сьогодні

Я думаю, що всі сучасні фреймворки варті уваги. На кожному з них можна розробляти складні сучасні веб-додатки.

Але для новачків я вважаю найкращим варіантом React — він досить простий, щоби почати з ним працювати. Якщо ви добре знаєте JavaScript, то можна вивчити основи React на курсі React в Hillel, наприклад, і поступово покращувати свої знання вже на практиці, вивчаючи дедалі більше додаткових бібліотек та архітектурних рішень.

Але найголовніше — React розробники сьогодні найзатребуваніші на ринку, тому буде набагато простіше знайти свою першу роботу, володіючи скіл сетом JavaScript і React. До речі, нещодавно ще одна з моїх студенток отримала оффер на позицію React Trainee в одну з топових українських компаній.

А ви вже вчите React?)

Рекомендуємо курс по темі