Полезные фишки HTML и CSS

Вёрстка сайтов — это, чёрт возьми, отдельное искусство. Вам нужно объединить красоту, скорость работы, а сам сайт должен нормально выглядеть при любом расширении. Ужас!

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

📺 YouTube

WebDEV #видео #web

🛠 Solid book — интерактивная книга, которая поможет освоить пять основных принципов проектирования в объектно-ориентированном программировании. Есть примеры и тесты для самопроверки.

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

💡 Будьте готовы к неудачам

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

WebDEV #советы

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

1. Полезные фишки HTML и CSS.

2. Solid book — интерактивная книга, которая поможет освоить пять основных принципов проектирования в объектно-ориентированном программировании.

3. Метод new Array().

WebDEV #test #CSS

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

📖 Selenium with Java – A Beginner’s Guide: Web Browser Automation for Testing using Selenium with Java
🖋 Pallavi Sharma, 2022

В этой книге рассказываются особенности настройки среды для написания тестовых сценариев с Selenium. Многочисленные возможности, включая интерфейс webdriver, интерфейс веб-элементов и локаторы, подробно описаны и проиллюстрированы.

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

WebDEV #book #web #Java

💡 Многомерные массивы

Если в массив a мы поместим массив a1,a2…an, то получим многомерный массив.

Он может выглядеть так:

let a = [[1,2,3],[4,5,6],[7,8,9]];

В многомерных массивах можно обращаться как к отдельным элементам, так и к элементам внутри элемента.

Например:

let a = [[1,2,3],[4,5,6],[7,8,9]];
let b = a[0][2]; 
//[0] — первый элемент массива с индексом 0
//[2] — третий элемент первого элемента массива
console.log(b); // 3 

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

🛠 Mail Studio — сервис для создания адаптивных электронных писем. Поддерживает работу в Windows, macOS и Linux.

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

💡 Никогда не прекращайте учиться

Если вы только начинаете, мир веб-разработки может показаться вам огромным и не изученным – есть, казалось бы, сотни навыков, которые вы должны освоить. После изучения основных инструментов вы практикуетесь и некоторое время можете чувствовать себя комфортно, однако индустрия постоянно меняется. Если не меняться вместе с ней, вы уже не будете востребованным специалистом.

WebDEV #советы

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

1. Полезные фишки HTML и CSS.

2. Mail Studio — сервис для создания адаптивных электронных писем.

3. Многомерные массивы.

WebDEV #test #html

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

💡 Перебрать все элементы и получить новый изменённый массив

С циклом:

let names = ["Jack", "Jecci", "Ram", "Tom"];
let upperCaseNames = [];
for (let i = 0, totalNames = names.length; i < totalNames; i = i + 1) {
  upperCaseNames[i] = names[i].toUpperCase();
}

Без цикла:

let names = ["Jack", "Jecci", "Ram", "Tom"];
let upperCaseNames = names.map(name => name.toUpperCase());

Примечание. Если вы используете map, в процессе перебора нельзя сделать break, continue или return. Но если возникает необходимость, такие случаи обычно сводятся к применению методов every или some.

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

React или Vue или Angular

Не каждый готов потратить своё время на изучение фреймворка, который в дальнейшем ему не пригодится. Так какой же лучше подойдёт для вашего проекта?

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

📺 YouTube

WebDEV #видео #React #Angular #Vue

🛠 DaFont — большая коллекция из более чем пятидесяти тысяч бесплатных шрифтов на любой вкус. Сервис постоянно пополняется новыми шрифтами.

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

💡 Придерживайтесь методологии и комментируйте

Используйте одну методологию и обязательно комментируйте код. Постарайтесь выработать собственный стиль его написания – так и вам будет легче и после вас люди смогут разобраться с программой. Можете быть уверены – за грамотные комментарии вас впоследствии никто не проклянет.

WebDEV #советы

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

▫️ CSS-Tricks — ресурс, ежедневно публикующий полезные материалы о технологиях, связанных с веб-разработкой

▫️ Medusa — бесплатный опенсорсный аналог Shopify с настраиваемым headless-движком, полезный для всех, кто работает в сфере электронной коммерции.

▫️ Katalon Studio — инструмент для автоматизации тестирования веб-приложений, API, мобильных и настольных приложений.

▫️ Searchcode — сервис для простого поиска кода. Помогает вам найти реальные примеры функций, API и библиотек на 243 языках в 10+ общедоступных источниках кода.

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

▫️ Invision Inspect — помогает подготовить дизайны к разработке.

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

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

1. React или Vue или Angular.

2. DaFont — большая коллекция из более чем пятидесяти тысяч бесплатных шрифтов на любой вкус.

3. Перебрать все элементы и получить новый изменённый массив.