РусскийФокс и BootStrap

16.08.18

Разработка - Языки и среды

РусскийФокс вносит новый технологический подход в сайтостроение. Теперь вы можете ограничиться знанием Русского Фокса и не иметь знаний по HTML, CSS, JavaScript, PHP, чтоб создавать сайты.

Скачать файлы

Наименование Файл Версия Размер
РусскийФокс и BootStrap:
.rar 13,74Mb
1
.rar 13,74Mb 1 Скачать

Генерировать нужные коды в HTML-файл можно на Русском Фоксе, используя объект «BootStrap». Знания языков программирования для создания сайтов вам потребуются только, если вы захотите создать свои объекты на Русском Фоксе или дополнить существующие объекты.     

Объект «BootStrap» содержится в модуле bootstrap.fxp (см.вложение) и полностью написан на Русском Фоксе без применения Visual FoxPro 9 (предка Русского Фокса).

Объект «BootStrap» имеет один значимый метод СоздатьПроект(). После запуска этой функции создается файл index.html, содержащий HTML, CSS, JavaScript коды. Но перед тем, как запустить метод СоздатьПроект() следует присвоить свойству «Контейнер» массив с объектами для BootStrap.

Создание сайта теперь выглядит так:

ПРОЦЕДУРА Старт 
   ПодключитьМодуль("BootStrap")   // Подключаем модуль BootStrap
   Об = НовыйОбъект("BootStrap")    // Создаем объект BootStrap
   Об.ИмяПроекта = "УфЛи"          // Задаем заголовок и имя проекта ЛитКлуба г.Уфы
   Об.Заголовок = "УфЛи" 
   Сайт = НовыйОбъект("СайтУфЛи")           // Создаем объект нашего сайта
   Ф = НовыйОбъект("BootStrap_Функции")  // Создаем объект с функциями из модуля
   Г = НовыйОбъект("Генератор_CSS")                // функции для генерации CSS
   Об.Контейнер = Сайт.ПолучитьОбъекты(Ф,Г)   // Получаем список объектов 
   Об.СоздатьПроект()    //  Создаем HTML-файл
   Сообщить("index.html создан c помощью объекта BootStrap ")
КОНЕЦПРОЦЕДУРЫ

Каждый сайт удобно оформлять в виде единого объекта, типа "СайтУфЛи". В зависимости от того, какой объект мы подключим, такой файл HTML и будет создан. Десятки наших сайтов могут быть в одном каталоге и перекомпилироваться после усовершенствования объектов. Благодаря этому себестоимость сопровождения и обновления большого числа разработок снижается.

Мы подключаем объект "BootStrap_Функции", так как я рекомендую не создавать свободных функций, а создавать функции внутри объекта. Таким образом, для функций обеспечивается свое пространство имен, которое позволяет избежать проблемы с одинаковым названием функций в различных модулях. Мы можем создавать и переменные внутри объекта так же не беспокоясь о повторении в названии.

Существует объект "Генератор_CSS" для тех кому лень писать CSS-коды руками. Позже я расскажу, как им пользоваться. Свои CSS-коды теперь придется писать только, если вы желаете усовершенствовать объекты и создавать специфичное оформление.

Объект для вашего сайта на Русском Фоксе будет выглядеть так:

ОПРЕДЕЛИТЬ_ОБЪЕКТ СайтУфЛи КАК БАЗОВЫЙ_ОБЪЕКТ
    Каталог='Projects/UfLi/'
    
    ФУНКЦИЯ ПолучитьОбъекты(Ф,Г)
       Объекты = НовыйМассив(1)
          Объекты.Добавить(ЭТОТ_ОБЪЕКТ.Навигатор())  
          Объекты.Добавить(ЭТОТ_ОБЪЕКТ.АнонсКарусели(Г))  
          Объекты.Добавить(ЭТОТ_ОБЪЕКТ.Карусель())  
          ВОЗВРАТ Объекты    
    КОНЕЦФУНКЦИИ

    ФУНКЦИЯ Навигатор()
         Навигатор = НовыйОбъект("BootStrap_Навигатор")
        Меню = НовыйМассив(1)
          Меню.Добавить("|#|Главная|Актив|")  
          Меню.Добавить("|#|Пункт 1|Меню|/#/ПодМеню 1.1/#/ПодМеню 1.2/|")  
          Меню.Добавить("|#|Пункт 2|Меню|/#/ПодМеню 2.1/#/ПодМеню 2.2/#/ПодМеню 2.3/|")  
          Меню.Добавить("|#|Это демонстрационная страница|||")  
          Навигатор.ПунктыМеню = Меню
        Профиль = НовыйМассив(1)
          Профиль.Добавить("|#myModal|Установки|wrench|")    //    
          Профиль.Добавить("|#|РазделительМеню||")  
         Профиль.Добавить("|#|Выход|off|")  
         Навигатор.МенюПрофиля = Профиль
         Навигатор.Логотип = "RusFox/images/RusFox2.ico"
      ВОЗВРАТ Навигатор    
    КОНЕЦФУНКЦИИ

    ФУНКЦИЯ АнонсКарусели(Г)
      ЛПЕРЕМ КодCSS
      АнонсКарусели = НовыйОбъект("BootStrap_ЗаголовокСПараграфом")
      КодCSS = Г.ЦветФона("#777777")+Г.ЦветСимволов("#FFFFFF")+Г.СкруглитьУглы(10)+;
                                                                             Г.ТеньЭлемента(1,1,10,"rgba(0,0,0,0.5)")+Г.Отступ("2 4 6 7px")
      АнонсКарусели.ТекстCSS = Г.ВыдатьCSS(КодCSS)
      АнонсКарусели.Заголовок = '<br><br><br><br><h2><span class="'+Г.Имя+;
                                                                       '">. Литературный клуб города Уфы "УфЛи" .</span></h2>'
      АнонсКарусели.ТекстПараграфа = 'Просматривайте видео заседаний клуба.<br> Кратко о клубе'+;
        ' <details> Литературный клуб "УфЛи" создан в .... году <br></details><br>'
      ВОЗВРАТ АнонсКарусели    
    КОНЕЦФУНКЦИИ
    
    ФУНКЦИЯ Карусель()
      Карусель = НовыйОбъект("BootStrap_Карусель")
      Карусель.КаталогКартинок = ЭТОТ_ОБЪЕКТ.Каталог+'images/'
      СписокСлайдов = НовыйМассив(1)  //  слайд 725х310 | слайд 940х410 | слайд 1170х502 |  три размера jpg для разных экранов   
      СписокСлайдов.Добавить("|180530_УфЛи_m.jpg|180530_УфЛи_s.jpg|180530_УфЛи.jpg|<h5>30 мая 2018 г.</h5>"+;
                                                                     "<p>Смотреть <a href='https:/"+"/youtu.be/2CAbmfyVbZs'>видео</a></p>|")  
      СписокСлайдов.Добавить("|180516_УфЛи_m.jpg|180516_УфЛи_s.jpg|180516_УфЛи.jpg|<h5>16 мая 2018 г.</h5>"+;
                                                                "<p>Смотреть <a href='https:/"+"/youtu.be/2CAbmfyVbZs'>видео</a></p>|")  
      СписокСлайдов.Добавить("|180510_УфЛи_m.jpg|180510_УфЛи_s.jpg|180510_УфЛи.jpg|<h5>10 мая 2018 г.</h5>"+;
                                                               "<p>Смотреть <a href='https:/"+"/youtu.be/_z3T91XqeF0'>видео</a></p>|")  
      СписокСлайдов.Добавить("|180418_УфЛи_m.jpg|180418_УфЛи_s.jpg|180418_УфЛи.jpg|<h5>18 апреля 2018 г.</h5>"+;
                                                           "<p>Смотреть <a href='https:/"+"/youtu.be/0oMp2d1VD7A'>видео</a></p>|")  
      СписокСлайдов.Добавить("|180411_УфЛи_m.jpg|180411_УфЛи_s.jpg|180411_УфЛи.jpg|<h5>14 апреля 2018 г.</h5>"+;
                                                          "<p>Смотреть <a href='https:/"+"/youtu.be/uV0GIdUKZys'>видео</a></p>|")  
      СписокСлайдов.Добавить("|180404_УфЛи_m.jpg|180404_УфЛи_s.jpg|180404_УфЛи.jpg|<h5>04 апреля 2018 г.</h5>"+;
                                                           "<p>Смотреть <a href='https:/"+"/youtu.be/uV0GIdUKZys'>видео</a></p>|")  
      Карусель.СписокСлайдов = СписокСлайдов
      ВОЗВРАТ Карусель    
    КОНЕЦФУНКЦИИ
КОНЕЦ_ОПРЕДЕЛЕНИЯ_ОБЪЕКТА 

В методе ПолучитьОбъекты(Ф,Г) устанавливается порядок следования объектов в HTML-файле. Для примера приведено только три объекта.

Указатель Ф указывает на полезные функции модуля BootStrap. Указатель Г указывает на набор функций для генерации кода CSS.

Метод Навигатор() создает верхнее двухуровневое меню с логотипом, строкой поиска и командами «Мой профиль». Подробней о настройках данного объекта я расскажу в будущем, но и просто, глядя на код, можно понять что к чему.

Метод Карусель() создает адаптивную «карусель слайдов», у надписи под каждым фото есть ссылка на видео материал YouTube.

Из данного краткого объяснения у вас должно сложится представление о новом технологическом подходе используемом в создании сайтов на Русском Фоксе. Показано, как использовать готовые объекты, наполняя их своим содержимым. Более подробно см.в файлах во вложении.

Планирую в будущем скрестить BootStrap с Joomla, научив Русский Фокс создавать адаптивные шаблоны для Joomla. В свое время я это уже пробывал сделать (но правда без использования BootStrap) на OneScript. На Русском Фоксе реализовать это будет проще.

Видео по теме (в конце видео моя пародийная песня про программистов в моем исполнении)

РусскийФокс FoxPro bootstrap HTML CSS

См. также

Зачем нам 1С:Элемент

Мобильная разработка Языки и среды Бесплатно (free)

Flutter может быть использован с 1С:Предприятием для разработки кроссплатформенных мобильных приложений, обеспечивая единый интерфейс и функциональность на устройствах под управлением iOS и Android. Это позволяет создавать приложения с высокой производительностью благодаря использованию собственного движка рендеринга Flutter. Интеграция Flutter с 1С:Предприятием позволяет создавать мобильные приложения любого уровня сложности, интегрировать их в корпоративные информационные системы, а также реализовывать бизнес-логику

19.03.2024    6924    ROk_dev    56    

37

(Не) Строгая типизация 1С

Языки и среды Платформа 1С v8.3 Бесплатно (free)

Существует множество языков программирования, и каждый имеет свои особенности по работе с типами данных. Слабые, явные, динамические и другие... Но кто же здесь 1С и почему с приходом "строгой" типизации EDT 1С-программистам стоит задуматься над изменением своих привычек.

16.01.2024    4227    SeiOkami    21    

55

Простое приложение на Dart

Языки и среды Бесплатно (free)

Пример небольшого приложения, с которого можно начать изучать язык программирования Dart.

08.08.2023    3200    acvatoris    6    

13

Статический анализатор кода 1С на Си

Языки и среды Платформа 1С v8.3 Россия Бесплатно (free)

Написание статического анализатора для 1С традиционным способом на Си.

30.06.2023    2983    prohorp    15    

12

Сквозная задача на Исполнителе - часть первая (IMAP)

Языки и среды Абонемент ($m)

Поставили нам задачу - вынести на отдельный сервер функционал получения заказов от клиентов по электронной почте, парсинг полученных XLS в приемлемый вид и трансформация заказов в красивый JSON, понятный нашей учетной системе на 1С. Всю эту красоту желательно запустить в отдельном докер - контейнере, по возможности не тратя лицензии, поэтому отдельно стоящую конфигурацию на БСП отвергаем сразу. Можно было бы собрать всё на Apache Airflow или Apache NiFi, но решили попробовать реализовать всю логику без Open Source, будем делать свой ETL, с Исполнителем, который в версии 3.0 научился взаимодействовать с электронной почтой по IMAP. Начнем с середины - сначала напишем скрипты, а потом соберем их в рабочую конструкцию

1 стартмани

01.06.2023    1895    0    kembrik    2    

7

1С# - Расширяем код 1С кодом на C#

Языки и среды Инструментарий разработчика Платформа 1С v8.3 Конфигурации 1cv8 Абонемент ($m)

Вставки кода на C# внутри кода на 1С.

7 стартмани

07.04.2023    9288    4    SerVer1C    56    

43

Независимая разработка совместимых компонент на ORM 1С – миф или истина где-то в аннотациях Java?

Языки и среды Платформа 1С v8.3 Бесплатно (free)

При работе с 1С ORM (object relation mapping) все время преследует ощущение постоянного создания монолитного приложения — один раз привязался к какой либо сущности (например, справочник Контрагенты), и весь код заполнен ссылками на эту конкретную реализацию. Можно ли независимо разрабатывать в ORM совместимые между собой справочник «Контрагентов» и использующий его документ «Платежное поручение», но при этом избежать жестких зависимостей? Спасут ли нас микросервисы? Пример на аннотациях Java демонстрирует, как это возможно делать.

13.03.2023    1025    1CUnlimited    0    

2

xPath в 1С

Файловый обмен (TXT, XML, DBF), FTP Языки и среды Платформа 1С v8.3 Бесплатно (free)

Опыт работы методами языка xPath в 1С.

04.03.2023    4939    DemetrKlim    40    

46
Комментарии
В избранное Подписаться на ответы Сортировка: Древо развёрнутое
Свернуть все
1. blackhole321 1303 17.08.18 07:24 Сейчас в теме
Я правильно понимаю, что это программная генерация html страниц, а не динамическая генерация в процессе обработки http-запроса?
3. andreosh 103 17.08.18 09:18 Сейчас в теме
(1) Правильно. Это своего рода программный конструктор для которого вы можете создавать свои объекты. Постепенно он будет обрастать объектами для Bootstrap, затем для Joomla и т.д.
5. andreosh 103 17.08.18 09:30 Сейчас в теме
Русский Фокс удобнее, чем SASS. SASS же генерирует только CSS-файл. Аналогично, Русский Фокс можно научить генерировать не только HTML, но и CSS, PHP и JS. В данной статье показана только идея. Пока это перспективный лабораторный вариант технологии.
2. Infactum 315 17.08.18 08:39 Сейчас в теме
Глядя на код, русский фокс представляется как-то так:
4. andreosh 103 17.08.18 09:19 Сейчас в теме
(2) Похоже. Но все начинается с такого, затем развивается.
6. andreosh 103 17.08.18 09:57 Сейчас в теме
(2) Нет РусскийФокс пока такой
Прикрепленные файлы:
7. Steelvan 302 17.08.18 15:54 Сейчас в теме
При всем уважении к вашему труду, Вы выдаете желаемое за действительное.

Что бы написать

"180530_УфЛи_m.jpg|180530_УфЛи_s.jpg|180530_УфЛи.jpg|<h5>30 мая 2018 г.</h5>"+; "<p>Смотреть <a h re f='https:/"+"/you/tu.be/2CAbmf/yVbZs'>видео</a1></p>"

нужно, как минимум, знать html.

Второе, пока выучишь ваш синтаксис, сильно отличающийся от 1С, уже освоишь html и css.
Третье, как Вас правильно спросили, на 1С можно получить реальный сервер с динамическим созданием содержимого.
Fox-trot; +1 Ответить
8. andreosh 103 18.08.18 11:27 Сейчас в теме
(7) Как получать реальный сервер с динамическим созданием содержимого я расскажу позже, после внедрения технологии Ajax в РусскийФокс (создания нужных объектов и функций). Такую задачу я решал на OneScript (см.мои статьи). Теперь эти наработки перенесу в РусскийФокс. Так же понятно, что можно легко упростить и строковый синтаксис, создав функции, генерирующие строки по заданным параметрам для тех, кто даже простые теги в HTML не освоил. В целом технологически на Русском Фоксе я повторяю то, что делает SASS, Joomla, многие конструкторы сайтов и т.д. Они генерируют те же коды, но на своем языке. SASS намного более корявый язык, чем РусскийФокс, менее читабельный, более ограниченный, но содержит больше наработок и имеет большее число тех, кто привык к этому языку. HTML освоить легко - это просто язык разметки, а вот вжиться в CSS обычному программисту весьма сложно, да и читать чужой код на JavaScript нелегкая задача.
9. Fox-trot 156 18.08.18 19:13 Сейчас в теме
(8)
Такую задачу я решал на OneScript (см.мои статьи)

и количество скачиваний как показатель...
10. andreosh 103 18.08.18 20:25 Сейчас в теме
(9) К сожалению, это не показатель. Не всех же интересует данная тема. Просто я ищу тех, кого интересует. OneScript пока так же мало людей использует. А перспективный проект NodeJS годами был не востребован, пока его пиарить не начали. А Русский Фокс появился весной 2018 года и сразу пытается охватить множество разнообразных задач. Следующая статья будет о том, как свои объекты создавать для формирования сайтов. В этой области есть масса проектов, но мой подход наиболее удобный.
11. andreosh 103 18.08.18 20:27 Сейчас в теме
(9) Кстати, на видео указываю альтернативный адрес скачивания без стартмани
12. Fox-trot 156 18.08.18 21:34 Сейчас в теме
(11)выдержка из правил публикаций
2.2.7. Запрещается указывать другой источник для загрузки файлов из Публикации.

так что не советую
13. andreosh 103 19.08.18 05:40 Сейчас в теме
(12) Учту. Но в статье я другой источник не указываю (ссылку на него не делаю).
14. СергейКа 669 19.08.18 20:37 Сейчас в теме
(13) Как минимум упоминать об этом не надо было ))
В целом по публикации. Оно конечно интересно, но на текущий момент мало применимо.
Возможно было при более востребовано, если например добавить еще и 1С в конкретной задаче. Как вариант - создавать корпоративный портал напрямую из базы. А уж на чем это будет написано - вопрос десятый. Сейчас по сути есть только Битрикс со своим недообменом.
И по поводу кода:
Г.ЦветФона("#777777")+Г.ЦветСимволов("#FFFFFF")+Г.СкруглитьУглы(10)

Согласитесь, выглядит несколько ... гм.
Напрашиваются некоторые нехорошие аналогии.
В остальном посмотрим.
15. andreosh 103 19.08.18 21:50 Сейчас в теме
(14) Это эксперименты для тех, кому не хочется писать CSS. В следующей статье еще будет руссификация CSS. Все это к применению не обязательно. ЦветФона("#777777") читать приятней, чем "background-color: #777777". Лабораторные опыты над пользователями ;-) Но все это дело привычки. Вначале раздражает так же, как меня поначалу раздражал русский язык программирования в 1С, а потом, что это удобней.
16. СергейКа 669 19.08.18 21:54 Сейчас в теме
(15) Да нет, ЦветФона меня не раздражает, давно уж в 1С.
А вот Г.ЦветФона выглядит уже не так ))
17. grin_64 36 11.12.18 11:29 Сейчас в теме
18. andreosh 103 11.12.18 17:02 Сейчас в теме
(17)https://youtu.be/MoGElxtXeTA
Под каждым видео на Ютубе ссылка на очередной архив.
РФокс версии 3.00 https://f2h.io/2pkn5bk7rbsz
Оставьте свое сообщение