Веб-страница
22.1K subscribers
2.17K photos
561 videos
2 files
4.45K links
Всё по фронтенду, бэкенду и девопсу в одном месте

Разместить рекламу: @tproger_sales_bot

Правила общения: https://tprg.ru/rules

Другие каналы: @tproger_channels

Сайт: https://tprg.ru/site

Регистрация в перечне РКН: https://tprg.ru/64ai
Download Telegram
Любой проект на JavaScript be like:
🤣83🥰6💩1🥱1
​Использование FileReader для чтения файлов в JavaScript

Нашли для вас туториал о том, как использовать FileReader для чтения содержимого файлов в браузере. Автор статьи на практике рассмотрел несколько примеров, как с использованием элемента input, так и Drag'n'Drop:

https://itchief.ru/javascript/filereader

#javascript #туториал
🔥11👍2🐳1
​Для чего используется метод freeze()

Этот метод служит для «замораживания» объекта. Замороженный объект является неизменяемым. Это означает, что в такой объект нельзя добавлять новые свойства, удалять или изменять существующие. Также этот метод устанавливает configurable: false и writable: false для существующих свойств. Метод возвращает замороженный объект.

#основы
👍20❤1👏1
This media is not supported in your browser
VIEW IN TELEGRAM
Анимированная форма обратной связи

Ещё один способ сделать ваш сайт более интересным. Проект реализован с помощью CSS, jQuery и TweenMax.js.

Посмотреть код можно тут:

https://codepen.io/izmaelmag/pen/NqyEKx

#codepen
🔥17❤4💩3
Аж глаз задёргался
😁106🤯11🔥5😱2🥱2🤣2😈2🕊1😐1
Какое свойство добавляет плавности в переход CSS?
Anonymous Quiz
9%
Fluency
87%
Transition
5%
Opacity
🍓12👍4❤2😍1
Требуется Senior Frontend Developer

Группа компаний в сфере digital Kokoc Group ищет к себе в команду мощного специалиста, который будет заниматься разработкой и поддержкой текущей компонентной базы react компонентов и внедрением next.js.

Вы идеальный кандидат, если:

— имеете опыт коммерческой разработки от 4х лет;
— хорошо знаете React, JavaScript (операции с массивами, объектами), TypeScript, HTML/CSS, HTTP;
— имеете опыт работы с Next.js;
— умеете конфигурировать webpack;
— можете писать код, который понятен даже коллегам из бэкенда.

По ссылке все подробности, условия и возможность оставить отклик:https://tprg.ru/EHzY

#работа #вакансии
🔥4👍1
​Задачи по JavaScript

Проверьте, содержит ли строка одинаковое количество символов «x» и «o». Метод должен возвращать логическое значение и быть нечувствительным к регистру. Строка может содержать любой символ.

Пример:

XO("ooxx") => true
XO("xooxx") => false
XO("ooxXm") => true
XO("zpzpzpp") => true // when no 'x' and 'o' is present should return true
XO("zzoo") => false

Поделитесь своими результатами в комментариях👇

#задачи
🤡10🌚3
​Задачи по JavaScript

Вчера мы опубликовали задачу, а вот и один из вариантов её решения.

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

#задачи
👍13🥴2
Подборка актуальных вакансий

— QA Automation Java (web, UI) в Открытие
Где: удалённо
Опыт: от 2 лет

— Python-разработчик в Kokoc Group
Где: удалённо
Опыт: от 3 лет

— Разработчик PHP Middle+ / Senior в Kokoc Group
Где: удалённо
Опыт: от 3 лет

— Middle/Senior Backend Node.js Developer в МТС
Где: удалённо
Опыт: от 3 лет

— Senior QA Automation Java / Kotlin в Иннотех
Где: удалённо
Опыт: от 3 лет

— Senior Frontend Developer в Kokoc Group
Где: удалённо
Опыт: от 4 лет

— Senior Fullstack Developer / Фулстек разработчик (.net/react) в Иннотех
Где: удалённо
Опыт: от 5 лет

#вакансии #работа
​Как отправить синхронный HTTP-запрос

XMLHttpRequest — это встроенный в браузер объект, который даёт возможность делать HTTP-запросы к серверу без перезагрузки страницы.

Чтобы сделать синхронный запрос, нам нужно, для начала, создать XMLHttpRequest. Затем в методе open третий параметр установить, как false.

Выполнение JavaScript останавливается на send() и возобновляется после получения ответа. Так ведут себя, например, функции alert или prompt.

Синхронные запросы используются редко, так как они блокируют выполнение JavaScript до тех пор, пока загрузка не завершена. В некоторых браузерах нельзя прокручивать страницу, пока идёт синхронный запрос. Если же запрос по какой-то причине выполняется слишком долго, браузер предложит закрыть «зависшую» страницу.

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

#основы
👍19🤡10❤1🔥1🤮1💩1
​За что ненавидят язык программирования JavaScript

Интересный материал о проблемах языка. Автор рассказал основные причины, по которым не любят JavaScript, и разобрался, справедливы ли претензии.

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

https://tproger.ru/articles/za-chto-nenavidyat-yazyk-programmirovaniya-javascript

#javascript
🤡24🔥6💩3👍2❤1
​Создание ToDo-листа бесконечной вложенности

Подробный туториал по созданию ToDo-листа со всем необходимым функционалом. Для создания проекта автор использовал React, TypeScript и MobX.

По ссылке вы также сможете ознакомиться с полным кодом в репозитории проекта:

https://tproger.ru/articles/sozdanie-todo-list-beskonechnoj-vlozhennosti-react-typescript-mobx

#туториал
👍11
​Rematch — Redux без шаблонного кода

Rematch — это интуитивный и легковесный фреймворк для управления состоянием вашего веб-приложения на основе Redux. Он предлагает простой и эффективный подход к организации и управлению Redux-хранилищем, сокращая количество лишнего кода и упрощая разработку.

Автор статьи предлагаю вам ознакомиться с основными преимуществами Rematch и узнать, как просто и эффективно использовать его для управления состоянием ваших приложений:

https://habr.com/ru/companies/usetech/articles/761168/

#rematch
🔥3👎1
This media is not supported in your browser
VIEW IN TELEGRAM
GitHub тоже помогает развивать мелкую моторику

Поэтому почему бы не сделать анимацию его логотипа в стиле одного известного сайта для взрослых? Автор проекта подумал также и написал небольшой проект, использовав только HTML и CSS.

Если хотите сделать анимацию для какого-нибудь ещё «Хаба», то ссылку на проект оставили тут:

https://codepen.io/toshiya-marukubo/pen/qBPryZb

#codepen
🤣24👍8🤮7🥴2🥰1🌭1🍓1
​Для чего используется stopPropagation()

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

При клике по вложенному контейнеру в консоль выводится сообщение «Внутренний контейнер». Если убрать event.stopPropagation(), то при клике по вложенному контейнеру, в консоль будут выведены оба сообщения.

#основы
👍27❤5👎1
This media is not supported in your browser
VIEW IN TELEGRAM
Интерактивная галерея

Интересный способ презентовать товар для своих клиентов на вашем сайте. Для реализации проекта автор использовал CSS и библиотеку GSAP.js.

Посмотреть код можно тут:

https://codepen.io/GreenSock/pen/LYRwgPo

#codepen
👍16🤩1
... до нервного срыва

Предлагаю вам продолжить этот тред в комментариях👇
❤29😁22💩2👎1🔥1
​Задачи по JavaScript

Изограмма – это слово, в котором нет повторяющихся букв. Реализуйте функцию, которая определяет, является ли строка, содержащая только буквы, изограммой. Предположим, что пустая строка является изограммой. Не обращайте внимания на регистр букв.

Пример:

isIsogram("Dermatoglyphics") // true
isIsogram("moose") // false
isIsogram("aba") // false

Поделитесь своими результатами в комментариях👇

#задачи
🍓7👍1🥱1