All Projects → regiomedia → Bitrix Project

regiomedia / Bitrix Project

Заготовка 1C Bitrix проекта: автозагрузка, композер, базовые ООП компоненты, миграции, модели, современный фронтенд стек, инструменты для деплоя.

Projects that are alternatives of or similar to Bitrix Project

Nodefony Starter
Nodefony Starter Node.js Framework
Stars: ✭ 95 (-54.11%)
Mutual labels:  webpack, twig
React Redux Starter
A basic template that consists of the essential elements that are required to start building a Single Page Application using React, React Router, Redux, Bootstrap 4, Sass, and Webpack
Stars: ✭ 116 (-43.96%)
Mutual labels:  webpack, scss
Wordless
All the power of Pug, Sass, Coffeescript and WebPack in your WordPress theme. Stop writing themes like it's 1998.
Stars: ✭ 1,374 (+563.77%)
Mutual labels:  webpack, scss
Vue2.0 Multi Page
基于vue-cli(vue2.X,webpack1.X,es6,sass环境)多页面开发
Stars: ✭ 206 (-0.48%)
Mutual labels:  webpack, scss
Imall
基于Laravel5.2,Vue.js1.0的微信商城,用于熟悉 Laravel、Vuejs、Webpack、Gulp 的结合使用,已不维护及更新。(1MB单核基础服务器,浏览请耐心等待图片加载...)
Stars: ✭ 168 (-18.84%)
Mutual labels:  webpack, composer
React Atomic Structure
Basic Structure for React app following Atomic Design
Stars: ✭ 89 (-57%)
Mutual labels:  webpack, scss
Sass Vars Loader
Use Sass variables defined in Webpack config or in external Javascript or JSON files
Stars: ✭ 112 (-45.89%)
Mutual labels:  webpack, scss
Coyote
4programmers.net
Stars: ✭ 61 (-70.53%)
Mutual labels:  webpack, twig
Twigcs
The missing checkstyle for twig!
Stars: ✭ 166 (-19.81%)
Mutual labels:  twig, composer
Base Camp
Awesome WordPress starter theme for developers based on modern web technologies.
Stars: ✭ 135 (-34.78%)
Mutual labels:  webpack, composer
Html Compress Twig
Twig extension for compressing HTML and inline CSS/JS using WyriHaximus/HtmlCompress
Stars: ✭ 72 (-65.22%)
Mutual labels:  twig, composer
Bolt
The Bolt Design System provides robust Twig and Web Component-powered UI components, reusable visual styles, and powerful tooling to help developers, designers, and content authors build, maintain, and scale best of class digital experiences.
Stars: ✭ 186 (-10.14%)
Mutual labels:  webpack, twig
Ifme
Free, open source mental health communication web app to share experiences with loved ones
Stars: ✭ 1,147 (+454.11%)
Mutual labels:  webpack, scss
Katatema
A handy static site generator using React.js
Stars: ✭ 95 (-54.11%)
Mutual labels:  webpack, scss
Generator Kittn
The Yeoman Kittn Generator
Stars: ✭ 63 (-69.57%)
Mutual labels:  webpack, twig
React Starter
A basic template that consists of the essential elements that are required to start building a React (v16.3) application using Webpack (v4)
Stars: ✭ 108 (-47.83%)
Mutual labels:  webpack, scss
Tris Webpack Boilerplate
A Webpack boilerplate for static websites that has all the necessary modern tools and optimizations built-in. Score a perfect 10/10 on performance.
Stars: ✭ 1,016 (+390.82%)
Mutual labels:  webpack, scss
Generator Baukasten
Awesome!
Stars: ✭ 50 (-75.85%)
Mutual labels:  twig, scss
Frasco
Quick starter for Jekyll including full setup for Sass, PostCSS, Autoprefixer, stylelint, Webpack, ESLint, imagemin, Browsersync, etc.
Stars: ✭ 123 (-40.58%)
Mutual labels:  webpack, scss
Sass Extract
Extract structured variables from sass files
Stars: ✭ 183 (-11.59%)
Mutual labels:  webpack, scss

Bitrix Project

Заготовка для 1C Bitrix проектов.

Создание нового проекта

Стандартно установить или развернуть из бекапа копию Битрикса.

Клонировать репозиторий (за пределами публичной директории веб-сервера).

Переинициализировать репозиторий: удалить директорию .git и выполнить git init.

Установить зависимости и "собрать" фронтенд:

composer install && npm install && npm run encore -- dev

Перенести в корень клонированного проекта содержимое директорий bitrix, upload и local (не затирая файл local/php_interface/init.php).

В директорию sites/s1 перенести публичные файлы сайта.

Настроить вебсервер для работы с директорией sites/s1 либо сделать симлинк вида

/home/bitrix/www -> /home/bitrix/projectname/sites/s1

Создать файл .env

touch .env

Заполнить его данными в соответствии с файлом-образцом .env.example

Выполнить команду

./vendor/bin/jedi env:init default

Эта команда скопирует в директорию bitrix системные файлы настроек сконфигурированные для работы с переменными окружения, а также настройки шаблонизатора Twig и логгера Monolog

Установить модуль миграций

php migrator install

Доустановить модуль Базовых Битрикс компонентов. в административном интефейсе:

Marketplace > Установленные решения > ББК (bex.bbc)

Бэкенд

Composer и PSR-4 автозагрузка классов из директории local/classes. Пространство имен \Local\

Используемые пакеты:

Контроль качества

Для проверки пхп-кода используется squizlabs/PHP_CodeSniffer.

Код проверятся в соответствии с набором правил, описанных в файле ruleset.xml.

На данный момент, это стандарт PSR-2 (рус./англ.), а также наличие PHPDoc-комментариев.

Проверяются файлы из директорий local/classes и local/components (за исключением файлов template.php)

Проверка осуществляется командой (это запуск утилиты phpcs с предустановленными параметрами)

composer run lint:php

Также есть возможность исправить часть обнаруженных ошибок утилитой phpcbf

composer run fix:php

Фронтенд

В качестве "сборщика" изпользуется symfony/webpack-encore.

По-умолчанию файлы фронтенда должны располагаться в директории local/assets.

Это можно переопределить в файле конфигурации webpack.config.js

Основные команды:

npm run encore -- dev          # запустить сборку один раз
npm run encore -- dev --watch  # запустить сборку в режиме слежения за файлами
npm run encore -- production   # запустить сборку для продакшена

Технологии

Vue

Мини-модуль vueInvoker предназначен для инициализации Vue компонентов на странице. Он упрощает использование Vueклассическом веб-приложении, когда нет возможности использовать один "корневой" экземпляр Vue (Как, например, это устроено в одностраничных приложениях).

Использование:

Вывести на страницу элемент-плейсхолдер для компонента:

<div class="vue-component" data-component="DemoApp" data-initial='{"test": "data"}'></div>

Создать соответствущий Vue-компонент (в директории local/assets/scripts/vue/components/:

<template>
    <div class="demo-app">
        {{ hello }}

        {{ initial.test }}

    </div>
</template>

<script>
    export default {
      data() {
        return {
          hello: 'World',
        };
      },
      props: ['initial'],
    };
</script>

Добавить его в Коллекцию local/assets/scripts/vue/collection.js:

import DemoApp from './components/DemoApp.vue';

export default {
  DemoApp,
};

Контроль качества

JS-файлы проверяются на соответствие стандарту airbnb утилитой ESLint. Конфигурация линтера - файл .eslintrc

npm run lint:scripts  # показать ошибки
npm run fix:scripts   # исправить ошибки

SCSS-файлы проверяются утилитой stylelint. Основа - набор правил sass-guidelines. Конфигурация - файл .stylelintrc

npm run lint:styles  # показать ошибки
npm run fix:styles   # исправить ошибки

За исправление стилевых файлов отвечает пакет stylefmt

Многосайтовость

Структура проекта напоминает заранее настроенную многосайтовость на разных доменах с отдельными директориями для каждого сайта. Файлы ядра подключаются относительными символическими ссылками. Для добавления нового сайта нужно создать новую директорю в ./sites/(лучше всего если ее название будет соответствовать коду нового сайта). И добавить в нее ссылки на необходимые файлы и директории:

mkdir sites/s2             # создать директорию для дополнительного сайта
cd sites/s2                # перейти в нее
ln -s ../../bitrix bitrix  # и
ln -s ../../local local    # добавить 
ln -s ../../upload upload  # ссылки     

Далее необходимо настроить веб-сервер для работы с новым сайтом.

Разное

Версионирование и деплой

Гайдлайн разработки Битрикс-проекта

Для пользователей Phabricator

В файле .arclint настроены основные проверки кода, в том числе описанные выше.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].