Материалы к статье [mobile] Переносим HTML интерфейс на 1С (https://infostart.ru/public/1319458/ ):
1) mobile1c_adapt_1c: https://yadi.sk/d/teOzmOwyRdHZcg
2) mobile1c_adapt_js: https://yadi.sk/d/kumZG_L3SxYFRQ
3) Видео со сравнением: https://youtu.be/66BHGBY73C0
4) Исходники верстки https://github.com/leobrn/mobile1c-adapt
5) Демо верстки https:https://leobrn.github.io/mobile1c-adapt/

Поддержите статью и бесплатный контент поставив плюс на сайте

#избранное

Всем привет. Подведем итоги опроса.

Начинаем с разработки списка задач(HTML/CSS/JS) с переносом на 1С (скоро выложу интерфейс).

После продолжим тему статьи "Переносим HTML интерфейс". Разработаем корзину, нашел интересный
пример (приложение Leroy Merlin). Нестандартный выбор количества, выбор доп.действий через доп.меню.
В учебном примере будет только корзина. Данные корзины будут заполняться при старте приложения.
Функционал:очистка корзины, выбор количества, доп.меню с доп действиями, оформление заказа.
При оформление заказа будет создаваться документ в МП 1С и очищаться корзина.

Всем хорошей пятницы!🍻 Спасибо, что подписались🙏

Всем привет! Как и обещал , показываю промежуточный результат https://youtu.be/NGWUmrthzjw.

Дайте, пожалуйста, обратную связь в комментариях по наработкам.

#верстка #javascript

Карта изучения JavaScript https://miro.com/app/board/o9J_lfZRBE8=/
Добавляйте в избранное ⭐️

По 1C: TODO. На этой неделе планируется перенос текущего функционала на 1С.
Как это будет выглядеть, увидим позже по результату.

Параллельно изучаю курс "JavaScript. Стань Senior Frontend Разработчиком" Владилена Минина. В нем разрабатывается упрощенный аналог excel.
Просмотрена половина курса, многое принято на заметку.
После просмотра были переписаны многие участки кода и менялась структура проекта 1C: TODO.

#избранное

Всем привет✋
Перенес текущий функционал на 1С.
Результат работы можете посмотреть в видео https://youtu.be/qa32y2XTNho

Дальше в планах реализовать ещё несколько интересных фишек для этого приложения.

Не забывайте, что у канала есть чат t.iss.one/ovmst_chat. Там выкладываю промежуточные результаты и пишу о проблемах с которыми сталкиваюсь.

#mobile1C

Практика. Перенос верстки на JavaScript.

После изучения статьи "[mobile] Переносим HTML интерфейс на 1С"
(https://infostart.ru/1c/articles/1319458/) рекомендую попрактиковаться.
Для этого предлагаю пройти воркшоп "Икеа" на JS, где готовую верстку перенесете на JS. Подходит для новичков.

Изучите на практике переменные, типы данных, операторы, условные конструкции, циклы, функции, DOM, event события мыши и браузера, fetch(get/post), localStorage, модульность (import/export), ES6

1️⃣ День 1. https://www.youtube.com/watch?v=VBuaryMyN9A&download=dm
Получение необходимы элементов со страницы. Реализация меню с категориями и подкатегориями.
Генерация header, footer и меню.
2️⃣ День 2. https://www.youtube.com/watch?v=xGiuH8nj0S0&feature=emb_logo&ab_channel=GloAcademy
Реализация модулей для удобства (import/export). Получение товаров с сервера:
по каталогам, поиск, корзина, лист желаний, один товар.
3️⃣ День 3. https://www.youtube.com/watch?v=qt6fVPPN6ic&download=dm&ab_channel=GloAcademy
Вывод актуального каталога и подкаталога. Отрисовка карточек товаров.
4️⃣ День 4. https://www.youtube.com/watch?v=xAEEfCKN3qs&t=1474s&ab_channel=GloAcademy
Продолжение 3 дня. Использование localStorage
5️⃣ День 5. https://www.youtube.com/watch?v=L4Qxu7xgxfw&t=700s&ab_channel=GloAcademy
Реализация корзины. Изменение количества, пересчет суммы. Отправка заказа.

Через неделю сделаю еще одну заключительную подборку по данной теме.

Лайфхак: устанавливайте скорость воспроизведения x2

#избранное

Хороший сайт про рефакторинг и паттерны https://refactoring.guru/ru.
Добавляйте в избранное ⭐️

Паттерны, которые упоминались в прошлом посте:
1) Состояние https://refactoring.guru/ru/design-patterns/state
2) Наблюдатель https://refactoring.guru/ru/design-patterns/observer

Видео по теме:
1) JavaScript Паттерны. Шаблоны проектирования. 17 Примеров https://youtu.be/YJVj4XNASDk
2) SOLID Принципы в JavaScript https://youtu.be/xq13wiqvcTc

Если данная тема пока сложная, вернитесь к посту https://t.iss.one/ovmst/63

#javascript

Где брать идеи для стилей?
Добавляйте в избранное ⭐️

В последнее время для этих целей я использую Ютуб. Достаточно вбить простые запросы: loader css, input css, form css и т.д. Помимо готового кода вы еще получаете практику создания элемента т.к. все видео сделаны в формате видеоурока. Стоит заметить, что самый "сок" нужно искать в англоязычных видео.
Примеры видео:
loader: https://www.youtube.com/watch?v=QLiZ5VrhA98&t=27s
input: https://www.youtube.com/watch?v=IxRJ8vplzAo&ab_channel=DevEd
responsive login & registration Form: https://www.youtube.com/watch?v=piG91X4sV2U&ab_channel=TrueCoder
Со временем вы будете находить каналы, которые специализируются на стилизации и у них есть отдельные плейлисты для каждого назначения.

Доп. сервисы:
1️⃣Красивые фотографии:
https://unsplash.com/
(преимущества данного сервиса, что есть возможность вывода рандомной картинки из колллекции https:/ source.unsplash.com/)
2️⃣SVG:
https://material.io/resources/icons/?style=baseline
https://fontawesome.com/ (в интернете можно найти бесплатный архив со всеми иконками)
3️⃣Юникод символы:
https://unicode-table.com/ru/
4️⃣PNG:
https://icons8.ru/
https://www.iconfinder.com/
5️⃣Красивые css градиенты:
https://cssgradient.io/gradient-backgrounds/
6️⃣Шрифты
https://transfonter.org/ (для конвертации)
https://google-webfonts-helper.herokuapp.com/fonts

#избранное

Всем привет. На следующей неделе покажу, что мне удалось реализовать для приложения 1С:Список.

А пока предлагаю посмотреть два видео:
1) Сегодня прошел интенсив во Владивостоке по Front-end (Докладчик Владилен Минин)
https://youtu.be/PB49rKBQKsw
2) Интервью с Владиленом "Владилен Минин – Как один JS разработчик меняет сферу образования и вдохновляет на разработку"
https://youtu.be/zeR7vNrNlGg

#избранное