Search
Write a publication
Pull to refresh
0
@Evgpreoread⁠-⁠only

Пользователь

Send message

Тестовое задание для фронтендера

Reading time6 min
Views34K

На Хабре уже было 244 статьи о карьере, тысячи комментариев о плохих собеседованиях разработчиков и множество недовольных программистов всех сортов и расцветок. Не то что бы это был необходимый минимум для успешного найма, но когда начал давать тестовые задания, становится сложно остановиться.

Верстальщик — такой человек, который хорошо разбирается в HTML и CSS и немного знает JavaScript. Ну то есть понимает, как в целом всё работает, но сильно не погружается. При этом бывает непросто выбрать хорошего верстальщика, потому что всех учат по-разному.

Чтобы решить эту проблему, собираем в одном месте опыт десятков собеседований с верстальщиками. Вместе с Дашей Владыко из фронтенд-аутсорса «Лига А.» рассказываем, на что смотреть в тестовом задании джунов и мидлов, и как отличить хороший результат от плохого. Плюс несколько практических советов — например, как выбирать плагины и составить тестовое задание.

Читать далее

Организация отступов в верстке (margin/padding)

Reading time4 min
Views187K


Цель этой статьи не усложнить простые вещи, а акцентировать внимание на известных стандартах, о которых почему-то забывают. Важно соблюдать осмысленную структуру во всех аспектах верстки, и не менее важно придерживаться ее в отступах. И одним из основных принципов верстки является гибкость. А именно, возможность легко вносить какие-либо изменения и ничего при этом не сломать. Правильное обращение с margin и padding играет очень большую роль в этом деле.

Ниже перечисленные принципы выполняются в среде позиционирования элементов на странице. В элементах декора тоже выполняются. Но не так категорично.
Читать дальше →

Всё, что вам нужно знать про CSS Margin

Reading time8 min
Views79K
Одним из первых, что многие из нас усвоили, когда изучали CSS, были особенности разных составляющих блока в CSS, описываемые как «Блочная Модель CSS». Один из элементов в блочной модели — margin (внешний отступ), прозрачная область вокруг блока, которая отталкивает другие элементы от содержимого данного блока. Свойства margin-top, margin-right, margin-bottom и margin-left были описаны еще в CSS1, вместе с сокращенным свойством margin для одновременной установки в всех четырёх свойств.

Margin кажется довольно несложным, однако, в этой статье мы рассмотрим некоторые моменты, на которых люди спотыкаются при его использовании. В частности, как margins взаимодействуют друг с другом и как на самом деле работает схлопывание внешних отступов.

Sublime Text 3 для верстки сайтов. Настройка внешнего вида и установка плагинов. Руководство для начинающих

Reading time8 min
Views229K
Сегодня расскажу о редакторе кода, которым пользуюсь для верстки сайтов уже много лет. Быстрый, удобный и полностью настраиваемый Sublime Text 3.



Мы с нуля настроем его внешний вид, а также применим плагины AutoFileName, BracketHighliter, ColorHighliter, Emmet, GotoCSSDeclaration и Tag, которые существенно помогут нам при верстке сайтов! Ну что ж, от слов к делу!

11 бесплатных шрифтов с кириллицей

Reading time4 min
Views97K
image

1. Arimo

image

Дизайнер: Стив Мэттэсон – увлеченный дизайнер из штата Колорадо. Более 25 лет Мэттэсон разрабатывает шрифты, самыми крупными проектами стали дизайны для Android, Citrix, Microsoft, Nextel и Xbox.

image

Типы: Regular, Regular Italic, Bold, Bold Italic
Лицензия: Apache License, Version 2.0
Скачать шрифт


Arimo – без засечек, разработанный специально для работы с Arial. Шрифт слегка сжат по ширине. При небольшом кегле буквы тонкие и классические. Изящные черты достигаются при увеличении размера символов. Шрифт адаптирован для чтения на экране и отлично подойдет для документов на разных платформах.
Читать дальше →

10 бесплатных и крутых шрифтов

Reading time5 min
Views78K
Сегодня рассказываем про шрифты, которые часто используют наши дизайнеры — все они бесплатные, минималистичные и удобные в использовании. Надеемся, наша подборка пригодится вам при выборе шрифтов.

Шрифт – часть фирменного стиля, которой нельзя пренебрегать. Форма и начертание букв – основа читабельности и настроения бренда. Текст окружает нас повсюду: название компании, слоган или реклама в журнале. Встречают по одежке. Притягательность текста зависит от того, зацепится ли взгляд за приятные очертания букв или излишние закорючки вызовут отторжение у читателя. Создание шрифтов – наука, но всемирная сеть предлагает неисчерпаемый источник публичных семейств от гуру типографики.

1. Open Sans


image
Читать дальше →

Как стать фронтенд-разработчиком? Пошаговый гид в мир фронтенда

Reading time14 min
Views260K


Приветствую всех! Меня зовут Пучнина Анастасия, я ведущий разработчик в компании ДомКлик, занимаюсь фронтендом Витрины объявлений. Сегодня я хотела бы поделиться с вами своим мнением на тему того, что важно знать фронтенд-разработчику. Эта статья будет полезна тем, кто только начинает свой путь в разработке, или имеет опыт программирования в другой области и решил перейти на сторону фронтенда.

Содержание:

  1. Кто такой фронтендер и чем он занимается?
  2. С чего начать и что читать? Чек-лист обучения
  3. Какие трудности могут быть? Ошибки в начале пути
  4. Подготовка к собеседованию на Junior-разработчика

Читать дальше →

Разбор англоязычных трейлеров к самым ожидаемым фильмам 2021

Reading time6 min
Views5.8K

Привет, Хабр! Смотреть фильмы на английском — это один из хороших способов прокачать знание языка. 

Кино прекрасно погружает зрителя в контекст, знакомит с интересными разговорными и сленговыми фразами, помогает улучшать восприятие и понимание речи. Да еще и удовольствие при этом получаешь.

Мы решили разобрать лексику трейлеров трех самых ожидаемых фильмов 2021 года. И заодно предположим, что ждать от них с точки зрения английского. Не будем задерживаться, поехали!

Читать далее

Как я нашел в публичном доступе исходники нескольких сервисов ФНС

Reading time4 min
Views101K

Очередной повод прикрыть лицо рукой и сделать про себя нужные выводы в части актуальных угроз и реалий утечек, чтобы подлатать свои поделки.

Читать далее

Что должно быть в макете сайта: шпаргалка для дизайнера

Reading time6 min
Views18K

Иногда дизайнер присылает заказчику макет, в котором есть всё, что просили, но каких-то элементов не хватает. Верстальщики, бэкендеры и любые другие технические специалисты, конечно, могут сделать недостающий элемент на своё усмотрение, но вряд ли перед релизом их будет волновать внешний вид. Вместо тщательно подобранных оттенков, правильной сетки и фирменных шрифтов, они добавят свои цвета, используют стандартные шрифты, и все усилия дизайнера пойдут насмарку. 

Ну или вообще всё отправят на доработку и уже дизайнеру придётся потеть заново. Поэтому лучше иметь под рукой список необходимых элементов и заглядывать в него до того, как макет передадут в вёрстку. Это позволит сделать всё сразу, не возвращаться к проекту несколько раз и не переживать, что при сборке страницы что-то пойдёт не так. Хотя что-то, скорее всего, пойдёт.

Осторожно, в статье очень много иллюстраций.

Читать далее

Как превратить Google-таблицы в REST API и использовать их с React-приложением

Reading time5 min
Views13K

Взаимодействовать с API никогда не было просто. Но использовали ли вы когда-нибудь React для отправки формы в Google-таблицы? Если нет, то этот туториал для вас.

Сегодня мы поговорим о том, как отправлять данные формы из React в Google-таблицы, так же как вы отправляете данные с помощью REST API.

Приятного чтения!

Бесплатные образовательные курсы: фронтенд-разработка

Reading time5 min
Views99K
image

Порядочный фронтендер знает HTML и CSS, разбирается во фреймворках и библиотеках, понимает, что находится «под капотом» на серверной стороне. Плюс, обязательно умеет работать с контролем версий, использовать графические редакторы, разбираться в шаблонах разных CMS.

Сегодня наша подборка посвящена именно фронтенд-разработке. В нее вошли 15 бесплатных курсов из раздела Образование на Хабр Карьере, которые познакомят с основами основ — HTML, CSS, JavaScript — и еще с кучей полезных вещей.

Если вы где-то видели интересный бесплатный курс и не нашли его в этом списке — делитесь ссылками в комментариях.
Читать дальше →

Не блокировка, а замедление

Reading time7 min
Views107K

Красным указано оборудование ТСПУ (технические средства противодействия угрозам) — «чёрные ящики» от РКН, которые операторы связи размещают с подведением электропитания в отдельных стойках на своих площадка по всей стране, но доступа к устройствам не имеют.

10 марта 2021 года с 10 часов утра по московскому времени Рунет вступил в новые правила игры. Роскомнадзор начал «замедлять» на 100% мобильный и 50% трафик широкополосного доступа сервиса микроблогов Twitter.

За этим последовало несколько знаменательных событий. Глобальная авария на оборудовании Ростелекома на полдня нарушила доступ к госсайтам и сети оператора. Более 113 тыс. доменов оказались в контуре «замедления» РКН, так как они имеют в своём название «t.co», короткий домен Twitter, на который реагирует оборудование ТСПУ.

Хабр совместно с коллегами из «РосКомСвободы» постарался рассказать, почему такая ситуация стала возможной, что теперь делать пользователям и как будут развиваться события с Twitter и другими соцсетями.
Читать дальше →

Безопасность iOS-приложений: гайд для новичков

Reading time18 min
Views18K

Привет! Меня зовут Гриша, я работаю application security инженером в компании Wrike и отвечаю за безопасность наших мобильных приложений. В этой статье я расскажу про основы безопасности iOS-приложений. Текст будет полезен, если вы только начинаете интересоваться безопасностью мобильных приложений под iOS и хотите разобраться, как все устроено изнутри.

Читать далее

7 простых способов протестировать кроссбраузерную совместимость

Reading time4 min
Views73K
Эта статья предназначена для дизайнеров, верстальщиков, разработчиков и всех остальных людей, бьющихся с тестированием сайтов в нескольких браузерах.

Всего лишь год назад, хороших средств для тестирования кроссбраузерной совместимости сайтов практически не было. Инструменты, как правило, обладали серьезными недостатками – высокой ценой, скромными возможностями или затрачиваемым временем. Однако, в последнее время, в мире тестирования браузеров появилось много новичков, и некоторые из них являются прекрасными сервисами.

В этой статье, мы рассмотрим 7 простых инструментов для тестирования кроссбраузерной совместимости; инструментов, которые справляются со своей задачей очень легко, и к тому же, каждый из этих инструментов можно использовать бесплатно.
Читать дальше →

Win 10 Tweaker — быстрая оптимизация Windows в несколько кликов, которая может сломать систему

Reading time4 min
Views211K


Всем привет! Меня зовут Тилек, и я пользуюсь Windows. Меня эта операционная система вполне устраивает. У меня видавший виды б/у-ный служебный ноутбук HP ProBook 4540s, который у меня с 2015 года. Модель старая, да и сам ноут не новый, и с тех пор он успел побывать несколько раз в ремонте. В начале прошлого года я перешел с Windows 7 на Windows 10, и тогда скорость работы ноутбука заметно снизилась. Я искал программы по оптимизации ОС, которые могли бы увеличить производительность и быстродействие. Тогда я и наткнулся на Win 10 Tweaker.
Читать дальше →

Каких ответов я жду на собеседовании по тестированию

Reading time15 min
Views921K
Я провожу собеседования на тестировщиков. У меня иногда болит голова.

Долго собирался написать статью… И вот, наконец, выполнил свое намерение. Вопросы, поднимаемые в статье, обсуждались уже не раз и не два, но усердные поиски компиляции ответов на эти вопросы так и не увенчались успехом. Но, как подсказывает мой опыт, такая компиляция очень нужна. Прежде всего она требуется юниорам, ибо в сети по запросу «тестирование» на них (соискателей) обрушивается огромный объем информационного мусора, который плохо структурирован и часто противоречит сам себе.
Читать дальше →

Что такое API

Reading time9 min
Views1.2M

Содержание



Слово «API» мелькает в вакансиях даже для начинающих тестировщиков. То REST API, то SOAP API, то просто API. Что же это за зверь такой? Давайте разбираться!

— А зачем это мне? Я вообще-то web тестирую! Вот если пойду в автоматизацию, тогда да… Ну, еще это в enterprise тестируют, я слышал…

А вот и нет! Про API полезно знать любому тестировщику. Потому что по нему системы взаимодействуют между собой. И это взаимодействие вы видите каждый день даже на самых простых и захудалых сайтах.
Любая оплата идет через API платежной системы. Купил билет в кино? Маечку в онлайн-магазине? Книжку? Как только жмешь «оплатить», сайт соединяет тебя с платежной системой.

Но даже если у вас нет интеграции с другими системами, у вас всё равно есть API! Потому что система внутри себя тоже общается по api. И пока фронт-разработчик усиленно пилит GUI (графический интерфейс), вы можете:

  • скучать в ожидании;
  • проверять логику работы по API

Конечно, я за второй вариант! Так что давайте разбираться, что же такое API. Можно посмотреть видео на youtube, или прочитать дальше в виде статьи.

Что такое API


image

API (Application programming interface) — это контракт, который предоставляет программа. «Ко мне можно обращаться так и так, я обязуюсь делать то и это».

Если переводить на русский, это было бы слово «договор». Договор между двумя сторонами, как договор на покупку машины:

  • мои обязанности — внести такую то сумму,
  • обязанность продавца — дать машину.

Перевести можно, да. Но никто так не делает ¯\_(ツ)_/¯
Читать дальше →

Большой обзор красивых многоуровневых меню с codepen

Reading time4 min
Views201K


Хабр, привет!

На Сodepen появляется много хороших решений от разных специалистов, и я считаю, что лучшие из них нужно собирать в одном месте. Поэтому 2 года назад начал сохранять у себя на компьютере интересные скрипты по разным тематикам.

Раньше я их выкладывал в группе продукта облачной IDE mr. Gefest, это были сборки из 5-8 решений. Но теперь у меня стало скапливаться по 15-30 скриптов в разных тематиках (кнопки, меню, подсказки и так далее).

Такие большие наборы следует показывать большему числу специалистов. Поэтому выкладываю их на Хабр. Надеюсь они будут Вам полезны.
Читать дальше →

Как создавался отечественный браузер с боковыми вкладками на HTML5

Reading time10 min
Views13K

Есть несколько браузеров с неклассическим интерфейсом на HTML5 и теперь к ним добавился браузер с боковым размещением табов. В статье я расскажу про особенности размещения табов сбоку, как браузер технически создавался и зачем он нужен.

Хочу браузер с боковыми вкладками

Information

Rating
Does not participate
Location
Москва, Москва и Московская обл., Россия
Registered
Activity