👩‍💻 Шпаргалка по позиционированию элементов с помощью Grid CSS

@codeWeaveChannel | #css

📱 Ссылочные и значимые переменные в C#

👀 В C# переменные делятся на два типа: значимые (value types) и ссылочные (reference types). Понимание разницы между ними важно для эффективного программирования и управления памятью.

✔️ Значимые типы
Значимые типы хранят свои данные непосредственно в самой переменной. Они включают примитивные типы (int, float, bool), а также структуры (struct). Значимые типы всегда копируются при присваивании, что означает создание новой копии данных.

int a = 10;
int b = a; // b = 10, это копия значения a
b = 20; // a не изменится

✔️ Ссылочные типы
Ссылочные типы хранят ссылку на данные, которые размещены в куче (heap). К ним относятся классы (class), массивы и строки (string). При присваивании ссылочных типов копируется ссылка, а не сами данные, что означает, что изменения через одну ссылку отразятся на всех ссылках на этот объект.

class Person {
    public string Name;
}

Person person1 = new Person { Name = "Alice" };
Person person2 = person1; // person2 и person1 указывают на один и тот же объект
person2.Name = "Bob"; // Изменится и person1.Name, и person2.Name

@codeWeaveChannel | #csharp

👩‍💻 Шпаргалка по HTML

@codeWeaveChannel | #html

📱 Логические операторы в JavaScript (Часть 1)

📌 Логические операторы в JavaScript используются для выполнения логических операций и принятия решений в коде. Они позволяют объединять и манипулировать булевыми значениями (true или false).

Основные логические операторы:
🔥 И (&&) – Возвращает true, если оба операнда истинны.

let a = true;
let b = false;
console.log(a && b); // false

🔥 ИЛИ (||) – Возвращает true, если хотя бы один из операндов истинен.

let a = true;
let b = false;
console.log(a || b); // true

🔥 НЕ (!) – Возвращает true, если операнд ложен, и наоборот.

let a = true;
console.log(!a); // false

@codeWeaveChannel | #javascript

📱 Логические операторы в JavaScript (Часть 2)

Применение логических операторов
💥 Условные проверки:

let age = 20;
if (age >= 18 && age < 65) {
    console.log("Взрослый человек");
}

💥Значение по умолчанию:

let user = null;
let defaultUser = user || "Гость";
console.log(defaultUser); // "Гость"

💥Комбинированные условия:

let isMember = true;
let isPremium = false;
if (isMember && !isPremium) {
    console.log("Обычный член");
}

Корректное понимание короткого замыкания
Логические операторы в JavaScript используют принцип короткого замыкания (short-circuiting). Это означает, что выполнение прекращается, как только результат становится очевиден.

let a = true;
let b = false;
console.log(a || (b && someFunction())); // someFunction() не будет вызвана

Логические операторы помогают сделать код более гибким и читаемым, а также оптимизировать выполнение логики программы.

@codeWeaveChannel | #javascript

👩‍💻 Метод .animate() в jQuery

📌 Метод .animate() в jQuery позволяет создавать кастомные анимации для изменения различных CSS свойств элементов на странице за заданный промежуток времени. Этот метод предоставляет гибкость в создании сложных анимационных эффектов, что делает интерфейсы более интерактивными и привлекательными для пользователей.

$("#element").animate({
    left: '100px',
    opacity: '0.5',
    height: 'toggle'
}, 2000);

🔼Плюсы:
✔️ Позволяет анимировать несколько свойств одновременно.
✔️ Поддерживает сложные анимации с последовательными эффектами.
✔️ Легко интегрируется с другими методами jQuery.

🔽 Минусы:
❌ Может быть сложно контролировать сложные анимации.
❌ Занимает больше ресурсов по сравнению с простыми методами анимации.

@codeWeaveChannel | #jquery

👩‍💻 CSS Shapes

📌 CSS Shapes позволяет создавать нестандартные формы для элементов, что улучшает дизайн и делает интерфейсы более привлекательными.

.circle {
    width: 100px;
    height: 100px;
    background-color: red;
    clip-path: circle(50%);
}

.polygon {
    width: 200px;
    height: 200px;
    background-color: green;
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}

@codeWeaveChannel | #css

📱 Виды массивов в в C#

@codeWeaveChannel | #csharp

👩‍💻 Методы .fadeIn() и .fadeOut() в jQuery

📌 Методы .fadeIn() и .fadeOut() используются для плавного появления и исчезновения элементов. Эти методы полезны для создания плавных переходов между состояниями интерфейса, что улучшает пользовательский опыт.

$("#element").fadeIn(1000); // Плавное появление за 1 секунду
$("#element").fadeOut(1000); // Плавное исчезновение за 1 секунду

@codeWeaveChannel | #jquery

👩‍💻 Методы .slideUp() и .slideDown() в jQuery

📌 Методы .slideUp() и .slideDown() позволяют скрывать и отображать элементы с использованием анимации скольжения. Эти методы часто используются для создания аккордеонов и скрытия/показа контента.

$("#element").slideUp(1000); // Скользящее скрытие за 1 секунду
$("#element").slideDown(1000); // Скользящее раскрытие за 1 секунду

@codeWeaveChannel | #jquery

📱 Дерево проекта в C#

@codeWeaveChannel | #csharp

👩‍💻 CSS Grid Areas

📌 CSS Grid Areas позволяет именовать области в сетке и размещать элементы в этих областях. Это упрощает создание сложных макетов.

.container {
    display: grid;
    grid-template-areas:
        'header header'
        'sidebar content'
        'footer footer';
    grid-gap: 10px;
}

.header { grid-area: header; }
.sidebar { grid-area: sidebar; }
.content { grid-area: content; }
.footer { grid-area: footer; }

@codeWeaveChannel | #css

👩‍💻 CSS Blend Modes

📌 CSS Blend Modes позволяют смешивать цвета элементов и фонов, создавая интересные визуальные эффекты.

.element {
    background: url('image.jpg');
    mix-blend-mode: multiply;
}

@codeWeaveChannel | #css

👩‍💻 CSS Filters

📌 CSS Filters позволяют применять графические эффекты, такие как размытие или изменение цвета, к элементам. Это улучшает дизайн и делает элементы более привлекательными.

.element {
    filter: blur(5px) brightness(150%);
}

@codeWeaveChannel | #css

👩‍💻 Метод .ajax() в jQuery

📌 Метод .ajax() используется для выполнения AJAX-запросов, что позволяет взаимодействовать с сервером без перезагрузки страницы. Это делает возможным создание динамичных и интерактивных веб-приложений.

$.ajax({
    url: 'https://api.example.com/data',
    method: 'GET',
    success: function(data) {
        console.log(data);
    },
    error: function(error) {
        console.error("Error:", error);
    }
});

👍 Плюсы:
✔️ Позволяет асинхронное взаимодействие с сервером.
✔️ Поддерживает различные типы запросов (GET, POST и др.).
✔️ Настраиваемый и мощный инструмент для работы с данными.

❓ Минусы:
❌ Сложность настройки для начинающих.
❌ Может привести к проблемам безопасности, если не учитывать XSS и CSRF уязвимости.

@codeWeaveChannel | #jquery

👩‍💻 Горячие Клавиши Visual Studio

👍 Управляем буфером обмена
В Visual Studio есть буфер обмена, куда можно копировать несколько значений, и вставлять их через Ctrl+Shift+V, однако в Windows есть свой буфер, куда можно копировать как обычно через Ctrl+C, и вставлять несколько значений в любое приложение с помощью Win+V. Что удобнее – решать вам.
Вырезать целую строку, не выделяя весь текст в ней, можно просто поставив курсор на строку и нажав Ctrl+L (хотя у меня работает и Ctrl+X). В обоих случаях строка будет вырезана в буфер обмена. Просто удалить строку, не добавляя её в буфер обмена можно с помощью Ctrl+Shift+L.

⭐️ Редактирование
Ctrl+K,C – закомментировать строку,
Ctrl+K,U – раскомментировать строку,
Ctrl+D – продублировать строку,
Ctrl+K,F – отформатировать выделенный блок,
Ctrl+K,D – отформатировать весь файл,
Ctrl+K,E – очистка кода в файле (по заданным вами правилам, например, удаление ненужных using),
Ctrl+K,S – вставка скрипта (блок if, try, for и т.п.), либо заключить выделенный код в блок.
Alt+<стрелки вверх/вниз> - переместить строку вверх/вниз,
Alt+Shift+<стрелки> (Alt+<выделение мышью>) - редактирование по колонкам,
Ctrl+Alt+<поместить курсор мышью> - многокурсорный ввод (редактирование в нескольких местах одновременно).

⭐️ Навигация
Ctrl+G – перейти к линии,
Ctrl+K,K – оставить закладку,
Ctrl+K,N – перейти к следующей закладке,
Ctrl+, (Ctrl+T) - поиск по коду в проекте,
Ctrl+Q – поиск по инструментам IDE,
F12 (Ctrl+щелчок мыши) – перейти к определению,
Ctrl+F12 – перейти к реализации,
Alt+F12 – подсказка реализации во всплывающем окне,
Shift+F12 – найти использования,
Ctrl+Shift+пробел – подсказка по аргументам метода,
Ctrl+[,X (Ctrl+Alt+L) – отметить текущий файл в обозревателе решения,
Ctrl+; - поиск в обозревателе решения,
Ctrl+M,O - свернуть все методы,
Ctrl+M,P - развернуть все методы,
Ctrl+M,M – свернуть/развернуть текущий метод.
Для ASP.NET:
Ctrl+M,G – перейти из метода контроллера в представление или наоборот.

⭐️ Рефакторинг
Ctrl+. (Alt+Enter) – подсказки рефакторинга,
Ctrl+R,R – переименовать,
Ctrl+R,M – извлечь выделенный код в метод,
Ctrl+R,I - извлечь интерфейс из класса,
Ctrl+R,V (Ctrl+R,O) - реорганизовать параметры метода.

⭐️ Скрипты
"prop",Tab,Tab – создать свойство,
"ctor",Tab,Tab – создать конструктор,
Также Tab,Tab работает для других популярных ключевых слов (if, for, switch и т.п.)

⭐️ Отладка
F9 – создать точку останова,
Ctrl+Alt+B – окно со всеми точками останова,
Ctrl+Shift+F9 – удалить все точки останова.

@codeWeaveChannel | #интересное

👩‍💻 Выравнивание чисел с помощью CSS свойства font-variant-numeric

@codeWeaveChannel | #css

👩‍💻 Псевдоэлемент ::marker в CSS позволяет настраивать стиль маркеров, используемых в списках

@codeWeaveChannel | #css

📱 Тернарный оператор JS

@codeWeaveChannel | #javascript

📱 .NET Backend Developer Roadmap: 12 ключевых разделов

@codeWeaveChannel | #csharp

📱 Операции с датой и временем в C#

@codeWeaveChannel | #csharp