Що має знати веброзробник у 2023–2024 році

💡 Усі статті, обговорення, новини про Front-end — в одному місці. Приєднуйтесь до Front-end спільноти!

Усім привіт, мене звати Олексій, я Fullstack Web Developer. Останні чотири роки працюю в Ciklum у веброзробці.

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

Так склалося, що зовсім недавно я проводив вебінар для однієї освітньої платформи на тему «Що має знати веброзробник у 2023–2024 році?», і мені довелось замислитись над тим, а що ж ми маємо наразі для створення сучасного вебу? Адже цей «кембрійський вибух» бібліотек та фреймворків заспокоївся, і вже можна зробити певний зріз того, який стек технологій є відносно сталим на сьогодні.

Я гадаю, логічно та доречно розбити матеріал на дві частини, окремо для фронтенда та бекенда. Ця стаття є певним аналізом і роздумами над тим, куди технологічно рухається (або ні) світ веброзробки, і що ми маємо нині. Тож, починаємо розбиратися.

Фронтенд у 2023–2024 році

Звичайно, веброзробник не може не знати основних мов для створення вебу, і ми нікуди не дінемось від «золотого тріо» з HTML, CSS, JavaScript. Це альфа та омега будь-якого вебзастосунку в цілому. Але і тут є про що поговорити та подумати над тим, як ці технології можуть розвиватися у 2024 році.

HTML

Тут насправді мало про що можна сказати, та й загадувати наперед важко. Фінальний стандарт HTML5 зафіксувався у 2014 році, й з того часу мало що змінюється. Ймовірно, шляхом розвитку можливостей JavaScript ми маємо сталу технологію. Тому знати HTML веброзробник має за замовчуванням як у 2023, так і у 2024 році.

CSS

Каскадні таблиці стилів за останні роки «ввібрали» дуже багато можливостей у себе. Чого варті лише верстка грідами, флексами, через gap та створення крутих анімацій тільки за допомогою CSS. Останні специфікації CSS можуть запросто конкурувати з CSS-препроцесорами на кшталт SASS. CSS nesting — як один з прикладів. Тож навіть на Vanilla CSS можна зручно і швидко писати круті стилі для вебінтерфейсів. Але все ж таки можливості препроцесорів типу SASS (SCSS), LESS, Stylus та інших ми будемо використовувати й надалі у 2024 році. Вони також входять в основний набір знань для веброзробника.

CSS-фреймворки

Колишній Twitter (а точніше одна з його команд) подарував нам можливість швидко створювати інтерфейси за допомогою готових компонентів з Bootstrap. Це дозволило економити багато часу для накидування структури вебсторінок і потім кастомізувати стандартні стилі компонентів так, як то потрібно нам за дизайном. Нині переважна кількість вебсайтів, на які ви можете натрапити, використовують саме Bootstrap у своїй основі.

У 2017 році вийшов Tailwind, що вивів використання CSS-фреймворків на новий рівень і дозволив створювати справді кастомні інтерфейси, використовуючи лише штатні компоненти та стилі цього фреймворку. Для новачка він може здатись складним і перевантаженим. Та слід тільки розібратись і навчитись його «готувати»... тут у вас можливості будуть надпотужні.

Проте не лише ними вичерпується список з CSS фреймворків, тож слід хоча б знати та розуміти їхні перспективи та використання.

JavaScript

Ось тут є про що поговорити — найбільше з основного набору інструментів.

Згідно з опитуванням Stackoverflow, JS залишається найпопулярнішою мовою програмування. До речі, одинадцятий рік поспіль.

Без чого ми точно не зможемо обійтись у 2023–2024 році? Без NodeJS та пакетних менеджерів і прогресивних тулзів типу npm, yarn, vite. Але нам ще потрібно робити білди наших застосунків, і тут ніяк без Webpack, який поки все одно є золотим стандартом в JS. Свого часу був варіант спробувати Deno замість нього, та щось пішло не так у його розвитку, і він «здувся» і цікавість до нього поступово зменшується.

Але нещодавно ми побачили реліз Bun 1.0, що вийшов з бети. Він нам обіцяє вбити NodeJS, неймовірну продуктивність і цілу купу інструментів для побудови навіть серверної частини. Поки що це виглядає круто, але тільки на папері, й усе потрібно перевіряти та пробувати. Використовувати для продакшену я б у 2023 році ще не став. Проте наступний рік покаже, чи не повторить Bun долю вищезазначеного Deno.

JS-фреймворки

У 2023 році список основних гравців в рейтингу JS-фреймворків змін не зазнав.

React. Думаю, не стане новиною, що за популярністю в цьому сегменті знань веброзробника у 2023 році є React. Ця бібліотека (але всунемо її в розділ фреймворків 😋) є найпопулярнішою завдяки декільком причинам. По-перше, комʼюніті, яке за обсягами є, мабуть, найбільшим, якщо вірити всім метрикам та опитуванням за останні роки. Також його справді використовують багато проєктів та успішних бізнесів.

Тож знати та вміти використовувати React та весь його «багаж» з різних додаткових бібліотек для нього (що вже фактично є стандартом для React) необхідно буде й у 2024 році.

До речі, на сторінках сайту React ви можете знайти дуже цікаві відео з різних конференцій та мітапів за темою. Також на їхній старій версії сайту лишились посилання на безплатні курси, з яких ви можете почати вивчати розробку на React.

Angular. На мою скромну думку, це прямий конкурент React, з іншою філософією та архітектурою. Проте він має з коробки практично все, що необхідно для побудови сучасних вебзастосунків різної складності. Angular використовує TypeScript, і про нього ми поговоримо трохи згодом. Цей фреймворк має своїх прихильників — і їх багато. Тенденція, думаю, мало зміниться у 2024 році, і він буде займати своє стабільне місце в пантеоні фронтенда.

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

VueJS. Або просто Vue. Це щось середнє між React та Angular, і його сфера застосування лежить від найменших компонентів вебсторінок до середніх за масштабом проєктів для SPA. Де-факто він залишається стандартним для ознайомлення та вивчення у 2023–2024.

Next.js. Це фреймворк для розробки вебзастосунків на основі React. Він спроєктований для створення сучасних та високопродуктивних вебзастосунків і вебсайтів з урахуванням важливих аспектів, як-от можливість серверного рендерингу (SSR), генерація статичних сторінок та підтримка рендерингу на клієнті (CSR).

Цей фреймворк є популярним вибором для розробників, які хочуть створювати високопродуктивний та SEO-оптимізований продукт. Він дозволяє розробникам зосередитися на створенні функціональності застосунку, не вдаючись до деталей налаштування серверного рендерингу та оптимізації продуктивності.

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

htmx. Так, саме маленькі літери в назві. Хочете можливості JS, одразу вбудовані в HTML? Ну то тримайте нову бібліотеку, що зараз дуже піариться в комʼюніті фронтенд-розробників і підняла певний хайп. Як на мене, виглядає досить неоднозначно, та я не знаю, чи став би використовувати htmx у своїх проєктах поки що.

<input type="text" name="q"
    hx-get=" /trigger_delay" 
    hx-trigger="keyup delay:500ms changed" 
    hx-target="#search-results"
    placeholder="Search..."
>
<div id="search-results"></div>

Та, можливо, я помиляюсь, і ця бібліотека стане реально популярною та юзабельною у 2024 році. У будь-якому випадку спробувати варто.

TypeScript

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

Маю думку, що створювати справді масштабовані та підтримувані вебзастосунки без TypeScript сьогодні та найближчими роками буде важко і нерозумно для бізнесу. Оскільки саме він дозволяє уникати багатьох проблем, коли код розростається до дуже великих розмірів. І, якщо ми звернемося до опитування на Stackoverflow, то TypeScript є технологією, що використовують понад 43% відсотків опитаних. А це свідчить про багато чого.

REST API, GraphQL API

Що повʼязує між собою фронтенд та його інтерфейс з бекендом? Звичайно, отримання даних з сервера.

API — це набір правил та інструкцій, які дозволяють різним програмам і сервісам взаємодіяти одне з одним. Інакше кажучи, API дозволяє різним програмам «розмовляти» між собою та обмінюватися інформацією. Але різницю між REST та GraphQL веброзробники мають знати та вміти використовувати й у 2024 році. Тут без змін.

Якщо ви часом не працювали з цими речами, то дуже рекомендую подивитись тут і тут.

Бекенд у 2023–2024 році

Після розгляду фронтенда, перейдімо до бекенд-розробки, яка є важливою частиною будь-якого вебзастосунку. Бекенд відповідає за обробку запитів від клієнтів, взаємодію з базою даних і надання результатів клієнту. Ось деякі ключові аспекти, які повинен знати бекенд-розробник у 2023–2024 роках.

Для створення бекендової частини вебзастосунків у нас є досить багатий вибір з технологій та мов програмування. Розгляньмо основні та найпопулярніші у 2023 році. Думаю, що на 2024 рік тенденція не зовсім зміниться.

Node.js

Node.js залишається популярним серед веброзробників, особливо для створення серверів. Використовуючи JavaScript на обох боках (фронтенд і бекенд), ви можете забезпечити зручну роботу між ними, послуговуючись JSON для обміну даними.

Python

Python також використовується для створення бекенду, особливо завдяки фреймворкам, як-от Django та Flask. Він славиться зрозумілим синтаксисом і великою спільнотою.

PHP

Мабуть, поки що невмируща класика у веброзробці. Ця мова програмування справді має стабільний та дуже хороший розвиток за декілька останніх років. Лідерами у фреймворках у 2023 році досі залишаються Symfony та Laravel. Особливо останній з них все більше додає крутих і зручних можливостей для створення і різних API, і класичного MVC проєктування. Та навіть я, розробник, основним стеком якого є саме PHP та все навколо нього, паралельно у 2024 році пробував би все більше чогось нового, на кшталт Go. Зрештою, повернутися завжди можна, а знання зайвими не бувають.

Але якщо вам цікаво чому слід (або ні) вивчати PHP у 2023–2024 роках, то можете подивитись запис вебінару вашого покірного слуги з відповіддю на це питання.

Java

Наступний класичний гравець у створенні бекенду не тільки для вебу, але й усього, що ми можемо уявити. Й у 2023, і за тенденціями у 2024 році основним фреймворком для вебзастосунків для Java залишатиметься Spring Framework. Мені здається, тут буде без змін.

Ruby

Ця мова разом з фреймворком Ruby on Rails ще декілька років назад створювали досить хороші вакансії для розробників, що перейшли з PHP на Ruby (а так дуже часто траплялось). Але у 2023 році Ruby досить сильно почав втрачати свою популярність, і нові проєкти цією мовою програмування дуже рідко можна побачити. Хіба що проєкти на підтримку чи невеликий апгрейд можуть створювати вакансії у 2024 році. Але це суто моє бачення та прогнозування. Камінням не кидайте!

Go (або Golang)

Ця мова програмування, розроблена в Google, стала популярною у бекенд-розробці завдяки своїм особливостям та перевагам високої продуктивності, простоті та чистоті синтаксису та іншому. Go має у своєму наборі дуже широкий спектр бібліотек, що дозволяють створювати бекенд частину для вебзастосунків швидко та дуже зручно. Я б дуже рекомендував хоча б придивитись та спробувати цю мову для свого бекенду у вебі у 2024 році.

Бази даних

Якщо ви взялись за бекенд, то від зберігання даних вашого вебзастосунку нікуди не дітись (тільки якщо це не застосунок типу no-state application). А значить, ми матимемо справу з базами даних. І в цьому плані у 2023-2024 роках усе стабільно та змін, по суті, жодних.

Реляційні бази даних. Залежно від проєкту та його потреб ми обираємо щось з SQL-подібних СУБД з уже класичного списку: MySQL, PostgreSQL, MariaDB, SQLite. І, власне, синтаксис та всі інструменти самого SQL знати необхідно й у 2024 році.

NoSQL бази даних. Тут також без сюрпризів. Знаємо, вивчаємо та застосовуємо MongoDB, Redis, Cassandra, DynamoDB.

ChatGPT та AI. Ну й куди ж без штучного інтелекту у 2024 році? А нікуди. Щобільше, ця сфера технологій від нас нікуди не пропаде, й ми будемо взаємодіяти з різними сервісами, побудованими на AI інтенсивніше з року в рік. Тому вміння будувати релевантні запити та промти для того ж ChatGPT — це те, що буде вимагатися все частіше для збільшення продуктивності розробника з будь-якої технологічної сфери. На жаль, на момент написання статті я не знайшов більш-менш зрозумілої статистики щодо використання цього інструменту саме для розробки, але певен, що кількість запитів зростає за експонентою.

Висновки

Які висновки можна зробити з цього експрес-огляду технологій для веброзробки у 2023–2024 році? «Вибухова хвиля» від виходу величезної кількості фреймворків та бібліотек для створення вебзастосунків минула. А основні гравці в цій ніші розробки зайняли свої позиції та стабільно розвиваються й пропонують усе більше зручних і крутих інструментів для розробників. Але, поруч з тим, ми маємо новий технологічний вибух у сфері штучного інтелекту та нові й нові сервіси. Вони дають у руки розробників дуже потужні інструменти й водночас стають певною загрозою, що може залишити девелоперів без роботи (поки що точно ні 😉).

Подивимось, що нам запропонує нового та цікавого 2024 рік. Можливо, нам доведеться кардинально переглянути весь цей список інструментів і зробити новий огляд на технології для вебу в 2025 році, хто зна.

Ваші ідеї щодо усього написаного пишіть у коментарях. Цікаво буде обмінятись думками!