👩💻 Топ-10 заданий по написанию кода для собеседования по React.js в 2024 году
Эти 10 заданий по созданию кода с примерами решений помогут закрепить основные теоретические понятия React.js и прокачать практические навыки. Изучение лучших сценариев написания кода — верный путь к успешному прохождению собеседования.
Читать...
Original post link: t.me/frontendnoteschannel/3589
Forwarded and filtered by @smartfeed_bot
Эти 10 заданий по созданию кода с примерами решений помогут закрепить основные теоретические понятия React.js и прокачать практические навыки. Изучение лучших сценариев написания кода — верный путь к успешному прохождению собеседования.
Читать...
Original post link: t.me/frontendnoteschannel/3589
Forwarded and filtered by @smartfeed_bot
NOP::Nuances of programming
Топ-10 заданий по написанию кода для собеседования по React.js в 2024 году
Эти 10 заданий по созданию кода с примерами решений помогут закрепить основные теоретические понятия React.js и прокачать практические навыки. Изучение лучших сценариев написания кода — верный путь к успешному прохождению собеседования.
Forwarded from Senior Frontend - javascript, html, css
Отрицание, торг и принятие работы над проектом без документации
В мире разработки программного обеспечения существует множество вызовов, и одним из них является столкновение с проектами, лишенными должной документации. Это часто вызывает чувство потерянности и озадаченности, подобно тому как путник оказывается в темном лесу без карты и компаса. В таких моментах первая мысль, которая приходит в голову, - "Может, лучше свернуть назад?"
Однако, несмотря на первоначальное замешательство, такие ситуации предоставляют уникальную возможность стать настоящим героем проекта. Представьте себе, каким уважаемым и крутым специалистом вы станете, создавая систему документации с нуля!
С таким мощным стимулом автор статьи и решила приступить к делу:
1. Разработка шаблонов для стандартизации: Начнем с того, что создадим набор шаблонов, которые помогут нам описывать каждый аспект проекта в едином стиле и формате. Это не только облегчит процесс документирования, но и сделает его более удобным и понятным для всей команды.
2. Анализ базы данных: База данных является краеугольным камнем любого проекта. Без глубокого понимания ее структуры невозможно построить четкую картину всего проекта. Поэтому мы начнем с детального анализа базы данных, чтобы убедиться, что мы имеем полное представление о ее структуре и связях между данными.
3. Создание сервисной карты: Давайте разложим все сервисы и их взаимосвязи на столе. Это поможет нам визуализировать работу нашей системы в целом и лучше понять ее архитектуру. Кроме того, это даст нам возможность выявить возможные узкие места и проблемные зоны, которые требуют дополнительного внимания.
4. Документация процесса тестирования: Четко описанный процесс тестирования - это ключевой элемент успешного проекта. Он не только помогает нам обеспечить качество продукта, но и повышает эффективность работы всей команды. Поэтому мы обязательно займемся созданием подробной документации по процессу тестирования, чтобы у нас была ясная стратегия и план действий на каждом этапе разработки.
5. Описание сценариев использования (use case): Представим себя в роли пользователя и опишем типичные сценарии использования нашего продукта. Это поможет нам лучше понять его функционал и потребности пользователей, а также выявить возможные улучшения и дополнительные функциональные требования.
6. Документация API с использованием Swagger: Документация API - это неотъемлемая часть любого современного проекта. Она позволяет другим разработчикам легко и эффективно взаимодействовать с нашим продуктом, используя наши API.
👉 @seniorFront
В мире разработки программного обеспечения существует множество вызовов, и одним из них является столкновение с проектами, лишенными должной документации. Это часто вызывает чувство потерянности и озадаченности, подобно тому как путник оказывается в темном лесу без карты и компаса. В таких моментах первая мысль, которая приходит в голову, - "Может, лучше свернуть назад?"
Однако, несмотря на первоначальное замешательство, такие ситуации предоставляют уникальную возможность стать настоящим героем проекта. Представьте себе, каким уважаемым и крутым специалистом вы станете, создавая систему документации с нуля!
С таким мощным стимулом автор статьи и решила приступить к делу:
1. Разработка шаблонов для стандартизации: Начнем с того, что создадим набор шаблонов, которые помогут нам описывать каждый аспект проекта в едином стиле и формате. Это не только облегчит процесс документирования, но и сделает его более удобным и понятным для всей команды.
2. Анализ базы данных: База данных является краеугольным камнем любого проекта. Без глубокого понимания ее структуры невозможно построить четкую картину всего проекта. Поэтому мы начнем с детального анализа базы данных, чтобы убедиться, что мы имеем полное представление о ее структуре и связях между данными.
3. Создание сервисной карты: Давайте разложим все сервисы и их взаимосвязи на столе. Это поможет нам визуализировать работу нашей системы в целом и лучше понять ее архитектуру. Кроме того, это даст нам возможность выявить возможные узкие места и проблемные зоны, которые требуют дополнительного внимания.
4. Документация процесса тестирования: Четко описанный процесс тестирования - это ключевой элемент успешного проекта. Он не только помогает нам обеспечить качество продукта, но и повышает эффективность работы всей команды. Поэтому мы обязательно займемся созданием подробной документации по процессу тестирования, чтобы у нас была ясная стратегия и план действий на каждом этапе разработки.
5. Описание сценариев использования (use case): Представим себя в роли пользователя и опишем типичные сценарии использования нашего продукта. Это поможет нам лучше понять его функционал и потребности пользователей, а также выявить возможные улучшения и дополнительные функциональные требования.
6. Документация API с использованием Swagger: Документация API - это неотъемлемая часть любого современного проекта. Она позволяет другим разработчикам легко и эффективно взаимодействовать с нашим продуктом, используя наши API.
👉 @seniorFront
И это даже не треть всего кода...
Original post link: t.me/tproger_web/4578
Forwarded and filtered by @smartfeed_bot
Original post link: t.me/tproger_web/4578
Forwarded and filtered by @smartfeed_bot
This media is not supported in your browser
VIEW IN TELEGRAM
Flex Slider
Интерактивный слайдер, выполненный с помощью фреймворка Vue.js. При клике на секцию показывается дополнительная информация.
https://codepen.io/rodleviton/pen/yLPGBZP
Original post link: t.me/senior_front/2016
Forwarded and filtered by @smartfeed_bot
Интерактивный слайдер, выполненный с помощью фреймворка Vue.js. При клике на секцию показывается дополнительная информация.
https://codepen.io/rodleviton/pen/yLPGBZP
Original post link: t.me/senior_front/2016
Forwarded and filtered by @smartfeed_bot
Flexbox Defense — защищаемся башнями и изучаем flexbox
В этой простой игре в стиле Tower Defense вы сможете попрактиковаться в использовании Flexbox CSS. Вас ожидают 12 волн с различными условиями.
Поиграть можно тут:
http://www.flexboxdefense.com/
#css
Original post link: t.me/tproger_web/4579
Forwarded and filtered by @smartfeed_bot
В этой простой игре в стиле Tower Defense вы сможете попрактиковаться в использовании Flexbox CSS. Вас ожидают 12 волн с различными условиями.
Поиграть можно тут:
http://www.flexboxdefense.com/
#css
Original post link: t.me/tproger_web/4579
Forwarded and filtered by @smartfeed_bot
🎨 Цветовая палитра макета "Ice Cream Landing Page"
Сайтодел | #палитра
Original post link: t.me/sitodel/1778
Forwarded and filtered by @smartfeed_bot
HEX | RGB #F094DF | rgb(240,148,223)
#A10520rgb(161,5,32) #400404 | rgb(64,4,4)
⚠️ Цвет копируется одним кликом!Сайтодел | #палитра
Original post link: t.me/sitodel/1778
Forwarded and filtered by @smartfeed_bot
👩💻 Check Done SVG Animated
Красиво анимированная галочка. Сделана на SVG и SCSS.
Открыть код
Original post link: t.me/frontendnoteschannel/3592
Forwarded and filtered by @smartfeed_bot
Красиво анимированная галочка. Сделана на SVG и SCSS.
Открыть код
Original post link: t.me/frontendnoteschannel/3592
Forwarded and filtered by @smartfeed_bot
codepen.io
Check Done SVG Animated
...
Конференция Яндекса по бэкенду
30 ноября в Москве Яндекс проведёт большую конференцию для бэкенд-разработчиков — YaTalks 2019: https://tprg.ru/yatalks191
На мероприятии выступят продвинутые инженеры из Яндекса, Google и других продуктовых компаний, чтобы обсудить самые модные технологии и полезные кейсы.
Если этого мало, то приходите похоливарить на попкорн-сессиях со злободневными вопросами и прокачать навык дебатов на дискуссионных площадках.
Подробная программа и регистрация на сайте: https://tprg.ru/yatalks191
#партнёрский
Original post link: t.me/c/-1001044298783/12068
Forwarded and filtered by @smartfeed_bot
30 ноября в Москве Яндекс проведёт большую конференцию для бэкенд-разработчиков — YaTalks 2019: https://tprg.ru/yatalks191
На мероприятии выступят продвинутые инженеры из Яндекса, Google и других продуктовых компаний, чтобы обсудить самые модные технологии и полезные кейсы.
Если этого мало, то приходите похоливарить на попкорн-сессиях со злободневными вопросами и прокачать навык дебатов на дискуссионных площадках.
Подробная программа и регистрация на сайте: https://tprg.ru/yatalks191
#партнёрский
Original post link: t.me/c/-1001044298783/12068
Forwarded and filtered by @smartfeed_bot
Media is too big
VIEW IN TELEGRAM
Image Slider
В этом видео создается слайдер картинок с нуля на JS.
👉 @seniorFront
Original post link: t.me/seniorFront/4100
Forwarded and filtered by @smartfeed_bot
В этом видео создается слайдер картинок с нуля на JS.
👉 @seniorFront
Original post link: t.me/seniorFront/4100
Forwarded and filtered by @smartfeed_bot
🖥 Дайджест самых интересных публикаций за последние дни:
• HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи.
• Асинхронный веб: WebSocket, Server-Sent Events, Long Polling и Short Polling
• Путь Frontend разработчика. Как им стать?
• React Conf 2024. React v19
Original post link: t.me/frontendnoteschannel/3593
Forwarded and filtered by @smartfeed_bot
• HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи.
• Асинхронный веб: WebSocket, Server-Sent Events, Long Polling и Short Polling
• Путь Frontend разработчика. Как им стать?
• React Conf 2024. React v19
Original post link: t.me/frontendnoteschannel/3593
Forwarded and filtered by @smartfeed_bot
Хабр
HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 8
Хабр, я снова пришёл к вам с практическими советами про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который...
Как вы можете обойти ограничение однопоточности JavaScript для улучшения производительности вычислительно интенсивной задачи?
Используйте Web Workers для выполнения задач в фоновом потоке.
Original post link: t.me/senior_front/2018
Forwarded and filtered by @smartfeed_bot
Используйте Web Workers для выполнения задач в фоновом потоке.
Original post link: t.me/senior_front/2018
Forwarded and filtered by @smartfeed_bot
Стать сотрудником Яндекса быстрее и проще, чем кажется. Участвуйте в днях быстрого найма: решите тестовое, пройдите несколько секций собеседования и получите офер за несколько дней.
Ближайшее Fast Track мероприятие:
• 3–7 июня — для технических менеджеров и Crowd Solutions Architect, офер за 5 дней в команду Crowd.
Зарегистрироваться
Original post link: t.me/frontendnoteschannel/3594
Forwarded and filtered by @smartfeed_bot
Ближайшее Fast Track мероприятие:
• 3–7 июня — для технических менеджеров и Crowd Solutions Architect, офер за 5 дней в команду Crowd.
Зарегистрироваться
Original post link: t.me/frontendnoteschannel/3594
Forwarded and filtered by @smartfeed_bot
Работа в Яндексе
Получите офер в Яндекс за 1–2 дня!
Страница быстрых наймовых мероприятий.
This media is not supported in your browser
VIEW IN TELEGRAM
‼️Всем кодерам посвящается‼️
Code Ready — полезные ресурсы, шпаргалки, плагины, разработка веб-приложений, и многое другое для твоих проектов, сразу с готовым кодом, и примером их использования.
🪩Расставь приоритеты, добавь лёгкости в свою работу и становись лучше с @code_ready
Original post link: t.me/seniorFront/4102
Forwarded and filtered by @smartfeed_bot
Code Ready — полезные ресурсы, шпаргалки, плагины, разработка веб-приложений, и многое другое для твоих проектов, сразу с готовым кодом, и примером их использования.
🪩Расставь приоритеты, добавь лёгкости в свою работу и становись лучше с @code_ready
Original post link: t.me/seniorFront/4102
Forwarded and filtered by @smartfeed_bot
Forwarded from Веб-страница
Самые популярные вопросы на собеседовании фронтенд-разработчика
Это 55 выпуск видеокаста «Front-end. Вопросы на собеседовании».
В серии видео автор помогает подготовиться к собеседованиям на позицию джуниор и мидл фронтенд-разработчик.
Видеокаст представлять из себя коллекцию технических вопросов, которые можно получить на интервью: https://www.youtube.com/watch?v=PI1X5oFHou8
В этом выпуске:
— Что такое хвостовая рекурсия? Оптимизация рекурсии?
— Что такое и как работает debounce() и throttle() в JavaScript?
— Как в JavaScript работают декораторы? Как они могут быть использованы для модификации поведения классов и методов?
— Как можно создавать пользовательское событие (custom events) в JavaScript?
— Что такое IndexedDB? Как работает IndexedDB?
— Расскажите о методе requestAnimationFrame()?
— Как работают дефолтные параметры в ES6?
— Что такое «BigInt» в ES2020 и для чего он используется?
— Какие нововведения были представлены в ECMAScript 2021 (ES12)?
— Что такое fetch()? Как работает функция fetch()?
— Что такое JSON в JavaScript? Как его можно использовать?
— Что такое и как работает коэффициент сжатия (compression ratio) в контексте веб-разработки?
#собеседование #фронтенд
Это 55 выпуск видеокаста «Front-end. Вопросы на собеседовании».
В серии видео автор помогает подготовиться к собеседованиям на позицию джуниор и мидл фронтенд-разработчик.
Видеокаст представлять из себя коллекцию технических вопросов, которые можно получить на интервью: https://www.youtube.com/watch?v=PI1X5oFHou8
В этом выпуске:
— Что такое хвостовая рекурсия? Оптимизация рекурсии?
— Что такое и как работает debounce() и throttle() в JavaScript?
— Как в JavaScript работают декораторы? Как они могут быть использованы для модификации поведения классов и методов?
— Как можно создавать пользовательское событие (custom events) в JavaScript?
— Что такое IndexedDB? Как работает IndexedDB?
— Расскажите о методе requestAnimationFrame()?
— Как работают дефолтные параметры в ES6?
— Что такое «BigInt» в ES2020 и для чего он используется?
— Какие нововведения были представлены в ECMAScript 2021 (ES12)?
— Что такое fetch()? Как работает функция fetch()?
— Что такое JSON в JavaScript? Как его можно использовать?
— Что такое и как работает коэффициент сжатия (compression ratio) в контексте веб-разработки?
#собеседование #фронтенд
👩💻 Как написать правильный API-клиент на Typescript
В этой статье подробно расскажут о реализации API-клиента на языке TypeScript для работы как со сторонними API, так и со своими собственными. Клиент может работать с публичными и защищенными эндпойнтами и не привязан к конкретному фреймворку, что делает его пригодным для использования в React, Vue, Svelte и других фреймворках.
Читать...
Original post link: t.me/frontendnoteschannel/3595
Forwarded and filtered by @smartfeed_bot
В этой статье подробно расскажут о реализации API-клиента на языке TypeScript для работы как со сторонними API, так и со своими собственными. Клиент может работать с публичными и защищенными эндпойнтами и не привязан к конкретному фреймворку, что делает его пригодным для использования в React, Vue, Svelte и других фреймворках.
Читать...
Original post link: t.me/frontendnoteschannel/3595
Forwarded and filtered by @smartfeed_bot
Библиотека программиста
📜 Как написать правильный API-клиент на Typescript
В этой статье я подробно расскажу о реализации API-клиента на языке TypeScript для работы как со сторонними API, так и со своими собственными. Клиент может работать с публичными и защищенными эндпойнтами и не привязан к конкретному фреймворку, что делает…
This media is not supported in your browser
VIEW IN TELEGRAM
Revealing Slider
Реализовано на HTML и SCSS. Анимация переключения создана при помощи CSS clip-path.
👉 @seniorFront
Original post link: t.me/seniorFront/4105
Forwarded and filtered by @smartfeed_bot
Реализовано на HTML и SCSS. Анимация переключения создана при помощи CSS clip-path.
👉 @seniorFront
Original post link: t.me/seniorFront/4105
Forwarded and filtered by @smartfeed_bot
🖥 Создание собственного графического клиента ChatGPT с помощью NextJS и Wing
К концу этой статьи вы создадите и развернете клиент ChatGPT с помощью Wing и Next.js. Это приложение может запускаться локально (в локальном облачном симуляторе) или развертываться у вашего собственного облачного провайдера.
Читать...
Original post link: t.me/frontendnoteschannel/3596
Forwarded and filtered by @smartfeed_bot
К концу этой статьи вы создадите и развернете клиент ChatGPT с помощью Wing и Next.js. Это приложение может запускаться локально (в локальном облачном симуляторе) или развертываться у вашего собственного облачного провайдера.
Читать...
Original post link: t.me/frontendnoteschannel/3596
Forwarded and filtered by @smartfeed_bot
Хабр
Создание собственного графического клиента ChatGPT с помощью NextJS и Wing
P. S: К концу этой статьи вы создадите и развернете клиент ChatGPT с помощью Wing и Next.js. Это приложение может запускаться локально (в локальном облачном симуляторе) или развертываться у вашего...
JavaScript. Напишите функцию
Ответ
Original post link: t.me/senior_front/2019
Forwarded and filtered by @smartfeed_bot
order, которая принимает строку и возвращает её вариант, очищенный от цифр, вшитых в каждое слово, и отсортированный на основе этих цифр.Ответ
Original post link: t.me/senior_front/2019
Forwarded and filtered by @smartfeed_bot
🖥 Grass – макет для сайта про ИИ. Основной цвет – салатовый, смешанный с бирюзовым. В макете есть небольшие модальные окна и интересная инфографика.
Сайтодел | #макет #figma
Original post link: t.me/sitodel/1780
Forwarded and filtered by @smartfeed_bot
Сайтодел | #макет #figma
Original post link: t.me/sitodel/1780
Forwarded and filtered by @smartfeed_bot
Когда ты веб-разработчик и не можешь придумать, что подарить второй половинке: девушка в Твиттере рассказала, что сделала для своего мужа сайт, где можно выбрать, что он хочет на ужин.
Интересно только, что за валюта такая «lisoin»
Как думаете, правда или опять не выдуманные истории из жизни для расширения портфолио и саморекламы?
#петпроект
Original post link: t.me/tproger_web/4582
Forwarded and filtered by @smartfeed_bot
Интересно только, что за валюта такая «lisoin»
Как думаете, правда или опять не выдуманные истории из жизни для расширения портфолио и саморекламы?
#петпроект
Original post link: t.me/tproger_web/4582
Forwarded and filtered by @smartfeed_bot
