WebDev+ | Веб-разработка
8.32K subscribers
504 photos
241 videos
10 files
700 links
Присоединяйтесь к нашему каналу и погрузитесь в мир веб-разработки

Связь: @devmangx
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
Эта платформа предлагает более 500 вопросов, разбитых на 20 категорий, включая такие темы, как Git, CSS, JavaScript, React и многое другое.

Все вопросы отсортированы по категориям и курируются пользователями.

Вопросы на английском, но это отличная возможность подтянуть язык

https://quizzes.madza.dev/

@WebDev_Plus
5💯2
Методы списков в Python

🔹append() — добавляет элемент в конец списка
🔹pop() — удаляет и возвращает элемент по заданному индексу
🔹insert() — вставляет элемент по заданному индексу
🔹remove() — удаляет первое вхождение элемента
🔹extend() — добавляет элементы одного списка в конец другого
🔹reverse() — разворачивает порядок элементов в списке
🔹index() — возвращает индекс первого вхождения значения
🔹count() — возвращает количество вхождений значения в список
🔹sort() — сортирует список по возрастанию

#шпаргалка

@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7🔥3
This media is not supported in your browser
VIEW IN TELEGRAM
Это просто мощнейший инструмент для CSS Grid

Генерируй любую сетку, какую только можешь вообразить — пара кликов, никакого ручного кода

Ссылка на тулзу: http://cssgridgenerator.io

#ресурсы

@WebDev_Plus
9👍3👏1
👩‍💻 12 Git команд, которые нужно знать

1. git init – инициализация нового Git-репозитория в текущем каталоге.

2. git add – добавление изменений в индекс (staging area).

3. git commit – фиксация проиндексированных изменений с комментарием.

4. git push – отправка локальных изменений в удалённый репозиторий.

5. git pull – получение изменений из удалённого репозитория и их слияние с локальной веткой.

6. git remote – добавление, просмотр или удаление удалённого репозитория.

7. git branch – вывод списка веток, создание новой ветки и переключение на неё.

8. git fetch – загрузка изменений из удалённого репозитория без их слияния.

9. git checkout – переключение на указанную ветку.

10. git merge – слияние указанной ветки с текущей.

11. git status – отображение текущего состояния репозитория и неподтверждённых изменений.

12. git reset – откат текущей ветки до указанного коммита.

#шпаргалка

@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
👍11🔥43
This media is not supported in your browser
VIEW IN TELEGRAM
CSS-лайфхак для создания «умных» теней:

• С помощью background: inherit наследуешь фон.
• Применяешь это к псевдоэлементу ::after.
• Добавляешь фильтр blur для размытия.
• Повышаешь насыщенность.
• Задаёшь отрицательный z-index и отправляешь элемент на задний план.

И получается вот так

@WebDev_Plus
👍145🔥2👨‍💻1
Классная подборка Python-скриптов, которые пригодятся в самых разных ситуациях. Тут есть всё, от простых примеров до реальных проектов:

🔹 krp/python-examples — базовые примеры для обучения. Простенько, но полезно.

🔹 geekcomputers/Python — сборник "всякого-разного", от полезных скриптов до мини-проектов

🔹 OmkarPathak/Python-Programs — алгоритмы, мини-игры и ООП

🔹 fnplus/Python-scripts-collection — целый склад прикольных скриптов для повседневных задач.

#ресурсы

@WebDev_Plus
Please open Telegram to view this post
VIEW IN TELEGRAM
2
BFEdev

Здесь собрано более 600 задач по JavaScript, React, TypeScript, CSS и даже системному дизайну

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

#ресурсы

@WebDev_Plus
6❤‍🔥1👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Firebase Studio

IDE прямо в браузере для вайб-кодинга. Пишешь на естественном языке, редактируешь код, деплоишь. По сути — бесплатный аналог Cursor

Попробовать можно здесь

#ресурсы

@WebDev_Plus
3🔥2🆒1
Совет по JavaScript

Юзай новый метод Object.groupBy() — группируй объекты по любому свойству в одну строку, без плясок с бубном

Поддерживается всеми современными браузерами

#советы

@WebDev_Plus
11👍2
Большая_шпаргалка_по _Python.pdf
203 KB
Шпаргалка-обучалка по Python на русском

Работа со словарями, операции над множествами, функции генераторы и очень мемный подраздел «Приручаем Python списки».

#шпаргалка

@WebDev_Plus
👍31
Media is too big
VIEW IN TELEGRAM
Uiverse

Почти 6000 готовых UI-компонентов в HTML/CSS, которые можно юзать в проектах или просто для вдохновения

https://uiverse.io/

#ресурсы

@WebDev_Plus
6🔥4
This media is not supported in your browser
VIEW IN TELEGRAM
Узнайте, как создать табы на сайты, используя только HTML и CSS

@WebDev_Plus
4🔥2👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Хочешь создавать ультра-плавные слайдеры для своих веб-проектов

Эта open-source библиотека поможет тебе легко и быстро сделать невероятно плавные и удобные для касания слайдеры

https://smooothy.vercel.app/

@WebDev_Plus
🔥71👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Настоящий кладезь для разработчиков

Этот сайт собирает шпаргалки по множеству языков программирования, фреймворков и технологий: от Python и JavaScript до Git и MySQL

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

Когда срочно нужно вспомнить синтаксис или команду — must-have: https://overapi.com/

#ресурсы

@WebDev_Plus
👍102
Совет по HTML

Чтобы автоматически обновлять HTML-страницу через заданный интервал времени, можно использовать тег <meta> с атрибутом http-equiv, установленным в значение "refresh".

Это позволяет указать количество секунд, через которое страница будет перезагружаться.

#советы

@WebDev_Plus
👍135
This media is not supported in your browser
VIEW IN TELEGRAM
Знали ли вы, что VSCode умеет открывать браузер?

И для этого не нужны костыли в виде расширений. Всё из коробки

Твой код и изменения в одном окне

#советы

@WebDev_Plus
27🔥11👍4
Отличный проект для ознакомления с фреймом Django — сервис для сокращения ссылок аля bit.ly.

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

Единственный минус — курс староват и пусть и минимальная часть данных, но всё же устарела. Правда, это всё ещё отличная обучалка для старта.

#ресурсы

@WebDev_Plus
👍21
This media is not supported in your browser
VIEW IN TELEGRAM
В CSS мы можем использовать accent-color для стилизации полей ввода

Браузеры, которые поддерживают accent-color, в настоящее время применяют его к следующим HTML элементам:

<input type="checkbox">
<input type="radio">
<input type="range">
<progress>


#советы

@WebDev_Plus
👍237🤡1
This media is not supported in your browser
VIEW IN TELEGRAM
Бесплатная и обширная библиотека React-компонентов с открытым исходным кодом.

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

https://www.prismane.io/

#ресурсы

@WebDev_Plus
👍54👏1🤡1
python_variables.pdf
794.2 KB
Небольшая, но очень полезная шпаргалка по типам переменных в Python.

Внутри: переменные и их правильные названия, операции, строки, списки, словари и методы.

#шпаргалка

@WebDev_Plus
6🤡1
Совет по JS

Используйте KeyboardEvent.getModifierState(), чтобы определить, включен ли Caps Lock.

#советы

@WebDev_Plus
15👍3🤡1