Маст-хэв инструменты и ресурсы для Front-end разработчика в 2021 году. Часть I
Доброго времени суток, читатели. Сегодня я приготовил для вас список полезных и даже обязательных инструментов и ресурсов, которые помогут вам делать свою работу быстрее и качественнее. Данный материал подойдёт в основном для совсем новичков, но, я всё же надеюсь, что каждый сможет найти для себя что-то, а кто-то вспомнить про существование этого "что-то" :)
1. VS Code
Visual Studio Code - это один из лучших редакторов кода. У программы понятный интерфейс, приятная подсветка синтаксиса, встроенный терминал, большое количество полезных расширений, а также, не менее огромное количество цветовых тем и оформлений на любой вкус.
Кстати, говоря о расширениях. Поделюсь списком тех, которые чаще всего использую лично я, а также вкратце расскажу про то, что они делают.
1) Prettier - вы работаете в команде? А может на момент разработки код понимали лишь вы и Бог, а на утро один лишь Бог? Данное расширение поможет решить такие проблемы и сделать код намного более читаемым для других людей, нажатием пары клавиш полная белиберда способна превратиться в хорошо-читаемый код, пользуйтесь!
2) Live Server - незаменимая вещь, особенно, если вам каждый раз лень обновлять страницу для того, чтобы разглядеть корректировки, которые вы внесли. Ваш проект будет доступен на локальном сервере, что очень облегчает работу с ним.
3) Auto Rename Tag - также служит для удобства и ускорения работы с кодом, каждый раз, когда вы будете менять открывающий тэг, вместе с ним будет меняться и закрывающий, наоборот тоже работает. Очень удобно, не правда ли?
2. Figma
Figma - это онлайн-сервис для разработки интерфейсов, дизайна, создания и работы с макетами. Должен отметить, что Figma имеет очень дружелюбный интерфейс, в котором очень просто разобраться и сразу приступить к созданию чего-то своего.
Стоит подметить, что на просторах сети вы сможете найти бесчисленное количество гайдов, лайфхаков и прочего материала, который связан с разработкой в этом редакторе.
3. Chrome DevTools
Chrome DevTools - тот самый ящик с инструментами, который можно найти почти в любом гараже. Но, в нашем случае.. гараж у нас - это Google Chrome, а ящик с инструментами - это Chrome DevTools.
Данный "ящик" предоставит вам все нужные инструменты для работы с веб-страницей, начиная от изменений в размерах и шрифтах, заканчивая проверкой страницы на адаптивность и выявления багов.
4. Git и Github
Что же это за "два в одном"? Давайте разбираться.
Git - это система распределения версий. Проще говоря, вы с лёгкостью сможете контролировать и наблюдать за процессом внесения изменений в проект.
Github - это самый популярный сайт для хранения git-репозиториев и работы с ними. Там вы сможете спокойно вносить изменения в вашу работу, работать в команде и коллективно редактировать проект, делиться своим кодом и работами с сообществом.
Без Git'а и жизнь не та.
5. Google Fonts
Google fonts - обширнейшая библиотека свободно распространяемых шрифтов, а также иконок. Если вы хотите попробовать тот или иной шрифт, то поработайте с ним самим и его параметрами в Figma, а для его подключения вам поможет Google Fonts. Подключение нового "семейства шрифтов" вы можете осуществить в HTML или же CSS, решать только вам.
А ещё, этот ресурс содержит в себе раздел "Icons", где вы можете спокойно взять себе пару-тройку иконок для своего проекта.
6. One Page Love
One Page Love - последний, но не менее важный и полезный ресурс на сегодняшний день. На этом сайте вы можете найти бесчисленной множество шаблонов веб-страниц. Это поможет вам набить руку, вдохновиться, а также просто ознакомиться с красивым дизайном одностраничных сайтов.
На этом всё. Это была первая часть этой серии статей, где я буду рассказывать про те вещи, что помогут вам с вашим делом.
До скорого, дорогой читатель.