WebDEV
8.96K subscribers
2.21K photos
11 videos
2.73K links
Сообщество веб-разработчиков.

На канале можно найти: видео-уроки, полезные статьи, новости из мира IT и веб-разработки.

Ссылка: @Portal_v_IT

Сотрудничество: @oleginc, @tatiana_inc

Канал на бирже: telega.in/c/webb_dev

РКН: clck.ru/3L2oTf
Download Telegram
🛠 Geolib — мощная географическая библиотека предлагает множество интересных методов для расчета расстояния, преобразования метрик, получения координат, работы с полигонами и многого другого. Она не имеет внешних зависимостей и очень проста в настройке.

#инструменты
💡 Всегда используйте точку с запятой

Технически, большинство браузеров позволят вам не использовать их.

var someItem = 'some string'  
function doSomething() {
return 'something'
}

Но использование подобную практики потенциально может привести к гораздо более большим и что еще хуже плохо отлавливаемым проблемам.

Лучше

var someItem = 'some string';  
function doSomething() {
return 'something';
}

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

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

Если вы – опытный разработчик на JavaScript, то можно выбрать стиль кода без точек с запятой, например StandardJS. В ином случае, лучше будет использовать точки с запятой, чтобы избежать подводных камней. Большинство разработчиков их ставят.

#советы #coding #js
Выберите правильный вариант 👇🏼 #test
WebDEV
Выберите правильный вариант 👇🏼 #test
Обсудить тест и почитать объяснения можно в нашем чате @webb_chat
📑 Объектно-ориентированный JavaScript: прототипы

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

#статьи #js
🛠 CSS Layout — отличная шпаргалка, которая поможет вам быстро настроить популярные макеты пользовательского интерфейса и страниц. Существует также множество предварительно стилизованных элементов, таких как формы для ввода, виджеты и другие компоненты, которые вы можете быстро скопировать и использовать в своих проектах.

#инструменты #css
💡 Self-Executing Functions

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

(function doSomething() {
return {
name: 'jeff',
lastName: 'way'
};
})();

Это называется Immediately-Invoked Function Expression. Чаще используется для создания приватной области видимости. Подробнее на JavaScript Garden.

#советы #coding #js
🔥 Лучшее на канале за неделю

1
. Объектно-ориентированный JavaScript: функции-конструкторы.

2. CSS Layout — отличная шпаргалка, которая поможет вам быстро настроить популярные макеты пользовательского интерфейса и страниц.

3. Self-Executing Functions.
📑 Создание favicon для сайта 2020

Что такое favicon и для чего он нужен?

Favicon
– это значок (иконка), который отображается во вкладке браузера, закладках, а также в сниппетах результатов поиска.

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

#статьи
Выберите правильный вариант 👇🏼 #test
🛠 DarkModeJS — сверхлегкая и кроссбраузерная библиотека JS, которая поможет вам реализовать темные и светлые темы. Она определяет местное время пользователя и соответствующим образом переключает внешний вид пользовательского интерфейса. Кроме того, она весит всего 2,39 КБ (1,05 КБ в сжатом виде) и написана на чистом JavaScript, без каких-либо плагинов и jQuery.

#инструменты #js
💡 Используйте [] вместо new Array()

Этот совет годится и для массивов.

Нормально

var a = new Array();  
a[0] = "Joe";
a[1] = 'Plumber';

Лучше

var a = ['Joe','Plumber'];  

«Распространенная ошибка в JavaSсript программах — использование объекта, где нужен массив или массива где нужен обьект. Простое правило: когда названия свойств это небольшие последовательные числа — используйте массив. В противном случае — объект» - Douglas Crockford

#советы #coding #js
Выберите правильный вариант 👇🏼 #test #js
📑 Объектно-ориентированный JavaScript: немного практики

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

#статьи #js
🛠 React Nice Dates — datepicker для React с удобным сенсорным управлением и красивым дизайном. Библиотека полностью модульная и состоит из отдельных компонентов и утилит, которые можно комбинировать и подбирать для создания идеального средства выбора даты для ваших нужд.

#инструменты
💡 Современные и эффективные CSS-раскладки

Часть 1

В данной серии советов мы рассмотрим эффективные строки CSS-кода, которые выполняют серьезную работу и помогают создавать надёжную современную разметку.

Суперцентрирование: place-items: center

В первом примере "однострочной" раскладки давайте решим самую главную загадку во всём CSS: центрирование. Хочу, чтобы вы знали, что 'place-items: center' это проще, чем кажется.

Сначала задайте родительскому элементу свойству display со значением grid, а затем для него же place-items: center. Свойство place-items это краткая форма записи для align-items и justify-items, с помощью которого мы устанавливаем оба эти свойства в значение center.

.parent {
display: grid;
place-items: center;
}

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

Продолжение следует...

#советы #coding #css