Screenshot 2023-07-23 at 2.54.53 PM.png
3.7 KB
Количество репозиториев в моем Гитхабе. Люблю это число кстати
😁2
Tailwind UI не поддерживает Svelte
Пишу проект на SvelteKit и думаю, а зайду-ка я и воспользуюсь какими-нибудь секциями из библиотеки Tailwind, а вот фиг.
Но есть выход:
1. Flowbite. Есть как бесплатные, так и платные блоки;
2. Skeleton UI. Новая для меня библиотека, на первый взгляд понравилась, как-нибудь сделаю проект полностью на ней чтобы протестировать её в деле;
3. Daisy UI. Заявляют, что самая популярная библиотека компонентов для Tailwind CSS, но я ещё не пробовал её. Ознакомившись с информацией на главной странице, я впечатлён. Однозначно попробую в одном из проектов и расскажу вам своё мнение.
А вы предпочитаете использовать готовую UI библиотеку или писать свою?
UPD: Можно поставить перключать в HTML и тогда Tailwind UI блоки можно подтягивать и в Svelte. Так что всё отлично!
Пишу проект на SvelteKit и думаю, а зайду-ка я и воспользуюсь какими-нибудь секциями из библиотеки Tailwind, а вот фиг.
Но есть выход:
1. Flowbite. Есть как бесплатные, так и платные блоки;
2. Skeleton UI. Новая для меня библиотека, на первый взгляд понравилась, как-нибудь сделаю проект полностью на ней чтобы протестировать её в деле;
3. Daisy UI. Заявляют, что самая популярная библиотека компонентов для Tailwind CSS, но я ещё не пробовал её. Ознакомившись с информацией на главной странице, я впечатлён. Однозначно попробую в одном из проектов и расскажу вам своё мнение.
А вы предпочитаете использовать готовую UI библиотеку или писать свою?
UPD: Можно поставить перключать в HTML и тогда Tailwind UI блоки можно подтягивать и в Svelte. Так что всё отлично!
Shopify Editions Summer 2023
Шопифай каждые полгода выпускает подобные обновления, а точнее 100+ обновлений, про самые основные я сниму ролик, а пока можете ознакомиться с полным списком по ссылке выше
Шопифай каждые полгода выпускает подобные обновления, а точнее 100+ обновлений, про самые основные я сниму ролик, а пока можете ознакомиться с полным списком по ссылке выше
Shopify Editions | Summer ’23
Powering what’s possible in commerce with 100+ product updates for developers and businesses of all sizes
🔥6
Next.js Commerce 2.0
Next.js выпустили Commerce 2.0, обновленную версию шаблона для интернет-магазина, в обновление шаблон стал совместим с App раутингом, а ещё упростили архитектуру, улучшили скорость загрузки, и конечно же, Шопифай как CMS, обработка платежа и прочие прелести использования Шопифай в качестве бэкенда.
Ссылка на статью
Next.js выпустили Commerce 2.0, обновленную версию шаблона для интернет-магазина, в обновление шаблон стал совместим с App раутингом, а ещё упростили архитектуру, улучшили скорость загрузки, и конечно же, Шопифай как CMS, обработка платежа и прочие прелести использования Шопифай в качестве бэкенда.
Ссылка на статью
Vercel
Next.js Commerce: A headless Shopify ecommerce template built with the App Router
A high-performance ecommerce template, including support for BigCommerce, Medusa, Saleor, Shopify, and Swell.
👍3
Сегодня на Fiverr я получил свой первый 4-х звездночный отзыв от клиента. С почином меня 🙂
*тут должен был быть скрин, но у него плохое качество и он вообще маленький, а загружать большой и фотошопить все ники и суммы клиентов не хочется*
*тут должен был быть скрин, но у него плохое качество и он вообще маленький, а загружать большой и фотошопить все ники и суммы клиентов не хочется*
🎉5👍1
Тестирую новую услугу на фрилансе
Опубликовал новый гиг на Fiverr - оптимизация конверсии Шопифай магазина. Прежде чем её опубликовать я изучил:
1. Что такое конверсия;
2. Почему конверсия важна;
3. Как измерить текущую конверсию магазина;
4. Как её улучшить без плагинов (я не любитель устанавливать плагин на каждый пук).
Например, есть проблема: 40 пользователей добавляют товар в корзину, но заказ размещают только 5 человек, почему?
Для меня это вопрос как догма. На него нельзя сходу ответить, что причина в …
Нужно смотреть, что за сайт, как он сделан, какой продукт продается, быстро ли грузятся страницы и тд. Только после этого можно сделать какой-то вывод. И опять же, улучшение конверсии это не моментальный результат, нужно время прежде чем будет виден какой-то результат.
Сейчас появился клиент на эту услугу, собственно, поэтому я решил написать это сообщение. Через какое-то время я напишу апдейт по заказу и поделюсь своим опытом.
Хороших выходных!
Опубликовал новый гиг на Fiverr - оптимизация конверсии Шопифай магазина. Прежде чем её опубликовать я изучил:
1. Что такое конверсия;
2. Почему конверсия важна;
3. Как измерить текущую конверсию магазина;
4. Как её улучшить без плагинов (я не любитель устанавливать плагин на каждый пук).
Например, есть проблема: 40 пользователей добавляют товар в корзину, но заказ размещают только 5 человек, почему?
Для меня это вопрос как догма. На него нельзя сходу ответить, что причина в …
Нужно смотреть, что за сайт, как он сделан, какой продукт продается, быстро ли грузятся страницы и тд. Только после этого можно сделать какой-то вывод. И опять же, улучшение конверсии это не моментальный результат, нужно время прежде чем будет виден какой-то результат.
Сейчас появился клиент на эту услугу, собственно, поэтому я решил написать это сообщение. Через какое-то время я напишу апдейт по заказу и поделюсь своим опытом.
Хороших выходных!
👍3🔥2
Для тех кто досмотрел видео до момента, где я упоменял B2B
https://telegra.ph/Shopify-Summer-23---Novovvedenie-v-B2B-08-25
https://telegra.ph/Shopify-Summer-23---Novovvedenie-v-B2B-08-25
Telegraph
Shopify Summer '23 - Нововведения в B2B
Внимание!! Функция B2B доступна только для магазинов с планом Shopify Plus. Что такое B2B?
🔥2
Шопифай как всегда лучший. Что добавили в последнем крупном обновление? В новом видео я рассказал об основных обновлениях в Shopify Edition Summer 2023. Идём смотреть!
P.S. Да, я немного опоздал(на месяц), знаю
https://youtu.be/MlkQ4aIqefQ
P.S. Да, я немного опоздал(на месяц), знаю
https://youtu.be/MlkQ4aIqefQ
YouTube
SHOPIFY SUMMER EDITION '23. Sidekick, B2B, Polaris 12, Remix шаблон
Шопифай каждые полгода выпускает крупное обновление, в этом видео я рассказал про летнее обновление Shopify Edition Summer 2023.
Видео немного задержалось, оно должно было выйти в конце июля, но что-то пошло не так :)
🔗 Ресурсы
Открыть Шопифай магазин за…
Видео немного задержалось, оно должно было выйти в конце июля, но что-то пошло не так :)
🔗 Ресурсы
Открыть Шопифай магазин за…
🔥2🤩1
Tailwind + Shopify
Как-то я выучил Tailwind¹ и решил попробовать его в Shopify². Нужно было сверстать страницу пароля, это та самая страница куда вы попадаете если магазин находится под паролем. Получилось довольно неплохо и быстро, а я как раз использовал его из-за скорости, ну и навыки хотелось применить, конечно же, потому-что лучшее обучение это практика (хотя я и писал несколько пет-проектов³ на нём).
Почему я решил его выучить?
Всё чаще я стал замечать шаблоны, курсы, твиты на/про Tailwind и мне стало интересно, что же это такое и почему он такой популярный?
Как использовать Tailwind в Shopify?
Через CDN⁴. Всё точно также как если бы работали над вёрсткой сайта. Команда для подключения Tailwind в проект:
Конфиг
Если хотите добавить чего-то кастомного, тогда понадобится конфиг⁵. Его можно добавить вот таким образом:
Кастомные стили
А если хотите добавить кастомные стили и использовать классы в связке с sm, md, lg, xl, то тогда нужно добавить следующее:
Плагины
Ещё можно использовать плагины, которые могут быть достаточно полезны в некоторых случаях. В моём проекте я их не использовал так как особой нужды не было и размер бандла получился меньше, а это хорошо.
Tailwind пушка-бомба?
Сделав несколько проектов разной сложности Tailwind оставил довольно положительные эмоции, хотя когда я только начинал его учить он мне показался полной фигнёй.
Все команды взяты с официальной документации.
—————————
Пояснительная база, я не знаю нужна ли она, но мне кажется прикольно.
Tailwind CSS¹ — это утилитарный CSS-фреймворк для построения пользовательских интерфейсов. В отличие от других CSS-фреймворков, таких как Bootstrap или Foundation, которые предоставляют предварительно стилизованные компоненты, Tailwind предоставляет набор низкоуровневых утилитарных классов, которые позволяют создавать пользовательские дизайны без написания CSS.
Shopify² (не путать с Spotify) - это платформа для электронной коммерции, которая позволяет индивидуальным предпринимателям и компаниям создавать свои онлайн-магазины. Основанная в 2006 году, эта платформа стала одной из ведущих в индустрии благодаря своей простоте использования и множеству функций.
Пет-проект³ (от англ. "pet project") — это личный проект, который разработчик или группа разработчиков создают в свое свободное время, не связанное с их основной работой или обязанностями. Обычно такие проекты начинаются из-за личного интереса, страсти или желания научиться чему-то новому.
CDN⁴ (Content Delivery Network, или сеть доставки контента) — это распределенная система серверов, размещенных в различных географических точках мира, предназначенная для быстрой и надежной доставки веб-контента (например, изображений, стилей, JavaScript, видео и других ресурсов) конечным пользователям.
Конфиг⁵ — это сокращение от слова "конфигурация". В контексте информационных технологий и программирования конфигурация часто относится к настройкам, которые определяют, как будет работать определенное программное обеспечение, приложение или система.
Как-то я выучил Tailwind¹ и решил попробовать его в Shopify². Нужно было сверстать страницу пароля, это та самая страница куда вы попадаете если магазин находится под паролем. Получилось довольно неплохо и быстро, а я как раз использовал его из-за скорости, ну и навыки хотелось применить, конечно же, потому-что лучшее обучение это практика (хотя я и писал несколько пет-проектов³ на нём).
Почему я решил его выучить?
Всё чаще я стал замечать шаблоны, курсы, твиты на/про Tailwind и мне стало интересно, что же это такое и почему он такой популярный?
Как использовать Tailwind в Shopify?
Через CDN⁴. Всё точно также как если бы работали над вёрсткой сайта. Команда для подключения Tailwind в проект:
<script src="https://cdn.tailwindcss.com"></script>Конфиг
Если хотите добавить чего-то кастомного, тогда понадобится конфиг⁵. Его можно добавить вот таким образом:
<script>
tailwind.config = {
theme: {
extend: {
colors: {
clifford: '#da373d',
}
}
}
}
</script>
Кастомные стили
А если хотите добавить кастомные стили и использовать классы в связке с sm, md, lg, xl, то тогда нужно добавить следующее:
<style type="text/tailwindcss">
@layer utilities {
.content-auto {
content-visibility: auto;
}
}
</style>
Плагины
Ещё можно использовать плагины, которые могут быть достаточно полезны в некоторых случаях. В моём проекте я их не использовал так как особой нужды не было и размер бандла получился меньше, а это хорошо.
<script src="https://cdn.tailwindcss.com?plugins=forms,typography,aspect-ratio,line-clamp"></script>Tailwind пушка-бомба?
Сделав несколько проектов разной сложности Tailwind оставил довольно положительные эмоции, хотя когда я только начинал его учить он мне показался полной фигнёй.
Все команды взяты с официальной документации.
—————————
Пояснительная база, я не знаю нужна ли она, но мне кажется прикольно.
Tailwind CSS¹ — это утилитарный CSS-фреймворк для построения пользовательских интерфейсов. В отличие от других CSS-фреймворков, таких как Bootstrap или Foundation, которые предоставляют предварительно стилизованные компоненты, Tailwind предоставляет набор низкоуровневых утилитарных классов, которые позволяют создавать пользовательские дизайны без написания CSS.
Shopify² (не путать с Spotify) - это платформа для электронной коммерции, которая позволяет индивидуальным предпринимателям и компаниям создавать свои онлайн-магазины. Основанная в 2006 году, эта платформа стала одной из ведущих в индустрии благодаря своей простоте использования и множеству функций.
Пет-проект³ (от англ. "pet project") — это личный проект, который разработчик или группа разработчиков создают в свое свободное время, не связанное с их основной работой или обязанностями. Обычно такие проекты начинаются из-за личного интереса, страсти или желания научиться чему-то новому.
CDN⁴ (Content Delivery Network, или сеть доставки контента) — это распределенная система серверов, размещенных в различных географических точках мира, предназначенная для быстрой и надежной доставки веб-контента (например, изображений, стилей, JavaScript, видео и других ресурсов) конечным пользователям.
Конфиг⁵ — это сокращение от слова "конфигурация". В контексте информационных технологий и программирования конфигурация часто относится к настройкам, которые определяют, как будет работать определенное программное обеспечение, приложение или система.
🔥2👏1