Frontend Interview - собеседования по Javascript / Html / Css

08 Sep 2024 18:03

List Filtering

Вам дан массив, состоящий из чисел и строк. Создайте функцию, которая отфильтрует все строки и вернет массив с числами.

Примеры:

filter_list([1,2,'a','b']) == [1,2]
filter_list([1,'a','b',0,15]) == [1,0,15]
filter_list([1,2,'aasf','1','123',123]) == [1,2,123]

Frontend Interview - собеседования по Javascript / Html / Css

08 Sep 2024 07:33

Помощь в трудоустройстве в IT-сфере!

В России из-за дефицита айтишников запустили бесплатную программу по обучению IT-специалистов. Теперь любой желающий может попробовать себя в IT с полного нуля и начать обучение бесплатно!

Узнайте про дальнейшее трудоустройство в ведущие IT-компании для восполнения кадрового дефицита.

Для этого нужно:

- Перейти по ссылке
- Заполнить анкету и ответить на вопросы (занимает менее 3 минут)
- На основании ваших ответов вы сразу узнаете, подходит ли вам сфера IT и сможете ли вы в ней работать

Перейти на сайт

#реклама 16+
urban-university.ru
О рекламодателе

Frontend Interview - собеседования по Javascript / Html / Css

07 Sep 2024 11:01

Стажер: денег не предложили, зато коллектив дружный

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

05 Sep 2024 18:10

​Что делать, когда клиент просит какую-то «дичь»

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

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

Первая. Какую бы дичь ни предлагал клиент, ему она дичью не кажется и стоит относиться к этому с уважением. Просто клиент настолько далёк от специфики работы, что его комментарии могут восприниматься странно. Важно просто объяснить ему, почему предложение кажется нам чрезмерным, и предложить более крутой вариант.

Вторая. И тут-то и заключается проблема. Фрилансер, получив странный комментарий к результату своей работы, сразу представляет, как ему придётся тратить время на внесение правок, испытывает от этого дискофморт и его первая реакция (которая очень легко и неприязненно считывается собеседником) — резко возразить.

Как уменьшить количество «дичи» от клиента, да ещё и повысить его удовлетворённость от процесса работы и результата? Ответ в статье.

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

04 Sep 2024 13:17

Как сделать ссылку на верх веб-страницы?

Ссылка «наверх» позволяет быстро перейти к верхней части веб-страницы, где обычно располагается логотип, навигация по сайту и другие типовые элементы сайта.

Для создания такой ссылки, в её адресе достаточно указать #top. Все современные браузеры понимают такой адрес и при щелчке по этой ссылке переходят к верхней части текущей веб-страницы.

<a href="#top">Наверх</a>

<button onclick="window.location.href='#top'">Наверх</button>

Frontend Interview - собеседования по Javascript / Html / Css

03 Sep 2024 18:02

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

02 Sep 2024 16:00

​Какие главные особенности куки ?

Cookies (куки) — это небольшие кусочки данных, хранящиеся в браузере и используемые для сохранения информации о пользователе. Вот основные особенности:

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

Ограниченный размер
Размер каждого куки ограничен (обычно до 4KB). Поэтому куки не подходят для хранения больших объемов данных.

Срок действия (время жизни)
Каждая кука имеет время жизни, которое задается параметром Expires или Max-Age. По истечении этого времени кука автоматически удаляется браузером.

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

Безопасность (HTTP-only и Secure)
HTTP-only: Куки, установленные с флагом HttpOnly, недоступны через JavaScript, что помогает защитить данные от XSS-атак.
Secure: Куки, установленные с флагом Secure, передаются только по защищенному HTTPS соединению.

Передача с запросами
Автоматически отправляются серверу с каждым HTTP-запросом к соответствующему домену, что позволяет серверу узнавать пользователя и сохранять его сессию.

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

01 Sep 2024 18:02

Count the photos!

Вам дана строка, представляющая собой дорогу. На ней есть камеры, обозначенные символом ".", а также машины, которые двигаются вправо - ">", и машины, которые двигаются влево - "<". Камера делает фотографию, если машины двигается в её сторону. Создайте функцию, которая вернет количество сделанных фото.

Примеры:
For ">>." -> 2 photos were taken
For ".>>" -> 0 photos were taken
For ">.<." -> 3 photos were taken
For ".><.>>.<<" -> 11 photos were taken

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

31 Aug 2024 18:01

Что такое :root в CSS?

Псевдокласс :root нужен для обращения к самому главному родительскому элементу документа. Его также называют корневым элементом. В случае HTML-документа самым главным родителем всей страницы будет тег <html>. Часто :root используется для того, чтобы задавать кастомные свойства.

Пример
Укажем в документе нужный нам шрифт и создадим несколько кастомных свойств:

:root {
  font-family: 'Oswald', sans-serif;
  --button-size: 40px;
  --main-color: #bada55;
}

:root {
  background-color: peachpuff;
}

html {
  background-color: tomato;
}

Frontend Interview - собеседования по Javascript / Html / Css

30 Aug 2024 07:33

Партнёрская программа рекрутинга в Яндекс Еду

Станьте партнёром Яндекс Еды по привлечению курьеров и получите кучу преимуществ:

💰Платим до 25 000 ₽ за успешного кандидата

📞Поддержка на всех этапах

📅Свободное расписание

📊Удобные инструменты для работы

Приводите новых курьеров и получайте в среднем 187 000 ₽ в месяц!


Зарегистрироваться

#реклама
eda.yandex.ru
О рекламодателе

Frontend Interview - собеседования по Javascript / Html / Css

29 Aug 2024 08:34

Такси для бизнеса. Яндекс Go

Оптимизируйте свои расходы и повысьте эффективность бизнеса с Яндекс Go


Узнать больше

#реклама
business.go.yandex
О рекламодателе

Frontend Interview - собеседования по Javascript / Html / Css

27 Aug 2024 18:03

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

26 Aug 2024 08:36

Методичка: как сделать онлайн-встречи эффективнее

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

Команда МТС Линк собрала на 37 страницах полезные материалы, чек-листы и кейсы, которые помогают компаниям проводить эффективные совещания в онлайне с помощью сервиса Встречи.

Из методички узнаете:
- Как создать постоянную ссылку и подключаться на встречи в 2 клика,
- Как делать заметки и работать с файлами, не переживая за качество связи и безопасность данных.
- Как облегчает жизнь ИИ, который расшифровывает созвоны в текст и автоматически отправляет расшифровку на почту.

Еще в методичке описаны 7 способов оценки текущей эффективности ваших онлайн-встреч.

Получить гайд можно бесплатно на сайте.

Скачать

#реклама
mts-link.ru
О рекламодателе

Frontend Interview - собеседования по Javascript / Html / Css

25 Aug 2024 12:03

React быстро

«React быстро. 2-е издание» предлагает уникальный подход к освоению фреймворка React. Более 80 компактных примеров проведут читателя от изучения основ работы к созданию довольно сложных приложений. В книге подробно описаны многие функциональные компоненты, хуки React и средства доступности веб-приложений, а также представлены интересные проекты для отработки новых навыков.

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

24 Aug 2024 18:07

Что такое миксины в CSS препроцессорах?

Миксины Используются в препроцессорах, таких как Sass и Less, для группировки CSS-деклараций, которые можно повторно использовать во всем стилевом файле. Это упрощает поддержку и изменение стилей, позволяя избежать повторения кода.

Пример использования в Sass:

@mixin border-radius($radius) {
     -webkit-border-radius: $radius;
        -moz-border-radius: $radius;
         -ms-border-radius: $radius;
             border-radius: $radius;
}

.button {
     @include border-radius(10px);
}

Frontend Interview - собеседования по Javascript / Html / Css

08 Sep 2024 12:03

Алгоритмы: разработка и применение

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

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

07 Sep 2024 18:03

​Что такое useСontext в React ?

Это один из встроенных хуков, который позволяет компонентам подписываться на контекст и получать доступ к данным контекста. Используется для передачи данных через дерево компонентов без необходимости передавать пропсы на каждом уровне. Это особенно полезно для глобальных данных, таких как текущий авторизованный пользователь, тема (светлая/темная) или настройки локализации.

Как он работает?

- Создание контекста
Для создания контекста используется функция createContext. Она возвращает объект контекста, который содержит два компонента: Provider и Consumer.

   import React, { createContext, useState } from 'react';

   const MyContext = createContext();
   

    const MyProvider = ({ children }) => {
     const [state, setState] = useState('Hello World');

     return (
       <MyContext.Provider value={{ state, setState }}>
         {children}
       </MyContext.Provider>
     );
   };

import React, { useContext } from 'react';

   const MyComponent = () => {
     const { state, setState } = useContext(MyContext);

     return (
       <div>
         <p>{state}</p>
         <button onClick={() => setState('New Value')}>Change Value</button>
       </div>
     );
   };

Frontend Interview - собеседования по Javascript / Html / Css

06 Sep 2024 07:33

Помощь в трудоустройстве в IT-сфере!

По всей России объявили бесплатную программу на шестимесячное обучение по IT-cпециальностям.

Запись на участие в программе продлится до конца июля, но чтобы туда попасть, нужно пройти специальный профтест.

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

Перейти на сайт

#реклама 16+
urban-university.ru
О рекламодателе

Frontend Interview - собеседования по Javascript / Html / Css

05 Sep 2024 17:10

Frontend теперь в телеграм!

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

Логово Верстальщика — научит верстать продающие сайты.

Node.JS — поможет узнать все тонкости и секреты JavaScript и его фреймворков.

Frontender's notes — советы и полезные приемы для каждого разработчика.

Frontend Interview - собеседования по Javascript / Html / Css

04 Sep 2024 11:17

Джентельменский набор трушного фронтендера

Опытные Frontend-разработчики собрали самые востребованные и бесплатные каналы, без которых не обойдется ни один настоящий фронтендер.

Макеты для верстки — самый крупный канал с макетами для верстки. Первоисточник всех макетов в Telegram.

Полезная вËрстка — канал с готовыми решениями повседневных задач: слайдеры, анимация, навигация и т.д.

JavaScript заметки — образовательный канал с ежедневными практическими заметками по языку.

codepen.js — готовые коды: реализованные на css и js анимации, скрипты и интерфейсы. Оживи статичные макеты

Figma Start — каждый день выпускаем крутые макеты для верстки. Выбери самый интересный и удиви рекрутеров!

Развивайся с нами, ведь так проще!

Frontend Interview - собеседования по Javascript / Html / Css

03 Sep 2024 14:00

❗️Создайте свое приложение для прогноза погоды всего за 1 час

❓Хотите научиться создавать полезные приложения и работать со сторонними веб-сервисами?

⏰ Ждем вас на открытом вебинаре 4 сентября в 20:00 мск, где мы разберем:

- как работать с API сторонних веб-сервисов на примере создания приложения для прогноза погоды;
- основные принципы работы с API и их интеграции в проекты;
- как расширить функционал приложения и использовать больше браузерных инструментов.

🔥 Урок идеально подходит для тех, кто знает основы JavaScript (циклы, условия, функции, базовая работа с DOM).

Встречаемся в преддверии старта курса «JavaScript Developer. Basic». Все участники вебинара получат специальную цену на обучение!

👉Регистрируйтесь прямо сейчас, чтобы не пропустить мероприятие: https://vk.cc/cA2r4D

Реклама. ООО «Отус онлайн-образование», ОГРН 1177746618576, www.otus.ru erid 2SDnjc9FMjY

Frontend Interview - собеседования по Javascript / Html / Css

02 Sep 2024 14:00

Мы за бесплатное обучение

Подборка каналов для роста и развития в сфере Frontend-разработки

👥 Reactify | Frontend Разработка — активное сообщество для бесплатного обучения веб-разработке.

💼 Frontend | Собеседования — огромная база актуальной теории для Frontend Разработчиков.

Обучайтесь, общайтесь, растите вместе с нами. Станьте частью IT-сообщества!

Frontend Interview - собеседования по Javascript / Html / Css

01 Sep 2024 12:03

Настольная книга веб-дизайнера. Практический курс по вебдизайну и проектированию сайтов

Эта книга научит вас тонкостям веб-дизайна и проектированию сайтов. Учебник включает в себя все этапы работы вебдизайнера: начиная с проектирования и заканчивая реализацией сайта.

Книга посвящена описанию этапов разработки сайтов: прототипированию, дизайну веб-страниц, нарезке, дизайну мобильной версии и запуску сайта.
Также вы узнаете: как сделать продающий сайт, как правильно заполнить техзадание и создать базу образцов, как собрать семантическое ядро, купить хостинг и домен, какой конструктор сайтов выбрать. Вы легко создадите первую страницу сайта, состоящую из: хедера, слайдера, преимуществ, модуля «О компании», каталога товаров, схемы работы, отзывов, фотогалереи и футера.

Для начинающих специалистов.

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

31 Aug 2024 11:01

Отдел разработки на пути к релизу

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

29 Aug 2024 18:04

Один день из жизни JavaScript разработчика и его техлида

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

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

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

28 Aug 2024 11:02

Как сделать фон полупрозрачным?

Для создания цветного фона разной степени прозрачности применяется свойство background или background-color, в качестве значения указывается функция rgba(), в которой цвет задаётся четырьмя параметрами: красная, зелёная, синяя составляющая цвета и уровень прозрачности. Значение 0 соответствует полной прозрачности, 1 — непрозрачности, а промежуточное значение вроде 0.5 — полупрозрачности.

Чтобы полупрозрачность элемента была заметна, под него следует подложить фоновую картинку. В примере на картинке для веб-страницы установлено фиксированное фоновое изображение и добавлен <div> с классом overlay, для которого задан белый фон с уровнем прозрачности 0.8.

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

26 Aug 2024 14:06

​Что такое замыкание ?

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

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

Пример:

function создатьСчетчик() {
    let количество = 0; // переменная количество "замкнута" внутри функции увеличить

    function увеличить() {
        количество += 1;
        return количество;
    }

    return увеличить;
}

const счетчик = создатьСчетчик();
console.log(счетчик()); // 1
console.log(счетчик()); // 2

Frontend Interview - собеседования по Javascript / Html / Css

25 Aug 2024 18:02

Find the Missing Number

Вам дан неотсортированный массив, состоящий из чисел от 0 до 100. Но одного числа не хватает, найдите это число.

👉 @frontendInterview

Frontend Interview - собеседования по Javascript / Html / Css

25 Aug 2024 08:36

Запустите рекламу в телеграм-каналах с Яндекс Директом

Перфоманс-реклама теперь в телеграм-каналах ⚡

Яндекс Директ знает, как привлечь целевую аудиторию 💰👌

Попробовать

#реклама
yandex.ru
О рекламодателе

Frontend Interview - собеседования по Javascript / Html / Css

24 Aug 2024 11:03

👉 @frontendInterview