TYPO3-CMS/styleguide TYPO3-CMS/styleguide

  • Stars
    star
    102
  • Rank 334,642 (Top 7 %)
  • Language
    PHP
  • License
    GNU General Publi...
  • Created over 11 years ago
  • Updated about 2 months ago
Twitter logo Share LinkedIn logo Share Facebook logo Share
TYPO3-CMS/styleguide
github

TYPO3-CMS

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

[READ-ONLY] Subtree split of the TYPO3 Core Extension "styleguide"

tests

TYPO3 CMS Backend Styleguide

What is it?

Styleguide is a TYPO3 extension. It provides a backend module that hooks into the 'Help' menu of the top toolbar of the TYPO3 Backend. It can also create a page tree to show examples.

This extension in maintained in the official TYPO3 github organization.

Styleguide is developed "core-near": When TYPO3 core adds or deprecates features covered by this extension, core developers strive to keep it updated, reflecting these changes.

Styleguide is a reference to show a lot of TYPO3 backend features, often relevant for own extensions:

  • A set of snippets showing how to use default backend functionality like tables, buttons, boxes or notifications.
  • A huge set of 'TCA' examples, showing "all" features of the backend editing forms.

Usages

  • The extension is interesting for backend extension developers as a reference to see how casual stuff like buttons and other HTML related things are solved or used in the backend, and to copy+paste solutions. Additionally, the TCA examples is a near-complete show-case of FormEngine (editing records in the backend). Developers will see new things they did not know yet. Guaranteed!

  • The extension can be interesting for technical project managers to get an idea of what the backend editing is capable of out-of-the-box and which parts can be sold to customers without adding expensive implementation burdens to developers.

  • Styleguide is a "require-dev" dependency of the TYPO3 CMS core mono repository. It is used by core developers to test and verify changes to JavaScript, HTML and PHP code do not break layout or functionality of backend modules. The extension is also used in core backend acceptance tests to verify FormEngine details do not break when developing core patches.

  • Styleguide is used within the official core documentation to provide examples, screenshots and possible usages of core functionality. Especially the TCA reference heavily relies on it.

  • Styleguide comes with a simple set up of unit, functional and acceptance tests that are executed by github action workflow "tests.yml" - or locally if desired. This setup is documented as a working test set up example within the official TYPO3 explained testing section and can be used as a copy+paste boilerplate in own extensions.

Installation

Styleguide comes as a TYPO3 extension for the TYPO3 backend. It appears as backend module within the "Help" section of the top toolbar. After initial installation, it is advisable to let styleguide create an example page tree with records by clicking the "TCA / records -> Create styleguide page tree with data", and waiting for a couple of seconds for the system to crunch the data.

Composer

With composer based TYPO3 installations, styleguide is easily added to the project.

TYPO3 v12 based project:

composer require --dev typo3/cms-styleguide:^12

TYPO3 v11 based project:

composer require --dev typo3/cms-styleguide:^11
bin/typo3 extension:activate styleguide

TYPO3 Extension Repository

For non-composer projects, the extension is available in TER as extension key styleguide and can be installed using the extension manager.

Initialization

With styleguide, it is possible to automatically create sample pages and content for 2 purposes:

  1. "styleguide TCA demo" to showcase various TCA features
  2. "styleguide frontend demo" to create pages which can be used for Frontend testing

These pages can be created either in the backend or on the command line:

# show help
bin/typo3 styleguide:generate -h

# create pages
bin/typo3 styleguide:generate -c

Alternatively, the pages can be created in the TYPO3 backend:

  1. Access the styleguide module by clicking on the question mark in the top bar: ? | Styleguide | TCA / Records / Frontend
  2. Click the available buttons

Usage

Styleguide comes with a module which is available by clicking on the question mark in the top bar: ? | Styleguide.

You can also peruse through the TCA demo by selecting the pages in the page tree. Use the list module to get access to the records.

The TYPO3 TCA reference documentation often uses examples from the styleguide.

Running tests

Styleguide comes with a simple demo set of unit, functional and acceptance tests. It relies on the runTests.sh script which is a simplified version of a similar script from the TYPO3 core. Find detailed usage examples by executing Build/Scripts/runTests.sh -h and have a look at .github/workflows/tests.yml to see how this is used in CI.

Example usage:

Build/Scripts/runTests.sh -s composerUpdate
Build/Scripts/runTests.sh -s unit

Tagging and releasing

packagist.org is enabled via the casual github hook. TER releases are created by the "publish.yml" github workflow when tagging versions using tailor. The commit message of the commit a tag points to is used as TER upload comment.

Example:

composer req --dev typo3/tailor
.Build/bin/tailor set-version 12.0.0
composer rem --dev typo3/tailor
git commit -am "[RELEASE] 12.0.0 Core v12 compatibility"
git tag 12.0.0
git push
git push --tags

Legal

This project is released under GPLv2 license. See LICENSE.txt for details.

More Repositories

1

core

[READ-ONLY] Subtree split of the TYPO3 Core Extension "core"
PHP
24
star
2

fluid_styled_content

[READ-ONLY] Subtree split of the TYPO3 Core Extension "fluid_styled_content"
HTML
21
star
3

frontend

[READ-ONLY] Subtree split of the TYPO3 Core Extension "frontend"
PHP
20
star
4

fluid

[READ-ONLY] Subtree split of the TYPO3 Core Extension "fluid"
PHP
18
star
5

backend

[READ-ONLY] Subtree split of the TYPO3 Core Extension "backend"
PHP
18
star
6

filelist

[READ-ONLY] Subtree split of the TYPO3 Core Extension "filelist"
PHP
18
star
7

extensionmanager

[READ-ONLY] Subtree split of the TYPO3 Core Extension "extensionmanager"
PHP
17
star
8

install

[READ-ONLY] Subtree split of the TYPO3 Core Extension "install"
PHP
17
star
9

extbase

[READ-ONLY] Subtree split of the TYPO3 Core Extension "extbase"
PHP
17
star
10

rte_ckeditor

[READ-ONLY] Subtree split of the TYPO3 Core Extension "rte_ckeditor"
PHP
17
star
11

setup

[READ-ONLY] Subtree split of the TYPO3 Core Extension "setup"
PHP
16
star
12

recordlist

[READ-ONLY] Subtree split of the TYPO3 Core Extension "recordlist"
PHP
16
star
13

beuser

[READ-ONLY] Subtree split of the TYPO3 Core Extension "beuser"
PHP
16
star
14

tstemplate

[READ-ONLY] Subtree split of the TYPO3 Core Extension "tstemplate"
PHP
16
star
15

info

[READ-ONLY] Subtree split of the TYPO3 Core Extension "info"
PHP
15
star
16

belog

[READ-ONLY] Subtree split of the TYPO3 Core Extension "belog"
PHP
15
star
17

viewpage

[READ-ONLY] Subtree split of the TYPO3 Core Extension "viewpage"
PHP
14
star
18

scheduler

[READ-ONLY] Subtree split of the TYPO3 Core Extension "scheduler"
PHP
14
star
19

redirects

[READ-ONLY] Subtree split of the TYPO3 Core Extension "core"
PHP
14
star
20

seo

[READ-ONLY] Subtree split of the TYPO3 Core Extension "seo"
PHP
14
star
21

lowlevel

[READ-ONLY] Subtree split of the TYPO3 Core Extension "lowlevel"
PHP
14
star
22

form

[READ-ONLY] Subtree split of the TYPO3 Core Extension "form"
PHP
13
star
23

reports

[READ-ONLY] Subtree split of the TYPO3 Core Extension "reports"
PHP
12
star
24

felogin

[READ-ONLY] Subtree split of the TYPO3 Core Extension "felogin"
PHP
10
star
25

t3editor

[READ-ONLY] Subtree split of the TYPO3 Core Extension "t3editor"
PHP
10
star
26

adminpanel

[READ-ONLY] Subtree split of the TYPO3 Core Extension "adminpanel"
PHP
10
star
27

sys_note

[READ-ONLY] Subtree split of the TYPO3 Core Extension "sys_note"
PHP
10
star
28

impexp

[READ-ONLY] Subtree split of the TYPO3 Core Extension "impexp"
PHP
9
star
29

recycler

[READ-ONLY] Subtree split of the TYPO3 Core Extension "recycler"
PHP
9
star
30

filemetadata

[READ-ONLY] Subtree split of the TYPO3 Core Extension "filemetadata"
PHP
8
star
31

dashboard

[READ-ONLY] Subtree split of the TYPO3 Core Extension "dashboard"
PHP
7
star
32

about

[READ-ONLY] Subtree split of the TYPO3 Core Extension "about"
HTML
7
star
33

indexed_search

[READ-ONLY] Subtree split of the TYPO3 Core Extension "indexed_search"
PHP
7
star
34

linkvalidator

[READ-ONLY] Subtree split of the TYPO3 Core Extension "linkvalidator"
PHP
6
star
35

workspaces

[READ-ONLY] Subtree split of the TYPO3 Core Extension "workspaces"
PHP
5
star
36

info_pagetsconfig

[READ-ONLY] Subtree split of the TYPO3 Core Extension "info_pagetsconfig"
PHP
4
star
37

sv

[READ-ONLY] Subtree split of the TYPO3 Core Extension "sv"
PHP
4
star
38

lang

[READ-ONLY] Subtree split of the TYPO3 Core Extension "lang"
PHP
4
star
39

cshmanual

[READ-ONLY] Subtree split of the TYPO3 Core Extension "cshmanual"
PHP
4
star
40

func

[READ-ONLY] Subtree split of the TYPO3 Core Extension "func"
PHP
4
star
41

saltedpasswords

[READ-ONLY] Subtree split of the TYPO3 Core Extension "saltedpasswords"
PHP
4
star
42

wizard_crpages

[READ-ONLY] Subtree split of the TYPO3 Core Extension "wizard_crpages"
PHP
4
star
43

rsaauth

[READ-ONLY] Subtree split of the TYPO3 Core Extension "rsaauth"
PHP
3
star
44

opendocs

[READ-ONLY] Subtree split of the TYPO3 Core Extension "opendocs"
PHP
3
star
45

context_help

[READ-ONLY] Subtree split of the TYPO3 Core Extension "context_help"
PHP
2
star
46

wizard_sortpages

[READ-ONLY] Subtree split of the TYPO3 Core Extension "wizard_sortpages"
PHP
2
star
47

documentation

[READ-ONLY] Subtree split of the TYPO3 Core Extension "documentation"
PHP
2
star