"Софтуерно инженерство"

8 инструмента за подобряване на изживяването на разработчиците

Щастливите разработчици пишат по-добър код

if (developer.happy == true){ jobTask.enjoy(); jobGoal.achieve(); }

За разлика от User Experience (UX) — който е познат термин, който описва опита на потребителите, докато използват приложение, терминът Developer Experience (DX) е по-малко популярен и е второстепенен приоритет в много организации.

Този термин се отнася до взаимодействията и чувствата, които има разработчик на софтуер, докато използва или работи върху продукт, за да постигне конкретна цел. Въпреки че вкусовете на хората са различни, има някои общи елементи, които правят разработчиците по-удовлетворени, продуктивни и по-малко вероятно да напуснат работата си.

В тази статия ще разгледаме концепцията за опит на разработчиците и ще видим как можем да я подобрим.

Table of Contents
What's a Developer Experience?
1. Software Architecture
2. Selection of the Programming Language
3. Project Setup and Code Formatting
   ∘ Prettier
   ∘ ESLint
4. Scaffolding Tools
5. Live Reload
   ∘ Frontend
   ∘ Backend
6. Debugging
7. Accelerate the Feedback Loop
8. Get a Grip on Time Wasters
Final Thought

Какво е опит на разработчици?

Компютърните учени Фабиан Фагерхолм и Юрген Мюнх от университета в Хелзинки¹ разделят опита на разработчиците на преживявания с инфраструктурата за разработка, емоционалното отношение към работата и стойността на собствения принос:

  1. Инфраструктурата включва разработка, инструменти за управление, езици за програмиране, библиотеки, платформи и методи.
  2. Как се чувстват разработчиците относно работата си зависи от уважението, солидарността, чувството за принадлежност, наред с други фактори.
  3. Стойността на вашия собствен принос може да бъде измерена чрез разглеждане на връзката между вашите собствени цели, тези на проекта, върху който работите, и личния ви ангажимент.

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

По-долу е даден списък на някои елементи, които допринасят за добър DX.

1. Софтуерна архитектура

Докато архитектурирате вашия софтуер, трябва да имате предвид размера на проекта и уменията на вашия екип и да запомните, че една проста архитектура може да има повече болка по-късно, докато сложната означава повече болка сега.

Архитектура, която е трудна за разбиране или използване, създава разочарование и води до лошо изживяване на разработчиците. Ако работата по вашия проект е достатъчно мъчителна, талантлив разработчик ще се възползва от друга възможност и ще си тръгне. Но ако той е доволен от вашия дизайн, това ще се отрази в неговия резултат.

2. Избор на език за програмиране

Ако сте фронтенд разработчик и искате да направите живота си малко по-лесен, изберете да използвате TypeScript вместо JavaScript.

Безопасността на типа, осигурена от TypeScript, и поддръжката на IDE — като Visual Studio Code или WebStorm — ускорява откриването на много грешки, като например достъп на атрибут до недефинирана или нулева стойност.

Но TypeScript предлага много повече функции, които не можете да използвате с JavaScript, като тип шаблонен литерал, JSX Factories и рекурсивни условни типове.

3. Настройка на проекта и форматиране на код

За да работите възможно най-ефективно и да избегнете загуба на време за повтарящи се задачи, е важно да имате добра функционалност за автоматично довършване и други полезни функции, които много съвременни IDE носят със себе си.

Също така е важно за доброто изживяване на „разработчиците“ да сведете до минимум времето, което трябва да отделите, за да форматирате изходния си код и да го почистите, като премахнете неизползваните променливи или организирате командите за импортиране.

Като коригирате настройката и конфигурацията на вашия проект, ще автоматизирате такива задачи.

Линтерът автоматично ще гарантира, че определени правила за форматиране и стил на кода — като отстъп или максимална ширина на линията или === вместо == — се прилагат във вашия проект.

По-хубава

Prettier е популярен инструмент за форматиране на код в света на JavaScript. Той идва със стандартни предварително конфигурирани правила, но можете да го коригирате според вашите собствени изисквания.

ESLint

ESLint анализира вашия код за грешки в стила и кодирането и ви помага да предотвратите грешки, като ви дава например предупреждение, ако използвате променлива, без да я декларирате. Той има много стандартни правила и набор от специфични за проекта допълнителни правила за различни типове проекти, които можете да променяте според нуждите.

Можете да използвате npm или yarn, за да инсталирате ESLint:

npm install eslint --save-dev

# or

yarn add eslint --dev

4. Инструменти за скеле

За да спестите време по време на настройката на вашия проект, можете да използвате наличните инструменти за скеле. Те генерират код и доставят напълно конфигурирано приложение, което може да служи като скелет за по-нататъшно развитие.

Модерните рамки носят свои собствени чудесни инструменти за скеле със себе си:

  • Рамките Angular, Vue и React имат свои собствени интерфейси на командния ред (CLI) за скеле.
ng generate library custom-autocomplete
ng generate component components/mat-dynamic-table
ng generate directive directives/click-outside
ng generate pipe pipes/calculate-total
  • От страна на сървъра са полезни инструменти за скеле като AWS CDK CLI от AWS и NestJS CLI от NestJS.
  • Има и yeoman, което позволява на разработчиците да създават свои собствени чертежи за скеле и да ги споделят с общността.

5. Презареждане на живо

Инструмент за презареждане на живо автоматично открива всички актуализации на изходния код и автоматично рестартира приложението, така че вашите промени да се отразяват директно в работещото приложение.

Frontend

От страна на интерфейса, презареждане на живо означава, че уеб приложението се актуализира автоматично в браузъра веднага щом запишете файл, който сте редактирали.

Функция за презареждане на живо е налична в много рамки.

Бекенд

Ако сте бекенд разработчик, презареждането на живо означава, че новодобавените крайни точки могат да бъдат тествани бързо с помощта на API инструмент, като Swagger, Insomnia или Postman.

Swagger UI е инструмент за указване на REST API. Той показва автоматично генерирана документация с функция „Изпробвайте“, която позволява на разработчиците да тестват API директно.

6. Отстраняване на грешки

Добрият опит на разработчиците означава също, че можете лесно да експериментирате с изходния код. За да направите това, приложението трябва да е лесно за отстраняване на грешки по време на изпълнение.

IDE като Visual Studio Code, IntelliJ Idea и WebStorm имат вградена функция за отстраняване на грешки, за да ви улесни тази стъпка. Всички често срещани браузъри, като Chrome или Firefox, предлагат и вграден дебъгер за уеб приложения.

7. Ускорете обратната връзка

Получаването на обратна връзка възможно най-рано относно това, което сте направили, ви позволява да отговорите на изискванията на клиентите и да реагирате бързо на промените.

Да приемем, че сте били помолени да внедрите нов потребителски интерфейс, който съдържа „поле за автоматично попълване със сложна функция за търсене“. По-късно се оказа, че клиентът изобщо не се нуждае от това поле. Ако първо поискате обратна връзка след завършване на внедряването, бихте загубили много време, което не е било необходимо.

На техническо ниво кратък цикъл на обратна връзка означава отразяване на въведените промени в работещото приложение възможно най-бързо, за да се открият грешки за кратък период от време.

Интегриран линтер във вашето IDE ще ви уведомява за грешки, докато пишете по време на компилиране. Но грешките, които стават видими само по време на изпълнение, са тези, които имат най-бавната верига за обратна връзка.

8. Вземете контрол над прахосниците на време

Факторите, които се възприемат като отнемащи време и забавящи процеса в ежедневната работа, трябва да бъдат минимални. Ето няколко примера:

  • Хардуер, който вече не е подходящ за задачата за разработка.
  • Някои инструменти могат да бъдат заменени с други, които предлагат по-удобни функции: например замяна на TSLint с ESLint.
  • Ако вашият екип има повече опит с някои инструменти или рамки от други, трябва да вземете предвид този фактор.

Последна мисъл

Доброто изживяване на разработчиците прави разработчиците щастливи, по-ефективни и по-малко вероятно да напуснат работата си. Това води до повишаване на производителността и качеството и надеждността на продукта.

Въпреки че в тази статия видяхме само технически съвети за подобряване на този аспект, увеличаването на забавлението и удовлетворението от работата зависи от много повече критерии като нетоксична работна среда и психологическа безопасност в екипа.

Надявам се да получите някои прозрения, така че да можете да мислите повече за това, което е важно за вас, за да имате страхотно изживяване за разработчици.

Препратки

¹ Опит на разработчиците: Концепция и дефиниция

² Добро изживяване на разработчиците

Пиша за инженерство, технологии и лидерство за общност от умни, любопитни хора. Присъединете се към моя безплатен имейл бюлетин за изключителен достъпили се регистрирайте за Medium тук.