⚡️ CSS Spinners. - 3 разных анимации загрузки для сайта.

https://codepen.io/timhilton/pen/ZEVzRgG

@javascriptv

🖥 𝗧𝗵𝗲 𝘀𝘁𝗮𝘁𝗲 𝗼𝗳 𝗼𝗽𝗲𝗻 𝘀𝗼𝘂𝗿𝗰𝗲 𝗶𝗻 𝟮𝟬𝟮𝟯 by GitHub

GitHub только что опубликовал свой последний отчет о состоянии открых проектов. Авторы отметили тренд на использование разработчиками технологий искусственного интеллекта и тренд на создание приложений на основе искусственного интеллекта.

Они выделили основные тенденции:

🔹 Разработчики все чаще используют генеративный ИИ: Все больше разработчиков работают с моделями OpenAI ( 92% ) и с моделями других ИИ-компаний; в 2023 году проекты генеративного ИИ с открытым исходным кодом входят в десятку самых популярных проектов по количеству контрибьюторов.

🔹 Наблюдается тренд на работу с облачными приложениями:
Развертывание облаков становится стандартом; резко возросло количество использования разработчиками Docker контейнеров, IaC и других облачных нативных технологий.

🔹 В 2023 году на GitHub было создано 98 млн новых проектов (за 2022 год - 85.7 млн, за 2021 - 61 млн, за 2020 - 60 млн). Общее число проектов достигло отметки в 420 млн (+27%), а число публично доступных репозиториев - 284 млн (+22%).

🔸 За год добавлено около 65 тысяч новых проектов, связанных с машинным обучением, это на 248% больше, чем в прошлом году. Число AI-проектов за год выросло на 148%.

🔸 Аудитория GitHub за год выросла на 20.2 млн пользователей (+26%) и теперь достигает 114 млн (в прошлом году было 20.5 млн, позапрошлом - 73 млн, три года назад - 56 млн). На первом месте по числу разработчиков находится США, на втором - Индия, на третьем - Китай, на четвёртом Бразилия, на пятом - Великобритания, на шестом - РФ, на седьмом Германия. К 2027 году Индия обгонит США как крупнейшее сообщество разработчиков на GitHub

🔸Javascript остается самым популярным язком. Второе место сохраняет за собой Python.Популярность TypeScript выросла на 37 %. и он вытеснил на четвёртое место язык Java. 5, 6 и 7 места удержали за собой языки С#, C++ и PHP. На восьмое место поднялся язык С, который вытеснил на девятое место Shell. Десятое место занял Go.

🔸 𝗥𝘂𝘀𝘁 растет быстрее всех остальных языков в этом году (рост на 40 % по сравнению с предыдущим годом).

🔸 𝟰.𝟯 миллиона открытых и приватных репозиториев используют 𝗗𝗼𝗰𝗸𝗲𝗿𝗳𝗶𝗹𝗲𝘀. Это является следcтвием роста использования Terraform и других облачных нативных технологий, который мы наблюдали в течение последних нескольких лет.

🔸 Сингапур занял первое место по количеству новых разработчиков на душу населения.

📌 Полный отчет
📌 Видео

ai_machinelearning_big_data

🖥 Раскрываем силу JavaScript: сокращение размера пакета NPM на 99%

Рассмотрим способы улучшения метрик в Lighthouse с 38% до 82% и сокращения FCP (First Contentful Paint, время первой отрисовки контента веб-страницы) с 5,7 до 1,0-1,7 секунды (речь пойдет о проектах с использованием Design System Package — пакета дизайн-системы).

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

Поскольку дизайн-система содержала все компоненты, был создан JavaScript-файл размером 13,6 МБ. Как вы понимаете, первоначальная загрузка пакета размером 13,6 МБ, даже при запуске одностраничного приложения, создает негативное впечатление о производительности и не радует пользователя.

Что мы предприняли?

📌 Читать

@javascriptv

✨Волшебство веб-разработки: создаем цифровую страну чудес

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

Что такое веб-разработка?
Веб-разработка — это процесс, напоминающий строительство дома. Только тут используются не кирпичи и раствор, а код, который создает сайты и веб-приложения. Это искусство и наука генерации онлайн-пространств, которыми мы пользуемся каждый день.

Компоненты веб-разработки
1. HTML (Hypertext Markup Language, язык гипертекстовой разметки)
Это фундамент цифрового дома. Он структурирует контент веб-страницы, определяя, что является заголовком, абзацем, изображением или ссылкой.

Пример:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My First Web Page</title>
</head>
<body>
<h1>Welcome to My Web Page</h1>
<p>This is a simple introduction to web development.</p>
<img src="hello.jpg" alt="Greetings Image">
<a href="https://example.com">Explore More</a>
</body>
</html>

2. CSS (Cascading Style Sheets, каскадные таблицы стилей)
Это краски и декор для дома. CSS стилизует HTML-элементы, придает веб-странице визуально привлекательный вид.

Пример:
body {
font-family: 'Arial', sans-serif;
background-color: #f0f0f0;
text-align: center;
}

h1 {
color: #333;
}

p {
color: #666;
}

img {
width: 300px;
border-radius: 10px;
}

3. JavaScript
Это электричество, оживляющее дом. JavaScript придает интерактивность, делает веб-страницу динамичной и отзывчивой.

Пример:
function greetUser() {
alert("Hello, dear visitor! Welcome to our webpage.");
}

Инструменты веб-разработки
🔵Редакторы кода. Для написания и организации кода используются такие редакторы, как Visual Studio Code, Sublime Text и Atom.
🔵Браузеры. Chrome, Firefox, Safari — это испытательные полигоны разработчика, отображающие код. Вы часто будете переключаться между ними для обеспечения совместимости.
🔵Система контроля версий (Git). Git помогает отслеживать изменения в коде и упрощает совместную работу и управление проектом.

Начало работы над первой веб-страницей
1. Создание папки. Создайте папку для проекта. Это похоже на подготовку строительной площадки.
2. Написание HTML. Откройте редактор кода и создайте HTML-файл. Добавьте в него основную структуру страницы.
3. Добавление CSS. Задействуйте для страницы стили, используя CSS. Экспериментируйте с цветами, шрифтами и макетами.
4. Внесение JavaScript (опционально). Если вам нужна интерактивность, добавьте в проект JavaScript.
5. Предварительный просмотр в браузере. Откройте HTML-файл в браузере, чтобы увидеть свое творение.

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

@javascriptv

🖥 Build LLM Apps with LangChain.js

GitHub недавно сообщили, что JavaScript снова стал самым популярным языком программирования в мире. Чтобы поддержать веб-разработчиков, изучающих и разрабатывающих генеративный ИИ, deeplearning_ai только что запустили новый краткий курс по JavaScript.

В курсе Build LLM Apps with LangChain.js вы познакомитесь с элементами, характерными для разработки ИИ, включая:

(i) использование парсеров данных для получения данных из распространенных источников
(ii) промпты, которые используются для создания контекста LLM
(iii) Модули для поддержки RAG, такие как разделители текста и интеграция с векторными хранилищами
(iv) Работа с различными моделями для написания ИИ-приложений
(v) парсеры, которые извлекают и форматируют выходные данные для обработки последующим кодом.

Вы также будете работать с языком LangChain, который позволяет легко составлять последовательности (также называемые цепочками) модулей для выполнения сложных задач с помощью LLM.

Собрав все это воедино, вы поработаете над разговорным LLM-приложением для ответов на вопросы, способным использовать внешние данные в качестве контекста.

📌 Курс

@javascriptv

⚡️ Metrognome - Гном-метроном, реализованный с помощью CSS и библиотеки GSAP.js.

https://codepen.io/hexagoncircle/pen/JjOaabp

@react_tg

🖥 Loading — красивая загрузка в виде анимированного шара. Реализована с помощью CSS и JavaScript

#анимация #css #javascript

https://codepen.io/ma77os/pen/JjMRmLP

@javascriptv