Javascript Pro

Скролл страницы наверх

Всем привет! Микро-пост о том как простейшим способом проскроллить страницу наверх.

Вот так:

const scrollToTop = (x, y) => {
window.scrollTo(x, y);
};
scrollToTop(0, 0);


#js #features

Учим английский слэнг. Shake hands (рукопожатие) - это....

Тренды JavaScript в 2022 году

Новые JS-фреймворки постоянно появляются на рынке. Часто бывает трудно следить за новинками, а причины исчезновения некоторых продуктов бывают загадочны.

Пользователи заинтересованы в производительности, скорости, популярности и соотношении цены и качества, в то время как разработчики стремятся улучшить свои решения, чтобы успешно конкурировать. В этой статье мы попытаемся спрогнозировать тренды в мире JavaScript в 2022 году и немного поразмышлять о них.

Читать...

CSS media запрос any-hover

Приветствую товарищи фронты! Знаете ли вы про такой медиа запрос?

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

Пример применения:

@media(any-hover: hover) {
.element: hover {
// ваши стили
}
}

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

#css #features

Эффективность — ваш враг

Есть большая вероятность, что причиной большинства проблем в вашей жизни и работе является недостаточная бездеятельность. В статье рассказано как устроена бездеятельность и почему вам её нужно больше.

Читать...

#вакансия #frontend #remote #удалёнка #москва #санктпетербург #javascript #html5 #css3 #saas #git

📢 Frontend разработчик

100 000 - 200 000 оклад
(по результатам тех интервью)

🟦 Продукт:

FPS Booster - программа, специализирующаяся на увеличении производительности компьютера для геймеров.

FPS Booster оптимизирует Windows, применяет продвинутые настройки для увеличения показателя FPS в играх, а также агрегирует в себе ряд полезных сервисов для геймеров. Основная цель - дать преимущество геймерам в игре, получив максимум эффективности из ПК.

🟦 Основной стек:
- JavaScript, ES6+
- Vue.js
- Nuxt.js

🟦 Задачи:
- Разработка и сопровождение веб-приложений. В основном сайта fps-booster.com и других проектов
- Создание новых UI-компонентов, разделов и функцинальных компонентов сайта

🟦 Наши ожидания:
- Хорошие знания JavaScript, ES6+
- Опыт работы с Vue.js/Nuxt.js
- Опыт работы с Vuex и построении store приложения
- Понимание взаимодействия между client и server, передачи и хранения данных, RESTFul
- Отличные знания HTML5 и CSS3 (чистый код, семантическая верстка, flexbox, grid, CSS анимации, a11y)
- Умение работать в команде и разбираться в чужом коде
- Личные качества: ответственность, быстрая обучаемость, самостоятельность и инициативность, умение решать задачи эффективно и в срок
- Знание английского языка на уровне чтения тех. литературы
- Заинтересованность, желание сделать проект лучше

🟦 Плюсом будет:
- Собственные проекты на Github;
- Опыт применения собственных архитектурных решений и создание архитектуры проектов с нуля
- Опыт работы с CSS препроцессорами (LESS, SASS).

https://t.me/hrdforit

Кто самый слабый JavaScript - разработчик?

Привет коллеги! Интересный видос с заковыристыми вопросами по JS в формате викторины. Посмотрите его и испытайте себя на сколько вы гуру.

👉 Проверить свои знания

Комплексная разработка веб-приложений с помощью React и Node.js

React и Node.js. Сочетание этих двух технологий дает огромные преимущества при комплексной разработке веб-приложений.

Посмотрим, насколько хорошо совмещаются React и Node.js для создания быстрых сайтов, которые легко поддерживаются в течение долгого времени.

Читать...

Задача

Что будет выведено в консоль после выполнения этого кода?

Ответ

Express.js. Web Development with Node

Автор: Max Beerbohm, moaml mohmmed
Год издания: 2019

#node #Express #english #beginner

Затмение

Этот красивый эффект достигается использованием CSS анимаций, фильтров и теней.

Метод String.replaceAll (ES12 / ES2021)

String.prototype.replaceAll() заменяет все вхождения строки другим строковым значением.

В настоящее время в JavaScript у строк есть метод replace(). Если входной шаблон для замены является строкой, метод replace() заменяет только первое вхождение. Поэтому в коде второе вхождение «Back» не заменяется.

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

Было:
const str = "Backbencher sits at the Back";
const newStr = str.replace(/Back/g, "Front");
console.log(newStr); // "Frontbencher sits at the Front"

String.prototype.replaceAll() пытается произвести замену всех вхождений, даже если входной шаблон является строкой.

Стало:
const str = "Backbencher sits at the Back";
const newStr = str.replaceAll("Back", "Front");
console.log(newStr); // "Frontbencher sits at the Front"

#js

Become a ninja with Angular

Автор: Ninja Squad
Год издания: 2021

#angular #english

Простое сжатие

Вам дана строка, состоящая из повторяющихся символов. Создайте функцию, которая обработает эту строку и преобразует её в массив, состоящий из кортежей (число повторений, символ).

Примеры:
string1="aaaaaaaaaaaaaaaaaaaaaaaaaabaaaaaaaaaaaaaaaaaa"
output1='[26,"a",1,"b",18,"a"]'

string="aaaaaaaabaaaa"
compressed=[8,"a",1,"b",4,"a"]

console.trace();

Выводит трассировку стека в консоль.

function foo() {
function bar() {
console.trace();
}
bar();
}
foo();

В консоли отобразится следующая трассировка:

bar
foo
<anonymous>

#console #js

The React Workshop

Автор: Brandon Richey, Ryan Yu, Endre Vegh, Theofanis Despoudis, Anton Punith, Florian Sloot
Год издания: 2020

#react #english