CodeRoll | Web & Design
6.55K members
426 photos
23 videos
76 links
— IT инструменты, курсы и книги.
— Веб-разработка на JavaScript, HTML, CSS, React, Vue, Angular, jQuery.

Админ: @feedcoderollbot
Менеджеры: @code_dev, @my_little_trump

Наши каналы: @muddydev

IT Alliance: https://goo.su/1xQP
Download Telegram
to view and join the conversation
Полный курс Владилена Минина по VSCode для JS разработчиков.

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

#Курсы
GitKraken — это кроссплатформенный, удобный и высокоэффективный GUI git клиент на Linux, Windows и macOS. Он поддерживает GitHub, Bitbucket и Gitlab, и конечно же позволяет работать с корпоративными репозиториями с исходным кодом.

Основные особенности:
- Визуальное взаимодействие и подсказки;
- Поддержка нескольких профилей;
- Поддерживает кнопки отмены и повтора функции;
- Быстрый и интуитивно понятный интерфейс поиска;
- Легко адаптируется к рабочей области пользователя, а также поддерживает подмодули и Git-flow;
- Интегрируется с аккаунтами на GitHub или BitBucket;
- Горячие клавиши и многое другое.

#Инструменты
This media is not supported in your browser
VIEW IN TELEGRAM
Newsletter Subscribe - красивая реализация формы подписки с проверкой на корректность ввода электронной почты.

#HTML #CSS #JavaScript
BGJar - отличный инструмент для создания качественных SVG фонов для Вашего проекта.

#Графика #Инструменты
Что такое Web Sockets?

Web Sockets — это передовая технология, которая позволяет создавать интерактивное соединение между клиентом (браузером) и сервером для обмена сообщениями в режиме реального времени. Веб-сокеты, в отличие от HTTP, позволяют работать с двунаправленным потоком данных, что делает эту технологию совершенно уникальной.

Веб-сокеты можно использовать для:
- приложения реального времени;
- чат-приложения;
- IoT-приложения;
- многопользовательские игры.

Единственный минус их использования— это несовместимость с некоторыми браузерами, но уже 95 % браузеров поддерживают веб-сокеты.

#Статьи
🔥 Лучшее на канале за последнюю неделю

1) Animatron Studio - это веб-приложение, позволяющее легко создавать анимацию.
2) 3D Icons - современные объемные иконки в высоком разрешении.
3) Minireset.css - крошечный современный сброс CSS.
4) BGJar - отличный инструмент для создания качественных SVG фонов для Вашего проекта.
5) Полный курс по VSCode от Владилена Минина для JS разработчиков.

Всем успешной разработки!

#Лучшее
Основные команды GIT
Всего несколько команд нужно для базового варианта использования Git для ведения истории изменений.

git init
Используется для создания GIT репозитория

git add
Команда git add добавляет содержимое рабочей директории в индекс (staging area) для последующего коммита.

git commit –m “Сообщение идущее вместе с коммитом”
Используется для коммита изменений в файлах проекта.

git status 
Отображает список измененных файлов, вместе с файлами, которые еще не были добавлены в индекс или ожидают коммита.

git clone
Используется для клонирования репозитория. 

git push
Позволяет поместить изменения в главную ветку удаленного хранилища связанного с рабочим каталогом.

git pull
Используется для объединения изменений, присутствующих в удаленном репозитории, в локальный рабочий каталог.

git merge
Используется для объединения ветки в активную ветвь.

git checkout
Используется для создания веток или переключения между ними.

git branch
Используется для отображения, создания или удаления веток

#Статьи
This media is not supported in your browser
VIEW IN TELEGRAM
Light/Dark Mode Toggle - реализация переключения между светлой и темной темой c эффектом занавеса без применения JavaScript.

#html #css
Чат для вашего сайта NodeJS + WebSockets.

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

Особенности такого решения:
- максимально быстрая скорость отклика;
- минимум нагрузок на компьютер.

#Курсы
Выберите правильный ответ ниже. Вопрос от подписчика. Этот и другие вопросы по разработке можно всегда обсудить в нашем чате.
Heroicons - красивые SVG-иконки ручной работы,
создателями Tailwind CSS. Коллекция содержит 226 качественных иконок.

#Графика
WebDataRocks – это крутая онлайн-таблица, которая используется в любых проектах без каких-либо затрат. Построенная на чистом JavaScript, она плавно интегрируется во все популярные фреймворки.

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

#JavaScript
Docusaurus - инструмент с открытым исходным кодом от Facebook, предназначен для создания документации вашего проекта. Построенный с помощью React и Markdown, он дает вам возможность легко составлять документацию, поддерживать ее и даже создавать блог для вашего сайта и публиковать его на страницах Github.

#Инструменты
Расширение Beautify позволяет форматировать html-, js-, css-, JSON- и sass-код. Параметрами форматирования можно управлять. Это расширение является надстройкой над стандартной системой js-beautify и позволяет разработчику форматировать код именно так, как ему нужно.

#Расширения #vscode
📖 CSS для профи

Автор: Кит Грант
О книге: 2019 год, 496 страниц, Русский язык, 40.3Mb

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

#Книги
This media is not supported in your browser
VIEW IN TELEGRAM
Range input - красивая реализация ползунков для ваших фильтров на чистом CSS.

#html #css
Подборка курсов с Udemy, на которые сейчас проходят акции и в ограниченный срок Вы можете их забрать себе и изучать в дальнейшем!

1) Полный учебный курс для веб-разработчиков FullStack PHP 2020.
2) Курс разработчика веб-сайтов на Wordpress.
3) Оптимизация Wordpress 2020.
4) Полный курс Photoshop CC - от начального до среднего уровня.

#Курсы
AMP (Accelerated Mobile Pages) — технология отображения страниц сайта для мобильных пользователей, которая обеспечивает максимальную скорость загрузки сайта.

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

Ускоренные страницы состоят из HTML-разметки со специальными тегами и библиотеки JavaScript. Для создания AMP можно использовать ограниченный набор тегов и скриптов. Это уменьшает функциональность и внешнюю привлекательность страниц, но резко увеличивает скорость их загрузки. Также ускорению загрузки способствует предварительное кэширование.

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

#Статьи