Веб-страница
22.1K subscribers
2.17K photos
561 videos
2 files
4.45K links
Всё по фронтенду, бэкенду и девопсу в одном месте

Разместить рекламу: @tproger_sales_bot

Правила общения: https://tprg.ru/rules

Другие каналы: @tproger_channels

Сайт: https://tprg.ru/site

Регистрация в перечне РКН: https://tprg.ru/64ai
Download Telegram
Подборка актуальных вакансий

— Web-аналитик в Открытие
Где: Москва, можно удалённо
Опыт: от 2 лет

— PHP-разработчик в Гринатом
Где: удалённо
Опыт: от 2 лет

— PHP-разработчик в Гринатом
Где: удалённо
Опыт: от 3 лет

— Java-разработчик в Иннотех
Где: удалённо
Опыт: от 3 лет

— Java-разработчик в Открытие
Где: удалённо
Опыт: от 3 лет

— Тестировщик в Гринатом
Где: удалённо
Опыт: от 3 лет

— UX/UI-дизайнер в Гринатом
Где: удалённо
Опыт: от 3 лет

— Middle Golang-разработчик в МТС
Где: удалённо
Опыт: от 3 лет

— Senior Go-разработчик в МТС
Где: удалённо
Опыт: от 3 лет

#вакансии #работа
👎2🐳2👍1
Сразу тяжёлая артиллерия
😁19🤣5👎3👍1💩1
​Как преобразовать компоненты Figma в Next.js с помощью Tailwind CSS

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

В этой статье вы увидите простой автоматический способ преобразования конструкций Figma в Next.js-код с помощью Tailwind CSS:

https://blog.logrocket.com/convert-figma-components-next-js-tailwind-css/

#figma #css #nextjs #фронтенд
🤮8❤4👍3💩2🤡1
​MVP продукта: как внедрить фичу и не растерять пользователей?

MVP — это минимально жизнеспособный продукт. Его создают чтобы минимизировать потери, перед тем, как вывести новые фичи в продакшен. Благодаря ему можно проверить, понравятся ли изменения пользователям.

Как выглядит процесс проработки MVP продукта в крупных компаниях, рассказывают руководитель отдела продуктовой разработки Юрий Кочарян и руководитель группы продуктов для авторов Вера Советкина из Дзена: https://tprg.ru/HhuX

#аналитика
🤣4🤔1
​​Алгоритмы и структуры данных для начинающих

Уверенное применение структур данных и алгоритмов имеет важное значение при создании программ. Изучить основы поможет серия коротких видеоуроков с примерами на JavaScript. Например, что такое BinarySearchTree, LinkedList, Stack, Queue, их применение, а также другие структуры и алгоритмы:

https://youtube.com/playlist?list=PLIFGfLqvZ-yGHI2Fg0NCgi7FY0h1yh-af

#js #алгоритмы
👍5❤3
​​Кстати, у нас на сайте вы можете подписаться только на интересные вам теги и отслеживать самые свежие новости и полезные статьи по этой теме.

Вот, например:
— Веб-разработка: https://tproger.ru/tag/web/
— Нейросети: https://tproger.ru/tag/neural-network/
— И геймдев: https://tproger.ru/tag/gamedev/

А ещё можно подписаться на годноту по конкретному языку:
— Python: https://tproger.ru/tag/python/
— JavaScript: https://tproger.ru/tag/javascript/
— C++: https://tproger.ru/tag/cpp/

Посмотрите все теги и выберите только те, которые интересны вам!
❤7👍2💩1
​TailwindCSS vs. UnoCSS

TailwindCSS и UnoCSS — популярные CSS-фреймворки.

У Tailwind есть имена классов практически для каждой функции CSS, о которой вы могли подумать, включая некоторые полезные, о которых вы, возможно, не знаете, например isolation. В свою очередь, UnoCSS поддерживает весь Tailwind, плюс некоторые дополнительные возможности. Казалось бы, выбор очевиден. Но как бы не так!

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

https://dev.to/mapleleaf/tailwindcss-vs-unocss-2a53

#фронтенд #css #tailwind #unocss
🤮6🤡2👍1💩1
​История происхождения: Как небольшая команда разработчиков создала React.js на Facebook

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

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

https://youtu.be/8pDqJVdNa44

#видео #react
🔥6👍5
​Лучшие способы вызова API на JavaScript

При работе с JavaScript чрезвычайно важно знать, как посылать HTTP-запросы и получать динамические данные с сервера/базы данных. А делать это можно различными способами. Подробнее о них:

https://nuancesprog.ru/p/15597/

#api #javascript
👍9👎5😈1
​Что такое JSON и чем может быть полезен?

JSON или JavaScript Object Notation — текстовый формат обмена данными. И хотя JSON основан на JavaScript, он применяется и при работе с другими языками программирования. Корректные значения JSON — это:
— JSON-объект — неупорядоченное множество пар «ключ:значение», заключённое в фигурные скобки { };
— массив — упорядоченный набор значений, разделённых запятыми и находящийся внутри квадратных скобок [ ];
— число (целое или вещественное) или строка;
— литералы true, false и null.

Давайте на примерах разберёмся, чем JSON может быть полезен и как использовать его правильно: https://tproger.ru/articles/chto-takoe-json-vvedenie/
😁10👍6
​Webpack + CSS Modules + TS = Love

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

Вот только TypeScript по умолчанию с модулями CSS работать не умеет. Зато его можно легко обучить этому. Как это сделать, рассказали тут:

https://habr.com/ru/articles/688844/

#typescript #css #webpack
👎8🤡7
Ну не переделывать же всё
😁32❤‍🔥3💩3❤1👍1👎1
​5 классных стилей заголовков CSS с кроссбраузерной совместимостью

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

https://blog.logrocket.com/five-cool-css-header-styles-with-cross-browser-compatibility/

#css #фронтенд
👍1
​Индикатор прокрутки на чистом JS + SVG-анимация окружности

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

В этом видео автор показал, как реализовать такой элемент, а ещё как сделать аналогичный индикатор, но в форме кольца:

https://youtu.be/ScadOMC4Bko

#видео #фронтенд
👍9❤1
Подборка актуальных вакансий

— UX-дизайнер в Иннотех
Где: удалённо
Опыт: можно без опыта

— Web-аналитик в Открытие
Где: Москва, можно удалённо
Опыт: от 2 лет

— PHP-разработчик в Гринатом
Где: удалённо
Опыт: от 3 лет

— Java-разработчик в Иннотех
Где: удалённо
Опыт: от 3 лет

— Java IT Lead в Иннотех
Где: удалённо
Опыт: от 3 лет

— Тестировщик в Гринатом
Где: удалённо
Опыт: от 3 лет

— UX/UI-дизайнер в Гринатом
Где: удалённо
Опыт: от 3 лет

— Fullstack веб-разработчик в Иннотех
Где: удалённо
Опыт: от 3 лет

— Middle Golang-разработчик в МТС
Где: удалённо
Опыт: от 3 лет

— Senior Go-разработчик в МТС
Где: удалённо
Опыт: от 3 лет

#вакансии #работа
👎4👌2👍1😈1
​Объёмный курс по Next.js

В этом курсе вы за 2 часа узнаете, что такое рендеринг на стороне сервера, как работает генерация статического сайта и когда вам следует выбрать Next.js для вашего следующего проекта. А также, как настроить следующий проект и использовать возможности Next.js по максимуму:

https://youtu.be/uU80SSxn9_c

#видео #nextjs #бэкенд
👎6👍1
Актуальные вакансии для разработчиков от AFFINAGE

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

Сейчас в компании открыто две вакансии — Vue.js- и Laravel-разработчик:

1. Что ждут от Vue.js-разработчика:

— JavaScript, Vue/Nuxt, HTML/SCSS (кроссбраузерность, семантика, блочная модель, анимации, доступность, flexbox, grid и т.д.);
— опыт внедрения ESLint, Stylelint и автоматизации сборки (Webpack, Gulp);
— понимание принципов работы современных браузеров и серверов, протоколов HTTP и WebSocket, стека TCP/IP и RESTful веб-служб.

Доход от 180 000 ₽

2. Что ждут от Laravel-разработчика:

— уверенное знание PHP7+, MySQL, HTML/CSS;
— опыт работы с системами контроля версий (GIT), с командной строкой SSH, уверенное владение ООП и знание PSR 0-4;
— опыт написания собственных компонентов и умение работать с Legacy-кодом.

Доход от 120 000 ₽

Что предлагают:

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

Расскажите о себе и присылайте ваше резюме на почту: hr@affinage.ru или в телеграм HR @olya_evsyukova

#вакансии
👍2
This media is not supported in your browser
VIEW IN TELEGRAM
Дайджест Python #13: инструменты для Data Science и исполняемые файлы из скрипта

Свежий дайджест за первую половину июля уже у нас на сайте. Заходите и узнайте, как сделать из Python-скрипта исполняемый файл, какие инструменты использовать в Data Science и как настроить автопостинг в ВК:

https://tproger.ru/articles/dajdzhest-python-13-instrumenty-dlya-data-science-i-ispolnyaemye-fajly-iz-skripta/

#python #дайджест
​API_PATH или как фронтенд может узнать, где находится его бэкенд?

Существуют ситуации, когда разработчик не может знать точно, по какому URL будет запущено его web-приложение: например, когда его web-приложение встраивается в другое. В таком случае надо разбираться откуда будут браться данные и как получить к ним доступ.

Решить эту задачу можно несколькими способами. Подробнее о них в статье:

https://tprg.ru/rfGN

#фронтенд #бэкенд
🤔7👍4❤2
​Основы Websocket. Использование с react, redux, saga и RTK Query

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

Подробнее:

https://habr.com/ru/articles/727696/

#websocket
❤10👍8🍾1