Делаем свой чат-бот на основе ИИ
В этом туториале вы узнаете как создать с нуля собственного чат-бота на JavaScript с применением таких технологий как Node.js, Express, React, MongoDB и моделей от OpenAI: https://youtu.be/wrHTcjSZQ1Y
Автор подробно объясняет весь процесс разработки веб-приложения — от начальной настройки до развертывания рабочего чат-бота.
#курс #ии
В этом туториале вы узнаете как создать с нуля собственного чат-бота на JavaScript с применением таких технологий как Node.js, Express, React, MongoDB и моделей от OpenAI: https://youtu.be/wrHTcjSZQ1Y
Автор подробно объясняет весь процесс разработки веб-приложения — от начальной настройки до развертывания рабочего чат-бота.
#курс #ии
Что такое Webpack и как с ним работать: полный курс по Webpack
Обычно, при создании приложения на JavaScript, код разделяется на несколько частей (модулей). Затем в файле «index.html» необходимо указать ссылку на каждый скрипт. Но в процессе можно забыть какой-нибудь скрипт или расположить их в неправильном порядке — и приложение «посыпется».
Webpack — это сборщик модулей, которые решает эти проблемы. Он создает граф зависимостей и собирает модули приложения в бандл, на который может ссылаться файл «index.html». А ещё Webpack может преобразовать модули перед их добавлением в бандл, например: SASS/LESS в обычный CSS, или JavaScript в ES5 для старых браузеров.
Нашли подробный ролик длиной 3,5 часа, в котором вы:
— Изучите основы и реализуете полную конфигурацию Webpack.
— Настроите TypeScript, React, Babel.
— Научитесь работать со стилями и CSS modules.
— Рассмотрите большую часть возможностей Webpack 5.
— Реализуете монорепозиторий с микрофронтендом на основе workspaces и Module federation.
Делимся с вами: https://youtu.be/acAH2_YT6bs
#курс #webpack
Обычно, при создании приложения на JavaScript, код разделяется на несколько частей (модулей). Затем в файле «index.html» необходимо указать ссылку на каждый скрипт. Но в процессе можно забыть какой-нибудь скрипт или расположить их в неправильном порядке — и приложение «посыпется».
Webpack — это сборщик модулей, которые решает эти проблемы. Он создает граф зависимостей и собирает модули приложения в бандл, на который может ссылаться файл «index.html». А ещё Webpack может преобразовать модули перед их добавлением в бандл, например: SASS/LESS в обычный CSS, или JavaScript в ES5 для старых браузеров.
Нашли подробный ролик длиной 3,5 часа, в котором вы:
— Изучите основы и реализуете полную конфигурацию Webpack.
— Настроите TypeScript, React, Babel.
— Научитесь работать со стилями и CSS modules.
— Рассмотрите большую часть возможностей Webpack 5.
— Реализуете монорепозиторий с микрофронтендом на основе workspaces и Module federation.
Делимся с вами: https://youtu.be/acAH2_YT6bs
#курс #webpack
Как это 2023 подходит к концу, а холивара про PHP ещё не было? Исправляемся
Сколько лет идет разговор о том, что «PHP уже не тот», а 2007-й, когда он занимал топовые позиции, уже не вернуть. Но факт остаётся фактом: будучи лидером в былое время, PHP остаётся им и до сих пор.
И вот интересная статья, которая доказывает, что старый добрый PHP не только не сдаёт свои позиции под напором всё большего числа новых технологий, но и остаётся лучшим помощником разработчиков для создания огромного множества веб-проектов любой сложности: https://tproger.ru/articles/pochemu-php-sohranit-svoi-pozicii-kak-klyuchevoj-yazyk-dlya-bekenda-veb-prilozhenij-v-2024-godu
#php
Сколько лет идет разговор о том, что «PHP уже не тот», а 2007-й, когда он занимал топовые позиции, уже не вернуть. Но факт остаётся фактом: будучи лидером в былое время, PHP остаётся им и до сих пор.
И вот интересная статья, которая доказывает, что старый добрый PHP не только не сдаёт свои позиции под напором всё большего числа новых технологий, но и остаётся лучшим помощником разработчиков для создания огромного множества веб-проектов любой сложности: https://tproger.ru/articles/pochemu-php-sohranit-svoi-pozicii-kak-klyuchevoj-yazyk-dlya-bekenda-veb-prilozhenij-v-2024-godu
#php
Вышел Comentario 3.0.0: сервер комментариев с открытым исходным кодом
С помощью Comentario можно добавлять возможность комментирования к любым статическим страницам, вставив лишь пару HTML-тегов. Comentario написан на Go и Angular и использует БД PostgreSQL для хранения комментариев.
Подробнее: https://habr.com/ru/news/779012/
Исходники: https://gitlab.com/comentario/comentario
#инструменты
С помощью Comentario можно добавлять возможность комментирования к любым статическим страницам, вставив лишь пару HTML-тегов. Comentario написан на Go и Angular и использует БД PostgreSQL для хранения комментариев.
Подробнее: https://habr.com/ru/news/779012/
Исходники: https://gitlab.com/comentario/comentario
#инструменты
Почему разрабатывать продукты без тестировщика — плохая идея?
Качественное тестирование — неотъемлемая часть успешной разработки любых продуктов. К сожалению, некоторые недооценивают значимость этой профессии, считая QA-инженеров лишним звеном между продом и программистом.
Эта статья показывает ключевые преимущества наличия специалиста по тестированию в команде и его влияние на конечное качество продукта.
#тестирование
Качественное тестирование — неотъемлемая часть успешной разработки любых продуктов. К сожалению, некоторые недооценивают значимость этой профессии, считая QA-инженеров лишним звеном между продом и программистом.
Эта статья показывает ключевые преимущества наличия специалиста по тестированию в команде и его влияние на конечное качество продукта.
#тестирование
Вопросы с собеседований: что такое специфичность CSS-селекторов и как она работает?
Типы селекторов расположены по возрастанию специфичности:
— Селекторы типов элементов (например, h1) и псевдоэлементов (например, ::before).
— Селекторы классов (например, .example), селекторы атрибутов (например, [type="radio"]) и псевдоклассов (например, :hover)
— Селекторы идентификаторов (например, #example).
Универсальный селектор (*), комбинаторы (+, >, ~, ' ') и отрицающий псевдокласс (:not()) не влияют на специфичность. Но селекторы, объявленные внутри :not(), влияют.
Стили, обьявленные в элементе (например, style="font-weight:bold"), всегда переопределяют любые правила из внешних файлов стилей и, таким образом, их специфичность можно считать наивысшей.
Расчёт специфичности:
— тег и псевдоэлемент имеют специфичность 0001;
— класс, псевдокласс, атрибут — 0010;
— id имеет специфичность 0100;
— инлайновый стиль имеет приоритет 1000.
#основы #собеседование #css
Типы селекторов расположены по возрастанию специфичности:
— Селекторы типов элементов (например, h1) и псевдоэлементов (например, ::before).
— Селекторы классов (например, .example), селекторы атрибутов (например, [type="radio"]) и псевдоклассов (например, :hover)
— Селекторы идентификаторов (например, #example).
Универсальный селектор (*), комбинаторы (+, >, ~, ' ') и отрицающий псевдокласс (:not()) не влияют на специфичность. Но селекторы, объявленные внутри :not(), влияют.
Стили, обьявленные в элементе (например, style="font-weight:bold"), всегда переопределяют любые правила из внешних файлов стилей и, таким образом, их специфичность можно считать наивысшей.
Расчёт специфичности:
— тег и псевдоэлемент имеют специфичность 0001;
— класс, псевдокласс, атрибут — 0010;
— id имеет специфичность 0100;
— инлайновый стиль имеет приоритет 1000.
#основы #собеседование #css
Личный опыт: как дойти от пет-проекта до своего департамента
Сервис Доски — российская интерактивная онлайн-доски для совместной работы, которая входит в экосистему МТС Линк. Создатели в материале рассказали, как найти идею для проекта и выйти на рынок.
Если вам интересно, что помогло им вырасти из стартапа до коммерчески успешного продукта, и какие решения они принимали на пути, читайте статью.
#карьера #петпроект
Сервис Доски — российская интерактивная онлайн-доски для совместной работы, которая входит в экосистему МТС Линк. Создатели в материале рассказали, как найти идею для проекта и выйти на рынок.
Если вам интересно, что помогло им вырасти из стартапа до коммерчески успешного продукта, и какие решения они принимали на пути, читайте статью.
#карьера #петпроект
Google опубликовала итоги 2023 для CSS
Получился интересный обзор уникальных и долгожданных фич, появившихся в CSS в этом году. Там про архитектурные основы, работу с цветом, типографику, отзывчивую вёрстку и многое другое: https://developer.chrome.com/blog/css-wrapped-2023
#тренды #css
Получился интересный обзор уникальных и долгожданных фич, появившихся в CSS в этом году. Там про архитектурные основы, работу с цветом, типографику, отзывчивую вёрстку и многое другое: https://developer.chrome.com/blog/css-wrapped-2023
#тренды #css
Такого ужасного интерфейса вы ещё не видели
Вы же встречали неудобные формы для ввода данных на сайте? Тут в одной месте собрали целую коллекцию UX-адовых форм для ввода номера.
Забирайте к себе в проекты: https://fun.mishasaidov.com/badux/
#дизайн #ux
Вы же встречали неудобные формы для ввода данных на сайте? Тут в одной месте собрали целую коллекцию UX-адовых форм для ввода номера.
Забирайте к себе в проекты: https://fun.mishasaidov.com/badux/
#дизайн #ux
Видео, в котором обсуждают пачку популярных вопросов на собеседовании по фронтенду
HTML теги и атрибуты, prefers-reduced-motion, реализация отложенной загрузки изображений, объект Proxy и еще несколько тем: https://www.youtube.com/watch?v=zcF-CVtXSBI
Вообще неплохой канал по веб-разработке, а это уже 53 выпуск с разбором вопросов с собеседований. Из минусов — большинство из них доступны за донат. Но конкретно это видео и первые 6 выпусков — нет. Так что приятного просмотра :)
#основы #собеседование
HTML теги и атрибуты, prefers-reduced-motion, реализация отложенной загрузки изображений, объект Proxy и еще несколько тем: https://www.youtube.com/watch?v=zcF-CVtXSBI
Вообще неплохой канал по веб-разработке, а это уже 53 выпуск с разбором вопросов с собеседований. Из минусов — большинство из них доступны за донат. Но конкретно это видео и первые 6 выпусков — нет. Так что приятного просмотра :)
#основы #собеседование
Если не знали, у нас в самом разгаре батл языков программирования. И так вышло, что сейчас соревнуются PHP, JS и Ruby.
Дело за малым — проголосовать за лучший из них: https://tproger.ru/articles/chetvyortyj-raund-bitvy-yazykov-programmirovaniya-v-2023-godu
#javascript #php #ruby
Дело за малым — проголосовать за лучший из них: https://tproger.ru/articles/chetvyortyj-raund-bitvy-yazykov-programmirovaniya-v-2023-godu
#javascript #php #ruby
Какой браузер вы посоветуете использовать в 2024 году? Что лучше Edge или Opera? Firefox ещё жив? За каким проектом будущее, а какой окончательно умер?
#обсуждение
#обсуждение
Создаем чат в реальном времени с помощью React, Node, Socket.io и HarperDB
Фронтенд: React (фронтенд-фреймворк JavaScript для создания интерактивных приложений).
Бэкенд: Node и Express (Express — очень популярный фреймворк NodeJS, который помогает легко создавать API и бэкенды).
БД: HarperDB (платформа для работы с данными и приложениями, которая позволяет запрашивать данные с помощью SQL или NoSQL. HarperDB также имеет встроенный API, что избавляет нас от необходимости писать много кода для бэкенда).
Коммуникация в реальном времени: Socket.io.
Исходники: https://github.com/DoableDanny/Realtime-chat-app-with-rooms
Гайд с пояснениями: https://habr.com/ru/companies/otus/articles/778594/
#nodejs #react
Фронтенд: React (фронтенд-фреймворк JavaScript для создания интерактивных приложений).
Бэкенд: Node и Express (Express — очень популярный фреймворк NodeJS, который помогает легко создавать API и бэкенды).
БД: HarperDB (платформа для работы с данными и приложениями, которая позволяет запрашивать данные с помощью SQL или NoSQL. HarperDB также имеет встроенный API, что избавляет нас от необходимости писать много кода для бэкенда).
Коммуникация в реальном времени: Socket.io.
Исходники: https://github.com/DoableDanny/Realtime-chat-app-with-rooms
Гайд с пояснениями: https://habr.com/ru/companies/otus/articles/778594/
#nodejs #react
