1 сентября

Для кого-то День Знаний, а для кого-то первый день осени. В месте где я живу, осень не ощущается(температура почти как летом), и в школу я давно не хожу. Поэтому для меня это обычный день.

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

Как конвертировать HTML в Liquid?

Когда идёт разработка кастомной Shopify темы, лично я, сначала верстаю сайт по дизайну. На выходе получается обычный HTML с CSS и JS. Но в итоге нужно получить Liquid код.

Давайте я вам расскажу про инструменты, которые помогут быстрее конвертировать HTML код в Liquid.

1️⃣ HTML to Liquid Converter Tool. Самый популярный и единственный инструмент для конвертации HTML в Liquid. Я им пользовался какое-то время, но он не умеет работать с блоками и сложными секциями и уже немного устарел.

2️⃣ HTML to Liquid Converter Tool by moek. Это моя версия конвертера (а вы думали куда я пропал не пару недель), как я его вижу и именно тот, которым бы пользовался сам (и пользуюсь). Там есть некоторые спорные функции, например, предпросмотр результата, вообще дмаю его убрать.

Инструмент в ранней бета-версии и работает не на 100% как хотелось бы, там куча багов, как визуальных, так и логических. Ранняя бета, как-никак.

Постарался сделать как можно просто и удобно, но мог в некоторых местах перемудрить, это нормально, потому-что я смотрю на приложения со стороны разработчика.
На самом деле не думал его делать публичным, изначально разработал для себя, но мало ли будет полезно и вам, или вашим друзьям/знакомым.

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

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

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

Оставить обратную связь вы можете прямо под этим постом в комментариях, либо мне в личные сообщения, тут уже как вам будет удобно.

С Днём Программиста!

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

Хотя кого я обманываю, я с вами, ребята 🙂

Помните я говорил про моё трудоустройство в компанию?

Так вот, никуда я не устроился. Поэтому, если у вас есть проект на заметку по разработке сайта, веб-приложения, дизайна Шопифай темы, разработке интернет-магазина — пишите.

Кстати, скоро обновится мой личный сайт devmoek.com и там появятся новые работы из портфолио.

Для кого разрабатываются дизайны сайтов? Или боль одного разработчика по имени Майкл. Часть 1

Как вы знаете, я разработчик. Создаю сайты, веб-приложения, интернет-магазины и очень часто работаю с разными дизайнерами. Но так получилось, что дизайнеры с которыми я работал (не все), создают дизайны на “скорую руку”. Это означает, что вместо названия секции “Hero”, в дизайне “Rectangle 3827”, вместо “Header”, снова “Rectangle 21398”. Я думаю вы поняли суть и продолжать дальше не нужно.

Почему я такое не люблю?
Всё просто — неудобно работать.

Я сам создавал дизайны какое-то время назад, для меня не было проблем потратить какое-то количество времени чтобы сделать человеский нейминг, разбить дизайн по страницам, чтобы все не лежало на одной странице.

Дизайн в первую очередь создаётся для пользователя, потом для разработчика, чтобы ему было удобно переносить его в код, но никак ни для клиента. Клиент лишь видит картинку. Даже если ваш дизайн будет состоять только из картинок, клиент может его принять. А что потом делать разработчику? Я кстати такое тоже встречал, это кошмар.

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

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

Я вернулся!

Две болезни подряд, а потом отпуск. Теперь с новыми силами врываюсь обратно к статьям, каналам, и прочему контенту который создаю.

Что планируется?
1. В миллионный раз пытаюсь снимать хотя бы по одному видео в неделю, пока не получается (уже 3 года);
2. Закончить локализацию на сайте devmoek.com;
3. Много работы, куда же без этого.

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

НОВОЕ ВИДЕО — КАК КОНВЕРТИРОВАТЬ HTML в Liquid код

https://youtu.be/UFmkXwZt_Zg?si=1doIQDwc5rBsxv5B

Смотрим, комментируем, делимся ❤️

Может пора заняться каналом серьёзно?

React 19 & Next.js 15 & Typescript & Framer Motion. Или кортко о том как я деплоил проект (почти в пятницу).

В новой версии React (19), Typescript начал жаловаться на типы в тэгах Framer Motion. Возможно, это было и до обновления на новые версии Реакта и Некста, но я заметил после обновления.

Что я сделал?
Создал отдельный компонент с объявлением Framer Motion тэгов для Typescript. Пока работает, вот как это выглядит:

import { motion, type MotionProps } from 'framer-motion'

type MotionDivProps = MotionProps & React.HTMLAttributes<HTMLDivElement>

export const MotionDiv = motion.div as React.FC<MotionDivProps>

Всем хорошей разработки! И помните, что скоро пятница, а это значит время готовить проекты к деплою.

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

Это мои слова когда-то давно. И пам-парам. Мой сайт devmoek.com теперь имеет два языка. Вроде бы я всё потестил и все пути работают корректно.

Поэтому теперь его ссылки devmoek.com/en и devmoek.com/ru. Сейчас надо ещё пошуршать с SEO, а то все пути до этого вели на devmoek.com и поисковые роботы сейчас вообще ни черта не поймут куда делся сайт и почему стало так много вложений. Но это исправимо :)

Наконец-то у меня появился Sidekick в Shopify.

Видео про него я выпускал больше года назад 🤯

Одно из лучших качеств фрилансера — общение

ℹ️ Многие думают, что самое главное в исполнителе это навыки. Безусловно, работая на коммерческих проектах нужно обладать хорошим пониманием, что вы делаете. Но важнейшую роль играет то, как вы общаетесь с клиентом.

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

❗️Важно не просто слушать, но и слышать. Покажите клиенту, что вы на одной волне, уточняйте, переспрашивайте, если что-то неясно. Это избавит от недоразумений в процессе работы и сэкономит время.

🧘 А еще не забывайте про тон общения. Будьте вежливы, уважительны и позитивны. Даже в сложных ситуациях старайтесь сохранять спокойствие и профессионализм. Ведь зачастую клиенты возвращаются не только из-за качества работы, но и из-за приятного взаимодействия. Если вы не успели сдать работу в срок, объясните клиенту ситуацию, только честно. С большой вероятностью он войдёт в положение.

💪 Навыки можно прокачать, но если вы не умеете общаться, то даже с крутым портфолио работать будет сложнее. Помните, что вы продаёте не только свои услуги, но и себя как надежного партнера.

Резюмируя вышесказанное:
1. Общайтесь вежливо и с позитивом;
2. Задавайте много вопросов, проявляйте заинтересованность к проекту;
3. Не обманывайте, если произошёл косяк — признавайте ошибку и двигайтесь дальше;
4. Фриланс это про выстраивание долгосрочных отношений с клиентом, а не про прибыль в моменте.

Данный пост вляется личным мнением автора, если вы не согласны, можете написать ваше мнение в комментариях

Фриланс без площадок: Полное руководство

Что вы думаете, когда слышите про фриланс? Переработки, отсутствие выходных и непостоянная занятость? А ещё площадки и где именно искать клиентов?

Фриланс — это не просто работа вне офиса, это стиль жизни. Многие начинающие фрилансеры выбирают специализированные платформы (Upwork, Fiverr, FL.ru и т.д.) для поиска клиентов. Но что, если отказаться от этих площадок?

Фриланс без площадок — это модель работы, где вы находите клиентов напрямую, минуя посредников. Весь процесс, от поиска заказов до выставления счетов, фрилансер организует самостоятельно.

Читать далее

С Новым Годом, ребята! 🥳