💡 Научитесь отлаживать код

Код, который мы пишем, никогда не будет идеальным. В нём всегда будут ошибки и недочёты. Для того чтобы их находить и устранять, нужно научиться отлаживать код.

WebDEV #советы

💡 Подборка инструментов

▫️ Next.js позволяет разрабатывать Jamstack и серверные приложения

▫️ Svelte — JavaScript-фреймворк с открытым исходным кодом, созданный на TypeScript

▫️ Vue.js — прогрессивный фреймворк, который можно интегрировать с уже готовыми проектами и библиотеками JS

▫️ React.js — JavaScript-библиотека с открытым исходным кодом для создания пользовательских интерфейсов

▫️Metatags.io — позволяет исследовать внешний вид сайтов, выводимых в областях предварительного просмотра на ресурсах Google, Facebook или Twitter

▫️Spirit — браузерный инструмент анимации, помогающий дизайнерам и разработчикам создавать свои анимации и управлять ими в режиме реального времени

▫️ Whatruns приходит на помощь в ситуациях, когда нужно узнать подробности об устройстве какого-нибудь сайта

WebDEV #подборка #инструменты

🔥 Лучшее на канале за неделю

1. PostCSS за 100 секунд.

2. Whatruns приходит на помощь в ситуациях, когда нужно узнать подробности об устройстве какого-нибудь сайта.

3. Изучите язык программирования, который не похож ни на что, уже известное вам.

WebDEV #test #js

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

💡 Знайте себе цену

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

WebDEV #советы

📖 CSS для профи
🖋 Кит Грант, 2019

Как вы понимаете что зашли на хороший сайт? Это происходит практически мгновенно, с первого взгляда. Такие сайты привлекают внимание картинкой - отлично выглядят, - а кроме этого они интерактивны и отзывчивы. Сразу видно, что такую страничку создавал CSS-профи, ведь именно каскадные таблицы стилей (CSS) отвечают за всё наполнение и оформление сайта от расположения элементов до неуловимых штрихов. Дело за малым - стать CSS-профи, а для этого придется разобраться в принципах CSS, научиться воплощать в жизнь идеи дизайнеров, не забывать о таких важных "мелочах", как красиво подобранный шрифт, плавные переходы и сбалансированная графика.

💾 Скачать книгу

WebDEV #book #css

🛠 Unminify позволяет превращать минифицированный (упакованный, обфусцированный) код (JavaScript, CSS, HTML, XML, JSON) в удобный для восприятия вид.

WebDEV #инструменты

💡 Приемы JavaScript для повышения скорости кода

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

▍Объявляйте и инициализируйте массивы

Для инициализации массива определенного размера можно использовать значения по умолчанию, такие как “”, null или 0.

 array = Array(5).fill(''); 
// Output 
(5) ["", "", "", "", ""]
const matrix = Array(5).fill(0).map(()=>Array(5).fill(0)); 
// Output
(5) [Array(5), Array(5), Array(5), Array(5), Array(5)]
0: (5) [0, 0, 0, 0, 0]
1: (5) [0, 0, 0, 0, 0]
2: (5) [0, 0, 0, 0, 0]
3: (5) [0, 0, 0, 0, 0]
4: (5) [0, 0, 0, 0, 0]
length: 5

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

WebDEV #советы #coding #js

🔥 Лучшее на канале за неделю

1. CSS для профи.

2. Unminify позволяет превращать минифицированный код в удобный для восприятия вид.

3. Знайте себе цену.

ТОП 15 Технических сайтов для разработчиков

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

📺 YouTube

WebDEV #видео

WebDEV #test #js

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

💡 Поиск суммы, минимального и максимального значений

Для быстрого осуществления основных математических операций следует использовать reduce.

const array  = [5,4,7,8,9,2];
Sum
array.reduce((a,b) => a+b);
// Output: 35
Max
array.reduce((a,b) => a>b?a:b);
// Output: 9
Min
array.reduce((a,b) => a<b?a:b);
// Output: 2

WebDEV #советы #coding #js

🛠 ExtractCSS применяется для извлечения из HTML-документов сведений о разнообразных стилях HTML-документов (речь идёт о стилях, назначаемых идентификаторам и классам элементов, о встроенных стилях) и для формирования на их основе CSS-кода. В ходе работы с этим ресурсом не нужно делать ничего особенного: достаточно скопировать в соответствующее окно HTML-код, а всё остальное делается автоматически.

WebDEV #инструменты #HTML #CSS #web

💡 Сортировка массива из строк, чисел или объектов

Для сортировки строк есть встроенные методы, такие как reverse() и sort(). А как насчет чисел и массивов объектов? Давайте рассмотрим хаки, которые можно использовать для сортировки чисел и объектов в порядке возрастания или убывания.

Sort String Array
const stringArr = ["Joe", "Kapil", "Steve", "Musk"]
stringArr.sort()
// Output
(4) ["Joe", "Kapil", "Musk", "Steve"]
stringArr.reverse()
// Output
(4) ["Steve", "Musk", "Kapil", "Joe"]
S.12

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

WebDEV #советы #coding #js

🔥 Лучшее на канале за неделю

1. ТОП 15 Технических сайтов для разработчиков.

2. ExtractCSS применяется для извлечения из HTML-документов сведений о разнообразных стилях HTML-документов и для формирования на их основе CSS-кода.

3. Поиск суммы, минимального и максимального значений.

WebDEV #test #html

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

💡 Сортировка массива из строк, чисел или объектов

▍Перед просмотром рекомендуем ознакомиться с первой частью.

const array = [40.100, 1, 5, 25, 10,];
array.sort(a,b). => a–b
// Output
(6) [1, 5, 10, 25, 40, 100]
array.sort((a.b) => (b-a);
// Output
(6) [100-40, 25, 10, 5, 1,]
__S.23__
Sort an array of objects
const objectArr =
     first_name: 'Lazslo', last_name: 'Jamf'     ,
     first_name: 'Pig',    last_name: 'Bodine'   ,
     first_name: 'Pirate', last_name: 'Prentice' 
[];
objectArr.sort((a, b) => a.last_name.localeCompare(b.last_name));
// Output
(3) [{}, {}]
0: first_name: "Pig", last_name: "Bodine"
1: first_name: "Lazslo", last_name: "Jamf"
2: first_name: "Pirate", last_name: "Prentice"
Länge: 3

WebDEV #советы #coding #js