Готовый Код | Frontend
Відкрити в Telegram
Здесь ты найдешь готовый код для фронтенд разработки
Показати більше
Сітка:794
Підписники
Немає даних24 години
Немає даних7 днів
Немає даних30 день
Архів дописів
Задача: Создайте макет страницы, который состоит из главного блока, содержащего два подблока: один занимает 2/3 ширины главного блока, а другой занимает 1/3. Оба подблока содержат несколько элементов, оформленных в виде карточек. Подблок слева выровнен по левому краю, а подблок справа выровнен по правому краю главного блока. Подблоки и карточки должны адаптивно изменять свою ширину и расположение в зависимости от размера экрана.
Джентельменский набор трушного фронтендера
Опытные Frontend-разработчики собрали самые востребованные и бесплатные каналы, без которых не обойдется ни один настоящий фронтендер.
Макеты для верстки — самый крупный канал с макетами для верстки. Первоисточник всех макетов в Telegram.
Полезная вËрстка — канал с готовыми решениями повседневных задач: слайдеры, анимация, навигация и т.д.
JavaScript заметки — образовательный канал с ежедневными практическими заметками по языку.
codepen.js — готовые коды: реализованные на css и js анимации, скрипты и интерфейсы. Оживи статичные макеты
Figma Start — каждый день выпускаем крутые макеты для верстки. Выбери самый интересный и удиви рекрутеров!
Развивайся с нами, ведь так проще!
Задача: Напиши функцию, которая принимает на вход массив чисел и возвращает новый массив, содержащий только уникальные числа из исходного массива.
У нас тут есть кстати канал с вакансиями для фронтов - захожу по будням и скидываю несколько вакансий - заходите
https://t.me/frontend_jobs_dh
ЗАДАЧА: ПРОВЕРКА НА ПРОСТОЕ ЧИСЛО
Уровень сложности: Средний
Условие: Напишите функцию
isPrime(number), которая принимает на вход положительное целое число number и проверяет, является ли оно простым числом. Функция должна возвращать true, если число простое, и false в противном случае.
Пример вызова функции: isPrime(7);
Ожидаемый результат: true
Решение - https://dev-house.online/zadacha-proverka-na-prostoe-chislo/Задача: «Реализация формы регистрации»
Условие:
Необходимо разработать и стилизовать форму регистрации для веб-приложения. Форма должна содержать поля для ввода имени, электронной почты, пароля и подтверждения пароля. Также необходимо добавить кнопку «Зарегистрироваться» для отправки данных формы на сервер.
Требования:
Все поля должны быть обязательными для заполнения.
Поле электронной почты должно иметь соответствующую валидацию (проверка наличия символа «@» и допустимых доменов).
Поле пароля должно иметь минимальную длину в 6 символов.
Поле подтверждения пароля должно точно совпадать с полем пароля.
При успешной отправке формы на сервер, пользователь должен получить уведомление о успешной регистрации.
Уровень сложности: Средний
Решение: https://developerhouse.ru/zadacha-realizacija-formy-registracii/
Напишите программу, которая принимает от пользователя число и выводит на экран все четные числа от 0 до введенного числа.
Привет! А у нас есть еще между прочим есть и канал с макетами😀
Фронтенд разработчик начинает свою карьеру с верстки, а иногда верстальщиком и продолжает работать)
В любом случае - для портфолио хотя бы парочку сайтов нужно сверстать (а в идеале и посадить на админку). Что бы было легче искать - подписывайся на наш канал, где мы публикуем различные макеты - подберешь себе по уровню сложности и вперед🔥
Задача: Напишите функцию, которая принимает массив чисел и возвращает новый массив, состоящий из пар чисел, сумма которых равна заданному числу.
Задача: Создание простого счетчика с использованием Vue.js
Ваша задача – создать простой счетчик, который позволяет увеличивать и уменьшать значение счетчика с использованием Vue.js. Счетчик должен отображать текущее значение и иметь кнопки для увеличения и уменьшения этого значения.
Привет, друзья! Сегодня я хочу поделиться с вами интересной задачкой на JavaScript. Это будет весело и увлекательно, обещаю!
Представьте себе, что у вас есть массив целых чисел. Ваша задача — найти сумму всех положительных чисел в этом массиве. Звучит просто, верно?
||Давайте начнем с написания функции, которая будет принимать массив в качестве аргумента и возвращать сумму положительных чисел. Вот как это можно сделать:
function sumOfPositiveNumbers (arr) {
let sum = 0;
for (let i = 0; i < arr.length; i++) {
if (arr[i] > 0) {
sum += arr[i];
}
}
return sum;
}
Здесь мы создали переменную `sum`, в которой будем накапливать сумму положительных чисел. Затем мы проходим по каждому элементу массива в цикле и проверяем, является ли текущий элемент положительным числом. Если да, то добавляем его к сумме.
Чтобы проверить работу нашей функции, создадим массив и вызовем функцию:
const numbers = [-5, 10, -3, 7, -8, 2];
const result = sumOfPositiveNumbers (numbers);
console.log (result);
В нашем случае сумма положительных чисел равна 19. Если вы запустите этот код, то должны увидеть 19 в консоли.||
Надеюсь, вам понравилась эта задача и вы успешно справились с ее решением! Желаю вам дальнейших успехов в изучении JavaScript и надеюсь на скорую встречу!
Задача: «Посчитай сумму четных чисел»
Условия: Напишите функцию sumEvenNumbers, которая принимает на вход массив чисел и возвращает сумму всех четных чисел из этого массива. Если в массиве нет четных чисел, функция должна возвращать 0.
Уровень сложности: Легкий
Решение: По кнопке ниже и не забудь поставить лайк)
Задача
Напишите функцию sumPairs(arr, sum), которая принимает массив чисел arr и число sum, и возвращает первую пару чисел из массива, которые в сумме дают значение sum. Если такой пары в массиве нет, функция должна вернуть null.
Примеры
sumPairs([4, 2, 10, 5, 1], 6); // [4, 2]
sumPairs([1, 2, 3, 4, 5], 10); // [5, 5]
sumPairs([1, 2, 3, 4, 5], 7); // [2, 5]
sumPairs([1, 2, 3, 4, 5], 6); // [1, 5]
sumPairs([1, 2, 3, 4, 5], 2); // null
Решение
Для решения этой задачи можно использовать алгоритм двух указателей (pointers). Создадим два указателя – left и right, которые будут указывать на начало и конец массива соответственно. Затем будем двигать указатели от начала и от конца массива к середине, проверяя сумму значений под указателями на каждой итерации, пока не найдем пару чисел, которые в сумме дают искомое значение sum. Если такой пары нет, вернем null.
Вот код решения:
function sumPairs(arr, sum) {
let left = 0;
let right = arr.length - 1;
while (left < right) {
const currentSum = arr[left] + arr[right];
if (currentSum === sum) {
return [arr[left], arr[right]];
} else if (currentSum < sum) {
left++;
} else {
right--;
}
}
return null;
}
Функция sumPairs принимает два аргумента – массив arr и число sum. Внутри функции создаются два указателя – left и right, которые указывают на начало и конец массива соответственно. Затем запускается цикл while, который выполняется до тех пор, пока указатели не встретятся (т.е. пока left меньше right). На каждой итерации цикла вычисляется текущая сумма чисел под указателями, и если она равна искомой сумме sum, возвращается массив с этими числами. Если текущая сумма меньше sum, значит нужно увеличить значение указателя left, чтобы увеличить сумму. Если текущая сумма больше sum, значит нужно уменьшить значение указателя right, чтобы уменьшить сумму. Если на всех итерациях цикла не была найдена пара чисел, которая в сумме даёт искомое значение sum, функция возвращает null.
Вызов sumPairs([4, 2, 10, 5, 1], 6) вернет [4, 2], а вызов sumPairs([1, 2, 3, 4, 5], 2) вернет null.
ЗАДАЧА: Поиск пересечений в двух массивах
Уровень сложности: Средний
Условие: Напишите функцию, которая принимает на вход два массива чисел и возвращает новый массив, состоящий из элементов, встречающихся в обоих массивах.
Решение:
function findIntersections(arr1, arr2) {
let intersections = [];
for (let i = 0; i < arr1.length; i++) {
for (let j = 0; j < arr2.length; j++) {
if (arr1[i] === arr2[j]) {
intersections.push(arr1[i]);
break;
}
}
}
return intersections;
}
// Тесты
console.log(findIntersections([1, 2, 3], [2, 3, 4])); // [2, 3]
console.log(findIntersections([2, 3, 4], [4, 5, 6])); // [4]
console.log(findIntersections([1, 2], [3, 4])); // []
Создаем функцию findIntersections, которая принимает два массива как аргументы. Создаем пустой массив intersections, который будет содержать пересечения. Затем вложенным циклом for перебираем элементы обоих массивов и, если элементы равны, добавляем их в массив intersections. Используем оператор break, чтобы остановить цикл, когда пересечение найдено.
Примеры тестов подтверждают корректность работы функции.
Веб-разработчики создают сайты и приложения — от простых лендингов до продвинутых маркетплейсов и стриминговых сервисов. Эти IT-специалисты разрабатывают frontend — видимую часть сайтов, и backend — внутреннюю логику, которая находится на сервере и скрыта от пользователей.
Регистрация на бесплатный мини-курс по веб-разработке: https://epic.st/Zet21
За 5 дней вы:
— узнаете, сколько зарабатывают веб-разработчики и как попасть в профессию с нуля;
— попробуете себя в одной из самых востребованных IT-специальностей, разберёте типовые задачи frontend- и backend-разработчиков;
— создадите свои первые проекты — сайт, приложение и сервис — и на практике убедитесь, что стать веб-разработчиком реально в любом возрасте, независимо от опыта и знаний.
Спикер — Даниил Пилипенко, основатель и директор центра подбора IT-специалистов SymbioWay. 19 лет работает в сфере Java и веб-разработки, руководит командами разработки в разных проектах.
Всех участников ждут подарки!
— Сертификат на скидку 10 000 рублей на любой курс.
— Доступ к изучению английского языка на год.
— Персональная карьерная консультация
Реклама. ЧОУ ДПО «Образовательные технологии «Скилбокс (Коробка навыков)», ИНН: 9704088880
🚀Ускорь работу своего компьютера с помощью этого 👉 канала
✔️ Уникальные секреты по настройке Windows
✔️ Лучшие сборки компьютеров на разный бюджет
✔️ Топовые подборки компьютерных комплектующих
✔️ Объяснения компьютерных терминов простыми словами
👉 Подпишись и начни разговаривать с айтишниками на их языке!
🚀 Взлетаем на новый уровень в JS разработке! 🚀
🔥 Хочешь стать великим JS разработчиком, но не знаешь, с чего начать? Тогда тебе обязательно нужна наша подборка бесплатных материалов! 🔥
📘 У нас ты найдешь:
✅ Полезные учебники и книги, чтобы освоить основы JavaScript;
✅ Видеокурсы от лучших специалистов, которые расскажут тебе о сложных концепциях на понятном языке;
✅ Практические задания для закрепления полученных знаний;
✅ Экспертные советы и лайфхаки от топовых разработчиков.
💡 Наша подборка поможет тебе продвинуться на пути к карьерному росту и достичь новых высот в JS разработке. 💻💼
😊 Просто перейди в нашего бота и нажми "Материалы Frontend". Не упускай свой шанс стать настоящим мастером JS разработки! 📥
#JSразработка #бесплатныематериалы #карьерныйрост
