[DOCS] Add quick start chapter

Author: gilbertsoft

Documentation/QuickStart/Images/Backend/Dashboard.png

@@ -0,0 +1,43 @@
+.. ==================================================
+.. FOR YOUR INFORMATION
+.. --------------------------------------------------
+.. -*- coding: utf-8 -*- with BOM.
+
+.. include:: ../Includes.txt
+
+
+========================
+Quick Start from Scratch
+========================
+
+This guide explains to setup your new TYPO3 project with Bootstrap Package and a
+Sitepackage from scratch with the help of DDEV Local on your local computer.
+Once you have finished you can deploy it to a hoster of your choice.
+
+
+System Requirements
+===================
+
+Make sure you have the following components installed before you continue:
+
+* `DDEV Local and Docker <https://ddev.readthedocs.io/en/stable/>`_
+* `Git <https://git-scm.com/>`_ or similar software configuration management,
+  Git is required on Windows to successfuly run DDEV and used as reference in
+  this guide
+* Editor of your choice like `Visual Studio Code <https://code.visualstudio.com/Download>`_
+  or `PhpStorm <https://www.jetbrains.com/de-de/phpstorm/download/>`_
+
+Once you have successfuly installed the previous mentioned components your
+project will be setup and ready to use within minutes.
+
+
+Overview
+========
+
+.. toctree::
+   :maxdepth: 5
+   :titlesonly:
+   :glob:
+
+   Preparation/Index
+   Sitepackage/Index

Documentation/QuickStart/Images/Backend/Login.png

@@ -0,0 +1,70 @@
+.. ==================================================
+.. FOR YOUR INFORMATION
+.. --------------------------------------------------
+.. -*- coding: utf-8 -*- with BOM.
+
+.. include:: ../../Includes.txt
+
+
+==================
+Configure Composer
+==================
+
+
+TYPO3 Core Extensions
+=====================
+
+Now it's time to tell Composer which packages and TYPO3 extensions you like to
+install and setup. For a initial setup run the following commands:
+
+.. code-block:: bash
+
+   ddev composer create "typo3/cms-base-distribution:^10" --no-install
+   ddev start
+   ddev composer config repositories.local path "packages/*"
+   ddev composer require "my-company/mysitepackage:@dev" --no-update
+
+This will setup your TYPO3 project with a default set of core extensions and
+the previously created **Sitepackage**, remember to replace the
+**vendor/package**.
+
+
+TYPO3 Secure Web (optional)
+===========================
+
+To increase the security of your project you can simply use the
+:composer:`helhum/typo3-secure-web` package.
+
+.. code-block:: bash
+
+   ddev composer config extra.typo3/cms.root-dir private
+   ddev composer config extra.typo3/cms.web-dir public
+   ddev exec mkdir -p private/typo3conf
+   ddev exec ln -rs public/typo3conf/AdditionalConfiguration.php private/typo3conf/AdditionalConfiguration.php
+   ddev composer require "helhum/typo3-secure-web" --no-update
+
+More information can be found at the `TYPO3 Secure Web Github Repository <https://github.com/helhum/typo3-secure-web#readme>`_
+
+
+Additional TYPO3 (Core) Extensions
+==================================
+
+You are free to add more packages, for core extensions head to the
+`Composer Helper <https://get.typo3.org/misc/composer/helper>`_ and select the
+desired packages, extensions can be found at the
+`TYPO3 Extension Repository <https://extensions.typo3.org/>`_. Make sure you
+always add the :composer:`--no-update` option to avoid version conflicts
+later.
+
+
+Install the Packages
+====================
+
+Once you have finished adding more packages run the following command to start
+the installation process:
+
+.. code-block:: bash
+
+   ddev composer install
+
+Your project is now installed and ready to setup.

Documentation/QuickStart/Images/Backend/PageModule.png

@@ -0,0 +1,20 @@
+.. ==================================================
+.. FOR YOUR INFORMATION
+.. --------------------------------------------------
+.. -*- coding: utf-8 -*- with BOM.
+
+.. include:: ../../Includes.txt
+
+
+====================
+Configure DDEV Local
+====================
+
+Head to your newly created project folder with your favorite shell or the
+integrated shell of your editor and run the following command to setup DDEV:
+
+.. code-block:: bash
+
+   ddev config --project-type=typo3 --docroot=public --create-docroot=true
+
+DDEV Local is now setup and ready to use.

Documentation/QuickStart/Images/Backend/TemplateModule.png

@@ -0,0 +1,23 @@
+.. ==================================================
+.. FOR YOUR INFORMATION
+.. --------------------------------------------------
+.. -*- coding: utf-8 -*- with BOM.
+
+.. include:: ../../Includes.txt
+
+
+==============================================
+Initialize the local Git Repository (optional)
+==============================================
+
+It is recommended you manage your project with version control system like
+**Git** but there is no restriction, you can use your favorite one. This guide
+will use **Git** in the examples.
+
+.. code-block:: bash
+
+   git init
+
+Your local repository is now setup and ready to use. Please head to the
+`Git documentation <https://git-scm.com/doc>`_ to learn how to use **Git** for
+your daily work.

Documentation/QuickStart/Images/Frontend/Home.png

@@ -0,0 +1,32 @@
+.. ==================================================
+.. FOR YOUR INFORMATION
+.. --------------------------------------------------
+.. -*- coding: utf-8 -*- with BOM.
+
+.. include:: ../../Includes.txt
+
+
+===========
+Preparation
+===========
+
+Before you can start working on your new project some preparation steps are
+required.
+
+
+Overview
+========
+
+.. toctree::
+   :maxdepth: 5
+   :titlesonly:
+   :glob:
+
+   ProjectFolder
+   Sitepackage
+   Ddev
+   Composer
+   InstallWizard
+   Git
+   Template
+   Page

Documentation/QuickStart/Images/Page/ButtonAddContent.png

@@ -0,0 +1,61 @@
+.. ==================================================
+.. FOR YOUR INFORMATION
+.. --------------------------------------------------
+.. -*- coding: utf-8 -*- with BOM.
+
+.. include:: ../../Includes.txt
+
+
+===========
+Setup TYPO3
+===========
+
+In this step your new TYPO3 instance will be setup with a initial
+configuration. To gain access to the **TYPO3 Install Wizard** you need to
+create the file :file:`FIRST_INSTALL` in the web server root directory:
+
+.. code-block:: bash
+
+   ddev exec touch public/FIRST_INSTALL
+   ddev launch
+
+The last command will open the browser pointing to the **TYPO3 Install Wizard**
+which is used for the initial setup of your project. Some steps are skipped
+because various configurations like database credentials are already provided
+by DDEV and you don't have to care about.
+
+
+Step 1
+======
+
+.. figure:: ../Images/Setup/Step1.png
+   :width: 500px
+   :alt: TYPO3 Install Wizard Step 1
+   :class: with-border
+
+Just click :button:`No problems detected, continue with installation` to
+continue with the next step.
+
+
+Step 2
+======
+
+.. figure:: ../Images/Setup/Step4.png
+   :width: 500px
+   :alt: TYPO3 Install Wizard Step 4
+   :class: with-border
+
+Fill the form with the desired credentials for your administrative user and
+click :button:`Continue` to head to the final step.
+
+
+Step 3
+======
+
+.. figure:: ../Images/Setup/Step5.png
+   :width: 500px
+   :alt: TYPO3 Install Wizard Step 5
+   :class: with-border
+
+Select :button:`Create empty starting page` and click
+:button:`Open the TYPO3 Backend` to be redirected to the backend login page.

Documentation/QuickStart/Images/Page/NewContentElementWizard.png

@@ -0,0 +1,34 @@
+.. ==================================================
+.. FOR YOUR INFORMATION
+.. --------------------------------------------------
+.. -*- coding: utf-8 -*- with BOM.
+
+.. include:: ../../Includes.txt
+
+
+====================
+Provide some Content
+====================
+
+On the left side choose the **Page module** and in the **page tree** click the
+page **Home**.
+
+.. figure:: ../Images/Backend/PageModule.png
+   :width: 800px
+   :alt: TYPO3 Page Module
+   :class: with-shadow
+
+Add a new content element by clicking :button:`+ Content`.
+
+.. figure:: ../Images/Page/ButtonAddContent.png
+   :alt: Add Content
+   :class: with-border
+
+Fill some content into the field **Header** and **Text**.
+
+.. figure:: ../Images/Page/RegularTextElement.png
+   :width: 800px
+   :alt: Create new Page Content
+   :class: with-border
+
+On the top click :button:`Save` and :button:`Preview`.

Documentation/QuickStart/Images/Page/RegularTextElement.png

@@ -0,0 +1,25 @@
+.. ==================================================
+.. FOR YOUR INFORMATION
+.. --------------------------------------------------
+.. -*- coding: utf-8 -*- with BOM.
+
+.. include:: ../../Includes.txt
+
+
+=======================
+Create a Project Folder
+=======================
+
+Create a project folder for your new project. This is usualy done in your user
+home directory or a sub folder but every place is possible. This guide will
+use :file:`typo3-quick-start` as project folder.
+
+In your project folder create a folder :file:`packages`. This folder will be
+used as local path repository for project specific extensions and packages
+like the **Sitepackage** we will create in the next step.
+
+.. code-block:: bash
+
+   mkdir typo3-quick-start
+   cd typo3-quick-start
+   mkdir packages

Documentation/QuickStart/Images/Setup/Step1.png

@@ -0,0 +1,27 @@
+.. ==================================================
+.. FOR YOUR INFORMATION
+.. --------------------------------------------------
+.. -*- coding: utf-8 -*- with BOM.
+
+.. include:: ../../Includes.txt
+
+
+====================
+Create a Sitepackage
+====================
+
+Go to the `Sitepackage Builder <https://www.sitepackagebuilder.com/new/>`_
+and create your personal **Sitepackage**.
+
+Make sure you select the correct **TYPO3 Version** and **Base Package**, you
+can relay your **Sitepackage** on the TYPO3 extension **Bootstrap Package** or
+on pure core functionality by selecting **Fluid Styled Content**.
+
+Remeber the **Composer name** of your **Sitepackage** shown after the
+creation, you will need it later again, this guide will use the
+**Sitepackage name** :composer:`my-company/mysitepackage`.
+
+Save the generated **Sitepackage** to the :file:`packages` folder and extract
+it into a sub folder, usualy the name of the downloaded ZIP file. Do not
+extract the **Sitepackage** directly into the :file:`packages` folder. This
+guide will use the folder name :file:`mysitepackage`.