WebDEV

🔥 Лучшее на канале за неделю 1. React на практике: приложение с сортировкой и поиском данных. 2. Stryker - интересный проект для тестирования мутаций в JavaScript и других языках.. 3. Семантическая разметка в HTML - Третья часть | Четвёртая часть.

Типизация и Typescript достаточно давно пришли в мир JS, но до сих пор новые проекты создаются без него и никто не отменял поддержку старых. При разборе одного легаси-проекта с JS за другим возникает вопрос:" А как перевести его на TS бесшовно и постепенно?" Как раз на этот вопрос, в общих чертах, мы и ответим в рамках нашего вебинара, после которого вы сами сможете начать переводить свой проект с JS на TS. 25.09 ждем вас на открытом уроке. Регистрация по ссылке: https://otus.pw/iWrX/

💡 Семантическая разметка в HTML Часть 4 Перед прочтением рекомендуем ознакомиться с первой, второй и третьей частями. <mark> Когда-нибудь так делали?

<p>
  Three hundred pages of boring, useless text. <span class="highlight">The one thing you need to know and will never be able to find again if you don't highlight it.</span> More boring stuff…
</p>

Вместо этого можно использовать тег <mark>, которым помечается текст, выделенный для справочных целей из-за его высокой важности. <input> Да, <input>. Вы, вероятно, используете <input type=«text»>, <input type=«submit»>, может быть даже <input type=«hidden»>, а вы когда-нибудь использовали другие типы? В HTML5 <input> может использовать с целой кучей типов: - email -tel - number - range - date - time - search - color Также перед использованием стоит убедиться, что ваши целевые браузеры все это поддерживают. Продолжение следует... #советы #coding #html

🛠 Bootlint — инструмент линтера от команды Bootstrap, который поможет вам проверить, используют ли ваши страницы компоненты Bootstrap с правильно структурированным HTML. Он также обеспечивает включение правильных тегов, наличие декларации типа документа HTML5 и правильность общей разметки страницы. #инструменты

📑 Объектно-ориентированный JavaScript: примитивы и объекты Скорее всего, вы читали или слышали, что всё в JavaScript является объектом. Ещё чаще можно увидеть опровержения этого утверждения. Подобные споры возникают регулярно и обусловлены в большей степени недопониманием концепций JavaScript. И, на самом деле, причина считать примитивы объектами есть — у примитивов можно запрашивать свойства и методы, поведение которых во многом схоже со свойствами и методами объектов. Продолжение читайте в статье. #статьи #js

Выберите правильный вариант 👇🏼 #test

💡 Семантическая разметка в HTML Часть 3 Перед прочтением рекомендуем ознакомиться с первой и второй частями. Тег <abbr> <abbr> используется для сокращений. Он может быть особенно полезен в документах, где их много. У этого тега есть необязательный атрибут title, в котором можно указать полную версию текста.

<abbr title="I don't know">idk</abbr>
<abbr title="got to go">g2g</abbr>

Тег <time> Давайте взглянем на классическую проблему локализации дат. В США 5 октября 2013 года записывается как 10/05/13, в Британии это 05/10/13, в Южной Африке это 2013/10/05, в России это 05.10.13. Все эти варианты делают чрезвычайно трудной задачу автоматического распознавания дат. Тег <time> позволяет указывать дату и время в машинночитаемом формате. Предыдущий пример мог бы выглядеть примерно так: <time datetime=«2013-10-05»>10/05/13</time>. HTML-парсеры смогут точно понять дату, несмотря на то, в каком формате мы ее указали. Продолжение следует... #советы #coding #html

🛠 Stryker - интересный проект для тестирования мутаций в JavaScript и других языках. Он работает, добавляя «мутации» в случайные места в вашем коде и выполняя для них тесты, проверяя, сколько мутаций прошло и насколько действительно надежен код. #инструменты #js

Выберите правильный вариант 👆 #test

📑 React на практике: приложение с сортировкой и поиском данных В статье демонстрируется приложение с сортировкой и поиском данных. #статьи #js #react

🔥 Лучшее на канале за неделю 1. Картинка, которая одновременно является кодом на JavaScript. 2. Ackee — это проект с открытым исходным кодом, который предоставляет вам все необходимые инструменты для добавления автономной аналитики на ваш сайт. 3. Семантическая разметка в HTML - Первая часть | Вторая часть.

🛠 98.css — забавный CSS-фреймворк для создания пользовательских интерфейсов в стиле Windows 98. Как и большинство других UI-фреймворков, он предоставляет вам несколько базовых утилит стиля и набор компонентов для быстрого создания макета, только при использовании этого фреймворка макет будет иметь ностальгическое очарование. #инструменты #js

💡 Семантическая разметка в HTML Часть 2 Ознакомиться с первой частью вы можете по ссылке. Теги <i> и <b> В старые добрые времена, теги <i> и <b> обозначали текст выделенный, соответственно, курсивом и жирным шрифтом. Когда же идея об отделении семантики от представления стала набирать обороты, к этим тегом стали относиться с подозрением. Их заменили на теги <em> и <strong>, обозначающие соответственно эмфазис и сильный эмфазис. В HTML5, наконец, эти теги получили отличную семантическую интерпретацию. Тегом <i> помечается текст, у которого отличается тон или настроение. Это полезно, например, для описания мыслей или технических терминов. Тег <b> помечает текст, который стилистически отличается от обычного текста, но не имеет какого-либо выделенного семантического значения. Чем это отличается от использования <span>? Ключ в том, что <b> не несет какого-либо семантически отличного смысла. В следующей части рассмотрим теги <abbr> и <time>. Продолжение следует... #советы #coding #html

💡Основы JavaScript в формате марафона за неделю 21 сентября фронтенд-разработчик, спикер HolyJS и преподаватель, Зар Захаров, запускает марафон по JS в Телеграме. Будут: короткие видеоуроки, домашние задания, которые нужно выполнить, чтобы пройти дальше, поддержка и code review от ментора с 14-летним опытом. В результате вы напишите свою первую браузерную игру в жанре файтинг на JS. Чтобы занять место на марафоне, нажмите на кнопку и запустите бота.

📑 Картинка, которая одновременно является кодом на JavaScript Изображения обычно хранятся как двоичные файлы, а файл JavaScript по сути является обычным текстом. Оба типа файлов должны следовать собственным правилам: изображения имеют конкретный формат файла, определённым образом кодирующий данные. Для того, чтобы файлы JavaScript можно было исполнять, они должны следовать определённому синтаксису. В статье отвечаем на вопрос: можно ли создать файл изображения, одновременно являющийся допустимым синтаксисом JavaScript, чтобы его можно было исполнять? #статьи #js

💡 Используйте {} вместо New Object() в JavaScript Есть несколько путей для создания объектов в JavaScript. Возможно наиболее традиционный это использование конструктора «new», например:

var o = new Object();  
o.name = 'Jeffrey';  
o.lastName = 'Way';  
o.someFunction = function() {  
   console.log(this.name);  
}  

Хотя этот метод получил штамп «плохой практики» он таковой не является. Вместо него, мы рекомендуем использовать более надежный метод c литералом объекта. Лучше так:

var o = {  
   name: 'Jeffrey',  
   lastName = 'Way',  
   someFunction : function() {  
      console.log(this.name);  
   }  
}; 

Заметка — если вы хотите создать пустой обьект, то {} сделает это:

var o = {};  

"Литералы обьектов позволят нам писат код, который поддерживает кучу функционала все еще сохраняя относительную непосредственность. Не нужно больше вызывать конструкторы напрямую или корректировать порядок аргументов переданных в функцию." #советы #coding #js

Выберите правильный вариант 👇🏼 #test