Найкращий спосіб дізнатись про веб-розробку Frontend

Чому веб-розробка?

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

Хмарні додатки дозволили нам важко підняти хмару та використовувати браузер як міст для підключення потужних серверних серверів з менш спроможними та потужними інтерфейсами.

Зараз найкращий час для вивчення веб-розробки, якщо ви хочете чомусь навчитися.

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

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

Тепер, коли ми встановили той факт, що Інтернет є найкращим способом перейти зараз, давайте подивимось, як навчитися веб-розробці найкращим чином.

Мережа обширна - починайте з малого і тримайте її маленькою

Ви, мабуть, бачили велику кількість фреймворків JavaScript і бібліотек, таких як React, Angular, Vue, Ember, jQuery, XYZ тощо.

Деякі найпоширеніші запитання, які я отримую, коли YouTube публікує вміст веб-розробки, такі:

Чи варто вчитися X?

Х кращий за Y?

Яка сфера застосування Z?

Завжди пам’ятайте дві речі про технології, особливо про Інтернет:

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

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

Почніть з HTML та CSS

Я не можу наголосити на цьому досить. Мені боляче бачити, як тонна людей задає мені запитання щодо своїх проектів React, коли відповідь лежить у базовому HTML або CSS.

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

Завдяки вдосконаленню веб-стандартів, ви можете досягти стільки всього, що лише в CSS. Для багатьох речей JavaScript навіть не потрібен.

Анімація? Ти зрозумів. Перетягни та Впусти? HTML може це впоратись. Макети? Оформіть API Flexbox або Grid CSS!

Існує так багато речей, які ви можете дізнатись про HTML та CSS! Не поспішайте просто поспішати з JavaScript, тому що всі круті діти в блоці - у Angular. Ці бібліотеки та фреймворки нікуди не діваються. Не поспішайте .

Зайти вглиб чи заглибитися?

Існує два підходи, коли ви вивчаєте веб-розробку - ширше або глибше.

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

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

То яке рішення? Відповідь, на диво, не робити ні того, ні іншого. Виберіть невеликий технологічний стек, такий як HTML / CSS / JavaScript, і поглиблено поглибте всі три. Це має кілька переваг:

  1. Вам не буде нудно, оскільки всі троє мають порівняно різні цілі, і ви пишете їх по-різному.
  2. Ви можете поєднати всі три, швидко створити і побачити щось значуще, не роблячи місяців зусиль (чого зазвичай вимагають інші мови, такі як C / C ++). Це буде тримати вас мотивованими продовжувати йти далі.

Не вибирайте React, або Angular, або Vue

Коли люди починають працювати з JavaScript, виникає бажання підібрати бібліотеку, як React, систему інтерфейсу, як Material UI, і зануритися у створення чудових речей.

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

Зверніть увагу, що я використовував слово, що застосовується, а не вчиться, у попередньому реченні. Існує величезна різниця між вивченням чогось та застосуванням чогось, що ви дізналися.

Створіть невеликий, але робочий проект за допомогою HTML / CSS / JavaScript. А коли ви це зробите, створіть ще один, а потім створіть інший проект.

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

Розумієте, існують фреймворки, щоб вивантажити з вас повторювані роботи. Їх не існує, щоб ви ігнорували те, що насправді відбувається під капотом, і покладалися на той факт, що це все магія.

Перший раз, коли ви вибираєте фреймворк на зразок React або Angular для своїх проектів, слід, коли ви впевнені, що можете створити цей проект без React або Angular .

Майстер однієї професії

Тепер, коли ви добре володієте HTML / CSS / JavaScript, настав час перейти до галузевих стандартів. Правда в тому, наскільки б ви не були хорошим розробником JavaScript, вам часто доведеться працювати з сучасними фреймворками, такими як React, - і просто, володіючи знаннями JavaScript, ви не можете відразу опанувати його.

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

Як, можете запитати? Відповідь проста - це вирішувати вам. Створіть простий проект у всіх основних фреймворках (Angular, Vue та React) і подивіться, який із них найбільше впливає на вас. Виберіть один і не озирайтеся назад

Потім створіть усі свої проекти за допомогою цього фреймворку. Прагніть робити те, чого ви ще не знаєте, як робити. Це найкращий спосіб витіснити себе зі своєї зони комфорту і дізнатися нове .

Але не забувайте про інших

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

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

Це може включати декілька речей - наприклад, модульне тестування за допомогою Jest, наскрізне тестування за допомогою Cypress, Webpack, Babel або Parcel, трохи devops, сценарії оболонок Linux, розгортання серверів тощо.

Ви завжди можете швидко навчитися основам цих навичок, оскільки вони існують вже давно, тож у них є багато корисного матеріалу.

Рухайся

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

Інтернет. Є. Величезний.

Тож якщо ви закінчили роботу з HTML / CSS / JavaScript / React / Angular / Vue, перейдіть до серверів. Дізнайтеся про розгортання сервера, NGiNX, HAProxy, балансування навантаження, налаштування хмарної інфраструктури, брандмауери та автомасштабування.

Покінчити з цим теж? Перейдіть до WebAssembly, мови для наступної ітерації Інтернету.

Закінчили навчання WebAssembly? Помиляйте, я тоді не знаю. Можливо, перейти до інших програмних напрямків, або приготування їжі? :)

Висновок

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

У вас є так багато доступних ресурсів, і я працюю над одним, щоб веб-розробники могли навчитися! Ось мій канал на YouTube, де я навчаю вас програмуванню чудових речей. І ось платформа codedamn - фактична платформа, яка дозволяє стати чудовим розробником, поєднуючи купу відео, статей та вправ.

Повідомте мене, що ви думаєте про цю статтю та веб-розробку в цілому, через мої твіттери та Instagram. Я хотів би зв’язатися з вами там!

Мир!