added some extra documentation

.browserslistrc

@@ -0,0 +1,3 @@
+# Supported browsers
+
+> 15%

.editorconfig

@@ -0,0 +1,15 @@
+# editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+
+# Temporary fix to annoying bug
+insert_final_newline = false
+
+[*.md]
+trim_trailing_whitespace = false

.gitattributes

@@ -0,0 +1,7 @@
+# We'll let Git's auto-detection algorithm infer if a file is text. If it is,
+# enforce LF line endings regardless of OS or git configurations.
+* text=auto eol=lf
+
+# Isolate binary files in case the auto-detection algorithm fails and
+# marks them as text files (which could brick them).
+*.{png,jpg,jpeg,gif,webp,woff,woff2} binary

.gitignore

@@ -1 +1,546 @@
+# Created by https://www.toptal.com/developers/gitignore/api/git,vue,sass,node,nuxt,react,macos,linux,vuejs,video,nuxtjs,windows,archives,compressedarchive
+# Edit at https://www.toptal.com/developers/gitignore?templates=git,vue,sass,node,nuxt,react,macos,linux,vuejs,video,nuxtjs,windows,archives,compressedarchive
+
+### Archives ###
+# It's better to unpack these files and commit the raw source because
+# git has its own built in compression methods.
+*.7z
+*.jar
+*.rar
+*.zip
+*.gz
+*.gzip
+*.tgz
+*.bzip
+*.bzip2
+*.bz2
+*.xz
+*.lzma
+*.cab
+*.xar
+
+# Packing-only formats
+*.iso
+*.tar
+
+# Package management formats
+*.dmg
+*.xpi
+*.gem
+*.egg
+*.deb
+*.rpm
+*.msi
+*.msm
+*.msp
+*.txz
+
+### CompressedArchive ###
+
+### Mostly from https://en.wikipedia.org/wiki/List_of_archive_formats
+
+## Archiving and compression
+# Open source file format. Used by 7-Zip.
+# Mac OS X, restoration on different platforms is possible although not immediate 	Yes 	Based on 7z. Preserves Spotlight metadata, resource forks, owner/group information, dates and other data which would be otherwise lost with compression.
+*.s7z
+# Old archive versions only 	Proprietary format
+*.ace
+# A format that compresses and doubly encrypt the data (AES256 and CAS256) avoiding brute force attacks, also hide files in an AFA file. It has two ways to safeguard data integrity and subsequent repair of the file if has an error (repair with AstroA2P (online) or Astrotite (offline)).
+*.afa
+# A mainly Korean format designed for very large archives.
+*.alz
+# Android application package (variant of JAR file format).
+*.apk
+# ??
+*.arc
+# Originally DOS, now multiple
+*.arj
+# Open archive format, used by B1 Free Archiver (http://dev.b1.org/standard/archive-format.html)
+*.b1
+# Binary Archive with external header
+*.ba
+# Proprietary format from the ZipTV Compression Components
+*.bh
+# The Microsoft Windows native archive format, which is also used by many commercial installers such as InstallShield and WISE.
+# Originally DOS, now DOS and Windows 	Created by Yaakov Gringeler; released last in 2003 (Compressia 1.0.0.1 beta), now apparently defunct. Free trial of 30 days lets user create and extract archives; after that it is possible to extract, but not to create.
+*.car
+# Open source file format.
+*.cfs
+# Compact Pro archive, a common archiver used on Mac platforms until about Mac OS 7.5.x. Competed with StuffIt; now obsolete.
+*.cpt
+# Windows, Unix-like, Mac OS X Open source file format. Files are compressed individually with either gzip, bzip2 or lzo.
+*.dar
+# DiskDoubler 	Mac OS 			obsolete
+*.dd
+# ??
+*.dgc
+# Apple Disk Image upports "Internet-enabled" disk images, which, once downloaded, are automatically decompressed, mounted, have the contents extracted, and thrown away. Currently, Safari is the only browser that supports this form of extraction; however, the images can be manually extracted as well. This format can also be password-protected or encrypted with 128-bit or 256-bit AES encryption.
+# Enterprise Java Archive archive
+*.ear
+# ETSoft compressed archive
+# The predecessor of DGCA.
+*.gca
+# Originally DOS 	Yes, but may be covered by patents 	DOS era format; uses arithmetic/Markov coding
+*.ha
+# MS Windows 	HKI
+*.hki
+# Produced by ICEOWS program. Excels at text file compression.
+*.ice
+# Java archive, compatible with ZIP files
+# Open sourced archiver with compression using the PAQ family of algorithms and optional encryption.
+*.kgb
+# Originally DOS, now multiple 	Multiple 	Yes 	The standard format on Amiga.
+*.lzh
+*.lha
+# Archiver originally used on The Amiga. Now copied by Microsoft to use in their .cab and .chm files.
+*.lzx
+# file format from NoGate Consultings, a rival from ARC-Compressor.
+*.pak
+# A disk image archive format that supports several compression methods as well as splitting the archive into smaller pieces.
+*.partimg
+# An experimental open source packager (http://mattmahoney.net/dc)
+*.paq*
+# Open source archiver supporting authenticated encryption, volume spanning, customizable object level and volume level integrity checks (form CRCs to SHA-512 and Whirlpool hashes), fast deflate based compression
+*.pea
+# The format from the PIM - a freeware compression tool by Ilia Muraviev. It uses an LZP-based compression algorithm with set of filters for executable, image and audio files.
+*.pim
+# PackIt 	Mac OS 			obsolete
+*.pit
+# Used for data in games written using the Quadruple D library for Delphi. Uses byte pair compression.
+*.qda
+# A proprietary archive format, second in popularity to .zip files.
+# The format from a commercial archiving package. Odd among commercial packages in that they focus on incorporating experimental algorithms with the highest possible compression (at the expense of speed and memory), such as PAQ, PPMD and PPMZ (PPMD with unlimited-length strings), as well as a proprietary algorithms.
+*.rk
+# Self Dissolving ARChive 	Commodore 64, Commodore 128 	Commodore 64, Commodore 128 	Yes 	SDAs refer to Self Dissolving ARC files, and are based on the Commodore 64 and Commodore 128 versions of ARC, originally written by Chris Smeets. While the files share the same extension, they are not compatible between platforms. That is, an SDA created on a Commodore 64 but run on a Commodore 128 in Commodore 128 mode will crash the machine, and vice versa. The intended successor to SDA is SFX.
+*.sda
+# A pre-Mac OS X Self-Extracting Archive format. StuffIt, Compact Pro, Disk Doubler and others could create .sea files, though the StuffIt versions were the most common.
+*.sea
+# Scifer Archive with internal header
+*.sen
+# Commodore 64, Commodore 128 	SFX is a Self Extracting Archive which uses the LHArc compression algorithm. It was originally developed by Chris Smeets on the Commodore platform, and runs primarily using the CS-DOS extension for the Commodore 128. Unlike its predecessor SDA, SFX files will run on both the Commodore 64 and Commodore 128 regardless of which machine they were created on.
+*.sfx
+# An archive format designed for the Apple II series of computers. The canonical implementation is ShrinkIt, which can operate on disk images as well as files. Preferred compression algorithm is a combination of RLE and 12-bit LZW. Archives can be manipulated with the command-line NuLib tool, or the Windows-based CiderPress.
+*.shk
+# A compression format common on Apple Macintosh computers. The free StuffIt Expander is available for Windows and OS X.
+*.sit
+# The replacement for the .sit format that supports more compression methods, UNIX file permissions, long file names, very large files, more encryption options, data specific compressors (JPEG, Zip, PDF, 24-bit image, MP3). The free StuffIt Expander is available for Windows and OS X.
+*.sitx
+# A royalty-free compressing format
+*.sqx
+# The "tarball" format combines tar archives with a file-based compression scheme (usually gzip). Commonly used for source and binary distribution on Unix-like platforms, widely available elsewhere.
+*.tar.gz
+*.tar.Z
+*.tar.bz2
+*.tbz2
+*.tar.lzma
+*.tlz
+# UltraCompressor 2.3 was developed to act as an alternative to the then popular PKZIP application. The main feature of the application is its ability to create large archives. This means that compressed archives with the UC2 file extension can hold almost 1 million files.
+*.uc
+*.uc0
+*.uc2
+*.ucn
+*.ur2
+*.ue2
+# Based on PAQ, RZM, CSC, CCM, and 7zip. The format consists of a PAQ, RZM, CSC, or CCM compressed file and a manifest with compression settings stored in a 7z archive.
+*.uca
+# A high compression rate archive format originally for DOS.
+*.uha
+# Web Application archive (Java-based web app)
+*.war
+# File-based disk image format developed to deploy Microsoft Windows.
+*.wim
+# XAR
+# Native format of the Open Source KiriKiri Visual Novel engine. Uses combination of block splitting and zlib compression. The filenames and pathes are stored in UTF-16 format. For integrity check, the Adler-32 hashsum is used. For many commercial games, the files are encrypted (and decoded on runtime) via so-called "cxdec" module, which implements xor-based encryption.
+*.xp3
+# Yamazaki zipper archive. Compression format used in DeepFreezer archiver utility created by Yamazaki Satoshi. Read and write support exists in TUGZip, IZArc and ZipZag
+*.yz1
+# The most widely used compression format on Microsoft Windows. Commonly used on Macintosh and Unix systems as well.
+*.zipx
+# application/x-zoo 	zoo 	Multiple 	Multiple 	Yes
+*.zoo
+# Journaling (append-only) archive format with rollback capability. Supports deduplication and incremental update based on last-modified dates. Multi-threaded. Compresses in LZ77, BWT, and context mixing formats. Open source.
+*.zpaq
+# Archiver with a compression algorithm based on the Burrows-Wheeler transform method.
+*.zz
+
+
+### Git ###
+# Created by git for backups. To disable backups in Git:
+# $ git config --global mergetool.keepBackup false
+*.orig
+
+# Created by git when using merge tools for conflicts
+*.BACKUP.*
+*.BASE.*
+*.LOCAL.*
+*.REMOTE.*
+*_BACKUP_*.txt
+*_BASE_*.txt
+*_LOCAL_*.txt
+*_REMOTE_*.txt
+
+### Linux ###
+*~
+
+# temporary files which can be created if a process still has a handle open of a deleted file
+.fuse_hidden*
+
+# KDE directory preferences
+.directory
+
+# Linux trash folder which might appear on any partition or disk
+.Trash-*
+
+# .nfs files are created when an open file is removed but is still being accessed
+.nfs*
+
+### macOS ###
+# General
+.DS_Store
+.AppleDouble
+.LSOverride
+
+# Icon must end with two \r
+Icon
+
+
+# Thumbnails
+._*
+
+# Files that might appear in the root of a volume
+.DocumentRevisions-V100
+.fseventsd
+.Spotlight-V100
+.TemporaryItems
+.Trashes
+.VolumeIcon.icns
+.com.apple.timemachine.donotpresent
+
+# Directories potentially created on remote AFP share
+.AppleDB
+.AppleDesktop
+Network Trash Folder
+Temporary Items
+.apdisk
+
+### Node ###
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional stylelint cache
+.stylelintcache
+
+# Microbundle cache
+.rpt2_cache/
+.rts2_cache_cjs/
+.rts2_cache_es/
+.rts2_cache_umd/
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+.env.test
+.env*.local
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+.parcel-cache
+
+# Next.js build output
+.next
+
+# Nuxt.js build / generate output
+.nuxt
+dist
+
+# Storybook build outputs
+.out
+.storybook-out
+storybook-static
+
+# rollup.js default build output
+dist/
+
+# Gatsby files
+.cache/
+# Comment in the public line in if your project uses Gatsby and not Next.js
+# https://nextjs.org/blog/next-9-1#public-directory-support
+# public
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# TernJS port file
+.tern-port
+
+# Stores VSCode versions used for testing VSCode extensions
+.vscode-test
+
+# Temporary folders
+tmp/
+temp/
+@Temp/
+
+### Nuxt ###
+# gitignore template for Nuxt.js projects
+#
+# Recommended template: Node.gitignore
+
+# Nuxt build
+
+# Nuxt generate
+
+### Nuxtjs ###
+# dependencies
+node_modules
+
+# logs
+npm-debug.log
+
+# Nuxt build
+
+# Nuxt generate
+
+### react ###
+.DS_*
+**/*.backup.*
+**/*.back.*
+
+
+*.sublime*
+
+psd
+thumb
+sketch
+
+### Sass ###
+.sass-cache/
+*.css.map
+*.sass.map
+*.scss.map
+
+### Video ###
+*.3g2
+*.3gp
+*.asf
+*.asx
+*.avi
+*.flv
+*.mkv
+*.mov
+*.mp4
+*.mpg
+*.ogv
+*.rm
+*.swf
+*.vob
+*.wmv
+*.webm
+
+### Vue ###
+# gitignore template for Vue.js projects
+# Recommended template: Node.gitignore
+
+# TODO: where does this rule come from?
+docs/_book
+
+# TODO: where does this rule come from?
+test/
+
+### Vuejs ###
+# Recommended template: Node.gitignore
+
+yarn-error.log
+
+### Windows ###
+# Windows thumbnail cache files
+Thumbs.db
+Thumbs.db:encryptable
+ehthumbs.db
+ehthumbs_vista.db
+
+# Dump file
+*.stackdump
+
+# Folder config file
+[Dd]esktop.ini
+
+# Recycle Bin used on file shares
+$RECYCLE.BIN/
+
+# Windows Installer files
+*.msix
+
+# Windows shortcuts
+*.lnk
+
+# End of https://www.toptal.com/developers/gitignore/api/git,vue,sass,node,nuxt,react,macos,linux,vuejs,video,nuxtjs,windows,archives,compressedarchive
+
+# Name: Custom Whitelist
+# Created by : Raf Vergauwen
+archives/
+
+.idea
+
+# Created by .ignore support plugin (hsz.mobi)
+### Node template
+# Logs
+/logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# next.js build output
+.next
+
+# nuxt.js build output
+.nuxt
+
+# Nuxt generate
+dist
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless
+
+# IDE / Editor
+.idea
+
+# Service worker
+sw.*
+
+# macOS
+.DS_Store
+
+# Vim swap files
+*.swp
 vendor/
+private/test.db
+
+

.markdownlint.json

@@ -0,0 +1,6 @@
+{
+  "line-length": false,
+  /* "MD033" */ "no-inline-html": {
+    "allowed_elements": ["details", "summary", "i", "a", "img", "small", "br", "h1", "div", "blockquote", "b", "hr", "q", "h2", "h3"]
+  }
+}

.prettierrc

@@ -0,0 +1,18 @@
+{
+  "printWidth": 120,
+  "tabWidth": 2,
+  "useTabs": false,
+  "semi": true,
+  "singleQuote": true,
+  "quoteProps": "as-needed",
+  "jsxSingleQuote": false,
+  "trailingComma": "all",
+  "bracketSpacing": true,
+  "jsxBracketSameLine": true,
+  "arrowParens": "always",
+  "proseWrap": "preserve",
+  "htmlWhitespaceSensitivity": "css",
+  "vueIndentScriptAndStyle": false,
+  "endOfLine": "auto",
+  "embeddedLanguageFormatting": "auto"
+}

.vscode/PHP-Raf.code-workspace

@@ -0,0 +1,8 @@
+{
+	"folders": [
+		{
+			"path": ".."
+		}
+	],
+	"settings": {}
+}

.vscode/cspell.json

@@ -0,0 +1,66 @@
+// cSpell Settings
+{
+  // #  VERSION - Currently always 0.2. Controls how the settings in the configuration file behave
+  "version": "0.2",
+  // #  LANGUAGE - Current active spelling language
+  "language": "nl,nl-NL,en,en-GB,en-US",
+  // #  WORDS - List of words to be always considered correct
+  "words": [
+    "dotenv",
+    "fira",
+    "mono",
+    "nuxt",
+    "nuxtjs",
+    "packages",
+    "powered",
+    "query",
+    "roboto",
+    "tsbuildinfo",
+    "uncompiled",
+    "vuejs",
+    "vuepress",
+    "vuex",
+    "webm",
+    "webp",
+    "visualstudio"
+  ],
+  // #  FLAGWORDS - List of words to be always considered incorrect
+  "flagWords": ["hte"],
+  // #  IGNOREWORDS - list of words to be ignored (even if they are in the flagWords)
+  "ignoreWords": ["example"],
+  // #  IGNOREPATHS - List of globs to specify which files are to be ignored
+  "ignorePaths": ["node_modules/**"],
+  // #  MAXNUMBEROFPROBLEMS - Defaults to 100 per file
+  "maxNumberOfProblems": 100,
+  // #  MINWORDLENGTH - Defaults to 4, the minimum length of a word before it is checked
+  "minWordLength": 4,
+  // #  CASESENSITIVE - This might create a lot of false issues in code files
+  "caseSensitive": false,
+  // #  ALLOWCOMPOUNDWORDS - Defaults to false; set to true to allow compound words by default
+  "allowCompoundWords": true,
+  // #  DICTIONARIES - List of the names of the dictionaries to use, see Dictionaries below
+  "dictionaries": ["miscellaneous", "php", "lorem-ipsum", "names"],
+  // #  DICTIONARIYDEFINITIONS - Define each dictionary, relative paths are relative to the config file
+  "dictionaryDefinitions": [
+    {
+      "name": "miscellaneous",
+      "path": "./dictionaries/miscellaneous.txt",
+      "addWords": true
+    },
+    {
+      "name": "php",
+      "path": "./dictionaries/php.txt",
+      "addWords": true
+    },
+    {
+      "name": "names",
+      "path": "./dictionaries/names.txt",
+      "addWords": true
+    },
+    {
+      "name": "lorem-ipsum",
+      "path": "./dictionaries/lorem-ipsum.txt",
+      "addWords": false
+    }
+  ]
+}

.vscode/dictionaries/lorem-ipsum.txt

@@ -0,0 +1,47 @@
+Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet
+Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi Lorem ipsum dolor sit amet consectetuer adipiscing elit sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat
+Ut wisi enim ad minim veniam quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi
+Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum Lorem ipsum dolor sit amet consectetuer adipiscing elit sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat Ut wisi enim ad minim veniam quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat
+Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat vel illum dolore eu feugiat nulla facilisis
+At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  At accusam aliquyam diam diam dolore dolores duo eirmod eos erat et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren kasd magna no rebum sanctus sea sed takimata ut vero voluptua est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat
+Consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet
+
+Lorem ipsum dolor sit amet consectetaur adipisicing elit sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Ut enim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur Excepteur sint occaecat cupidatat non proident sunt in culpa qui officia deserunt mollit anim id est laborum Et harumd und lookum like Greek to me dereud facilis est er expedit distinct Nam liber te conscient to factor tum poen legum odioque civiuda Et tam neque pecun modut est neque nonor et imper ned libidig met consectetur adipiscing elit sed ut labore et dolore magna aliquam makes one wonder who would ever read this stuff? Bis nostrud exercitation ullam mmodo consequet Duis aute in voluptate velit esse cillum dolore eu fugiat nulla pariatur At vver eos et accusam dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae Et harumd dereud facilis est er expedit distinct Nam libe soluta nobis eligent optio est congue nihil impedit doming id Lorem ipsum dolor sit amet consectetur adipiscing elit set eiusmod tempor incidunt et labore et dolore magna aliquam Ut enim ad minim veniam quis nostrud exerc Irure dolor in reprehend incididunt ut labore et dolore magna aliqua Ut enim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat Duis aute irure dolor in reprehenderit in voluptate velit esse molestaie cillum Tia non ob ea soluad incommod quae egen ium improb fugiend Officia deserunt mollit anim id est laborum Et harumd dereud facilis est er expedit distinct Nam liber te conscient to factor tum poen legum odioque civiuda et tam Neque pecun modut est neque nonor et imper ned libidig met consectetur adipiscing elit sed ut labore et dolore magna aliquam is nostrud exercitation ullam mmodo consequet Duis aute in voluptate velit esse cillum dolore eu fugiat nulla pariatur At vver eos et accusam dignissum qui blandit est praesent Trenz pruca beynocguon doas nog apoply su trenz ucu hugh rasoluguon monugor or trenz ucugwo jag scannar Wa hava laasad trenzsa gwo producgs su IdfoBraid yop quiel geg ba solaly rasponsubla rof trenzur sala ent dusgrubuguon Offoctivo immoriatoly hawrgasi pwicos asi sirucorThas sirutciun applios tyu thuso itoms ghuso pwicos gosi sirucor in mixent gosi sirucor ic mixent ples cak ontisi sowios uf Zerm hawr rwivos Unte af phen neige pheings atoot Prexs eis phat eit sakem eit vory gast te Plok peish ba useing phen roxas Eslo idaffacgad gef trenz beynocguon quiel ba trenz Spraadshaag ent trenz dreek wirc procassidt program Cak pwico vux bolug incluros all uf cak sirucor hawrgasi itoms alung gith cakiw nog pwicos Plloaso mako nuto uf cakso dodtos anr koop a cupy uf cak vux noaw yerw phuno Whag schengos uf efed quiel ba mada su otrenzr swipontgwook proudgs hus yag su ba dagarmidad Plasa maku noga wipont trenzsa schengos ent kaap zux copy wipont trenz kipg naar mixent phona Cak pwico siructiun ruos nust apoply tyu cak UCU sisulutiun munityuw uw cak UCU-TGU jot scannow Trens roxas eis ti Plokeing quert loppe eis yop prexs Piy opher hawers eit yaggles orn ti sumbloat alohe plok Su havo loasor cakso tgu pwuructs tyu InfuBwain ghu gill nug bo suloly sispunsiblo fuw cakiw salo anr ristwibutiun Hei muk neme eis loppe Treas em wankeing ont sime ploked peish rof phen sumbloat syug si phat phey gavet peish ta paat ein pheeir sumbloats Aslu unaffoctor gef cak siructiun gill bo cak spiarshoot anet cak GurGanglo gur pwucossing pwutwam Ghat dodtos ig pany gill bo maro tyu ucakw suftgasi pwuructs hod yot tyubo rotowminor Plloaso mako nuto uf cakso dodtos anr koop a cupy uf cak vux noaw yerw phuno Whag schengos uf efed quiel ba mada su otrenzr swipontgwook proudgs hus yag su ba dagarmidad Plasa maku noga wipont trenzsa schengos ent kaap zux copy wipont trenz kipg naar mixent phona Cak pwico siructiun ruos nust apoply tyu cak UCU sisulutiun munityuw uw cak UCU-TGU jot scannow Trens roxas eis ti Plokeing quert loppe eis yop prexs Piy opher hawers eit yaggles orn ti sumbloat alohe plok Su havo loasor cakso tgu pwuructs tyu
+
+Lorem ipsum dolor sit amet consectetuer adipiscing elit sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat Ut wisi enim ad minim veniam quis nostrud exercitation ulliam corper suscipit lobortis nisl ut aliquip ex ea commodo consequat Duis autem veleum iriure dolor in hendrerit in vulputate velit esse molestie consequat vel willum lunombro dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi Li Europan lingues es membres del sam familie Lor separat existentie es un myth Por scientie musica sport etc li tot Europa usa li sam vocabularium Li lingues differe solmen in li grammatica li pronunciation e li plu commun vocabules Omnicos directe al desirabilit… de un nov lingua franca: on refusa continuar payar custosi traductores It solmen va esser necessi far uniform grammatica pronunciation e plu sommun paroles Ma quande lingues coalesce li grammatica del resultant lingue es plu simplic e regulari quam ti del coalescent lingues Li nov lingua franca va esser plu simplic e regulari quam li existent Europan lingues It va esser tam simplic quam Occidental: in fact it va esser Occidental A un Angleso it va semblar un simplificat Angles quam un skeptic Cambridge amico dit me que Occidental es
+
+Lorem ipsum dolor sit amet consectetuer adipiscing elit sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat Ut wisis enim ad minim veniam quis nostrud exerci tution ullam corper suscipit lobortis nisi ut aliquip ex ea commodo consequat Duis te feugi facilisi Duis autem dolor in hendrerit in vulputate velit esse molestie consequat vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit au gue duis dolore te feugat nulla facilisi
+
+Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet
+
+Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi Lorem ipsum dolor sit amet consectetuer adipiscing elit sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat
+
+Ut wisi enim ad minim veniam quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi
+
+Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum Lorem ipsum dolor sit amet consectetuer adipiscing elit sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat Ut wisi enim ad minim veniam quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat
+
+Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat vel illum dolore eu feugiat nulla facilisis
+
+At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  At accusam aliquyam diam diam dolore dolores duo eirmod eos erat et nonumy sed tempor et et invidunt justo labore Stet clita ea et gubergren kasd magna no rebum sanctus sea sed takimata ut vero voluptua est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat
+
+Consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet consetetur sadipscing elitr  sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat sed diam voluptua At vero eos et accusam et justo duo dolores et ea rebum Stet clita kasd gubergren no sea takimata sanctus est Lorem ipsum dolor sit amet
+
+Lorem ipsum dolor sit amet consectetaur adipisicing elit sed do eiusmod tempor incididunt ut labore et dolore magna aliqua Ut enim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur
+
+Excepteur sint occaecat cupidatat non proident sunt in culpa qui officia deserunt mollit anim id est laborum Et harumd und lookum like Greek to me dereud facilis est er expedit distinct Nam liber te conscient to factor tum poen legum odioque civiuda Et tam neque pecun modut est neque nonor et imper ned libidig met consectetur adipiscing elit sed ut labore et dolore magna aliquam makes one wonder who would ever read this stuff? Bis nostrud exercitation ullam mmodo consequet Duis aute in voluptate velit esse cillum dolore eu fugiat nulla pariatur At vver eos et accusam dignissum qui blandit est praesent luptatum delenit aigue excepteur sint occae
+
+Et harumd dereud facilis est er expedit distinct Nam libe soluta nobis eligent optio est congue nihil impedit doming id Lorem ipsum dolor sit amet consectetur adipiscing elit set eiusmod tempor incidunt et labore et dolore magna aliquam Ut enim ad minim veniam quis nostrud exerc Irure dolor in reprehend incididunt ut labore et dolore magna aliqua Ut enim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat
+
+Duis aute irure dolor in reprehenderit in voluptate velit esse molestaie cillum Tia non ob ea soluad incommod quae egen ium improb fugiend Officia deserunt mollit anim id est laborum Et harumd dereud facilis est er expedit distinct Nam liber te conscient to factor tum poen legum odioque civiuda et tam Neque pecun modut est neque nonor et imper ned libidig met consectetur adipiscing elit sed ut labore et dolore magna aliquam is nostrud exercitation ullam mmodo consequet
+
+Duis aute in voluptate velit esse cillum dolore eu fugiat nulla pariatur At vver eos et accusam dignissum qui blandit est praesent Trenz pruca beynocguon doas nog apoply su trenz ucu hugh rasoluguon monugor or trenz ucugwo jag scannar Wa hava laasad trenzsa gwo producgs su IdfoBraid yop quiel geg ba solaly rasponsubla rof trenzur sala ent dusgrubuguon Offoctivo immoriatoly hawrgasi pwicos asi sirucorThas sirutciun applios tyu thuso itoms ghuso pwicos gosi sirucor in mixent gosi sirucor ic mixent ples cak ontisi sowios uf Zerm hawr rwivos
+
+Unte af phen neige pheings atoot Prexs eis phat eit sakem eit vory gast te Plok peish ba useing phen roxas Eslo idaffacgad gef trenz beynocguon quiel ba trenz Spraadshaag ent trenz dreek wirc procassidt program Cak pwico vux bolug incluros all uf cak sirucor hawrgasi itoms alung gith cakiw nog pwicos Plloaso mako nuto uf cakso dodtos anr koop a cupy uf cak vux noaw yerw phuno Whag schengos uf efed quiel ba mada su otrenzr swipontgwook proudgs hus yag su ba dagarmidad Plasa maku noga wipont trenzsa schengos ent kaap zux copy wipont trenz kipg naar mixent phona Cak pwico siructiun ruos nust apoply tyu cak UCU sisulutiun munityuw uw cak UCU-TGU jot scannow
+
+Trens roxas eis ti Plokeing quert loppe eis yop prexs Piy opher hawers eit yaggles orn ti sumbloat alohe plok Su havo loasor cakso tgu pwuructs tyu InfuBwain ghu gill nug bo suloly sispunsiblo fuw cakiw salo anr ristwibutiun Hei muk neme eis loppe Treas em wankeing ont sime ploked peish rof phen sumbloat syug si phat phey gavet peish ta paat ein pheeir sumbloats
+
+Aslu unaffoctor gef cak siructiun gill bo cak spiarshoot anet cak GurGanglo gur pwucossing pwutwam Ghat dodtos ig pany gill bo maro tyu ucakw suftgasi pwuructs hod yot tyubo rotowminor Plloaso mako nuto uf cakso dodtos anr koop a cupy uf cak vux noaw yerw phuno Whag schengos uf efed quiel ba mada su otrenzr swipontgwook proudgs hus yag su ba dagarmidad Plasa maku noga wipont trenzsa schengos ent kaap zux copy wipont trenz kipg naar mixent phona Cak pwico siructiun ruos nust apoply tyu cak UCU sisulutiun munityuw uw cak UCU-TGU jot scannow Trens roxas eis ti Plokeing quert loppe eis yop prexs Piy opher hawers eit yaggles orn ti sumbloat alohe plok Su havo loasor cakso tgu pwuructs tyu
+
+Lorem ipsum dolor sit amet consectetur adipiscing elit set eiusmod tempor incidunt et labore et dolore magna aliquam Ut enim ad minim veniam quis nostrud exerc Irure dolor in reprehend incididunt ut labore et dolore magna aliqua Ut enim ad minim veniam quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat Duis aute irure dolor in reprehenderit in voluptate velit esse molestaie cillum Tia non ob ea soluad incommod quae egen ium improb fugiend Officia deserunt mollit anim id est laborum Et harumd dereud facilis est er expedit distinct Nam liber te conscient to factor tum poen legum odioque civiuda et tam Neque pecun modut est neque nonor et imper ned libidig met consectetur adipiscing elit sed ut labore et dolore magna aliquam is nostrud exercitation ullam mmodo consequet Duis aute in voluptate velit esse cillum dolore eu fugiat nulla pariatur At vver eos et accusam dignissum qui blandit est praesent Trenz pruca beynocguon doas nog apoply su trenz ucu hugh rasoluguon monugor or trenz ucugwo jag scannar Wa hava laasad trenzsa gwo producgs su IdfoBraid yop quiel geg ba solaly rasponsubla rof trenzur sala ent dusgrubuguon Offoctivo immoriatoly hawrgasi pwicos asi sirucor Thas sirutciun applios tyu thuso itoms ghuso pwicos gosi sirucor in mixent gosi sirucor ic mixent ples cak ontisi sowios uf Zerm hawr rwivos Unte af phen neige pheings atoot Prexs eis phat eit sakem eit vory gast te Plok peish ba useing phen roxas Eslo idaffacgad gef trenz beynocguon quiel ba trenz Spraadshaag ent trenz dreek wirc procassidt program Cak pwico vux bolug incluros all uf cak sirucor hawrgasi itoms alung gith cakiw nog pwicos
+
+Plloaso mako nuto uf cakso dodtos anr koop a cupy uf cak vux noaw yerw phuno Whag schengos uf efed quiel ba mada su otrenzr swipontgwook proudgs hus yag su ba dagarmidad Plasa maku noga wipont trenzsa schengos ent kaap zux copy wipont trenz kipg naar mixent phona Cak pwico siructiun ruos nust apoply tyu cak UCU sisulutiun munityuw uw cak UCU-TGU jot scannow Trens roxas eis ti Plokeing quert loppe eis yop prexs Piy opher hawers eit yaggles orn ti sumbloat alohe plok Su havo loasor cakso tgu pwuructs tyu InfuBwain ghu gill nug bo suloly sispunsiblo fuw cakiw salo anr ristwibutiun Hei muk neme eis loppe Treas em wankeing ont sime ploked peish rof phen sumbloat syug si phat phey gavet peish ta paat ein pheeir sumbloats Aslu unaffoctor gef cak siructiun gill bo cak spiarshoot anet cak GurGanglo gur pwucossing pwutwam Ghat dodtos ig pany gill bo maro tyu ucakw suftgasi pwuructs hod yot tyubo rotowminor Plloaso mako nuto uf cakso dodtos anr koop a cupy uf cak vux noaw yerw phuno Whag schengos uf efed quiel ba mada su otrenzr swipontgwook proudgs hus yag su ba dagarmidad Plasa maku noga wipont trenzsa schengos ent kaap zux copy wipont trenz kipg naar mixent phona Cak pwico siructiun ruos nust apoply tyu cak UCU sisulutiun munityuw uw cak UCU-TGU jot scannow Trens roxas eis ti Plokeing quert loppe eis yop prexs Piy opher hawers eit yaggles orn ti sumbloat alohe plok Su havo loasor cakso tgu pwuructs tyu

.vscode/dictionaries/miscellaneous.txt

@@ -0,0 +1,6 @@
+ABCDEFGHIJKLMNOPQRSTUVWXYZ
+iframes
+lerp
+nbem
+passw
+ROLLUP

.vscode/dictionaries/names.txt

@@ -0,0 +1,5 @@
+Crona
+Devuyst
+Giraudel
+Katakpawou
+Syntra

.vscode/dictionaries/php.txt

@@ -0,0 +1,2 @@
+isset
+Superglobals

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) [year] [fullname]
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,94 @@
+# Microblog
+
+## A - Lessons
+
+1. [Initiatie Docker](https://youtu.be/-iBQxXHRnHg)
+2. [Installatie Slim](https://youtu.be/fjKTdo9RTDs)
+3. [Slim eerste stappen](https://youtu.be/7DgeCaiB5tQ)
+4. [POST en Debugging](https://youtu.be/cotqB5U6qLg)
+5. [POST en GET Routes](https://youtu.be/l-3kF5xRzas)
+6. [POST/GET mep any routes en routeparams](https://youtu.be/axQha1RVnf8)
+7. [Start BLOG project](https://youtu.be/kaYlrMcg0O0)
+8. [Blog build-up](https://youtu.be/_-C3T57tpS8)
+9. [Add blog post](https://youtu.be/IKUmsY9AFkM)
+10. [SQL Injection](https://youtu.be/VawAKqLb9o4)
+11. [Namespaces](https://youtu.be/-RZEaAlMux0)
+12. [Namespaces toepassing](https://youtu.be/xElWefiIV_o)
+13. [Twig to module](https://www.youtube.com/watch?v=kPe29anSbzE&list=PLhlDbeB0Fznx6iTGsvCtHqP3aFI--COm7&index=7)
+14. [Twig templates](https://www.youtube.com/watch?v=MWkkS08_E9Y&list=PLhlDbeB0Fznx6iTGsvCtHqP3aFI--COm7&index=6)
+
+## B - Basic Commands Docker
+
+### B1 - Use composer
+
+```powershell
+docker run --rm -t -i -v ${PWD}:/app debaetsr/composer2 <the rest of the command>
+```
+
+### B2 - Install Slim
+
+1. Create a new folder
+
+2. Install Slim 4
+
+```powershell
+docker run --rm -t -i -v ${PWD}:/app debaetsr/composer2 require slim/slim:"4.\*"
+```
+
+3. Install PSR-7 implementation for use with Slim 4
+
+```powershell
+docker run --rm -t -i -v ${PWD}:/app debaetsr/composer2 require slim/psr7
+```
+
+3. Install Twig 3
+
+```powershell
+docker run --rm -t -i -v ${PWD}:/app composer require "twig/twig:^3.0"
+```
+
+4. Modify composer.json by adding the following just before the last parenthesis
+
+```json
+"config": {
+"platform-check": false
+}
+```
+
+5. Update Composer2
+
+```powershell
+docker run --rm -t -i -v ${PWD}:/app debaetsr/composer2 update
+```
+
+### B3 - Start PHP
+
+```powershell
+docker run --rm -t -i -v ${PWD}:/src -p 8080:8000 debaetsr/php_xdebug
+```
+
+### B4 - Use Debug
+
+1. If necessary, create a new launch.json file, and replace (or add) the "Listen for XDebug" with the following (note parentheses and commas):
+
+```json
+{
+"name": "Listen for XDebug",
+"type": "php",
+"request": "launch",
+"port": 9003,
+"pathMappings": { "/src": "${workspaceRoot}" }
+},
+```
+
+2. The first time when debugging, add this in the URL
+
+```txt
+?XDEBUG_SESSION_START=1
+```
+
+### B5 - Other
+
+```powershell
+php -S 0.0.0.0:8000 -t public
+```

composer.json

@@ -1,9 +1,15 @@
 {
     "require": {
         "slim/slim": "4.*",
-        "slim/psr7": "^1.5"
+        "slim/psr7": "^1.5",
+        "twig/twig": "^3.0"
     },
     "config": {
         "platform-check": false
+    },
+    "autoload": {
+        "psr-4": {
+            "Blog\\": "src/"
+        }
     }
-}
+}

composer.lock

@@ -4,7 +4,7 @@
         "Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
         "This file is @generated automatically"
     ],
-    "content-hash": "285ddc9ddeefce0b996c355da865d991",
+    "content-hash": "599b28b1091417b9a8e23442a8e6220a",
     "packages": [
         {
             "name": "fig/http-message-util",
@@ -677,17 +677,182 @@
             "time": "2021-10-05T03:00:00+00:00"
         },
         {
+            "name": "symfony/polyfill-ctype",
+            "version": "v1.24.0",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/symfony/polyfill-ctype.git",
+                "reference": "30885182c981ab175d4d034db0f6f469898070ab"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/symfony/polyfill-ctype/zipball/30885182c981ab175d4d034db0f6f469898070ab",
+                "reference": "30885182c981ab175d4d034db0f6f469898070ab",
+                "shasum": ""
+            },
+            "require": {
+                "php": ">=7.1"
+            },
+            "provide": {
+                "ext-ctype": "*"
+            },
+            "suggest": {
+                "ext-ctype": "For best performance"
+            },
+            "type": "library",
+            "extra": {
+                "branch-alias": {
+                    "dev-main": "1.23-dev"
+                },
+                "thanks": {
+                    "name": "symfony/polyfill",
+                    "url": "https://github.com/symfony/polyfill"
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "Symfony\\Polyfill\\Ctype\\": ""
+                },
+                "files": [
+                    "bootstrap.php"
+                ]
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Gert de Pagter",
+                    "email": "BackEndTea@gmail.com"
+                },
+                {
+                    "name": "Symfony Community",
+                    "homepage": "https://symfony.com/contributors"
+                }
+            ],
+            "description": "Symfony polyfill for ctype functions",
+            "homepage": "https://symfony.com",
+            "keywords": [
+                "compatibility",
+                "ctype",
+                "polyfill",
+                "portable"
+            ],
+            "support": {
+                "source": "https://github.com/symfony/polyfill-ctype/tree/v1.24.0"
+            },
+            "funding": [
+                {
+                    "url": "https://symfony.com/sponsor",
+                    "type": "custom"
+                },
+                {
+                    "url": "https://github.com/fabpot",
+                    "type": "github"
+                },
+                {
+                    "url": "https://tidelift.com/funding/github/packagist/symfony/symfony",
+                    "type": "tidelift"
+                }
+            ],
+            "time": "2021-10-20T20:35:02+00:00"
+        },
+        {
+            "name": "symfony/polyfill-mbstring",
+            "version": "v1.24.0",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/symfony/polyfill-mbstring.git",
+                "reference": "0abb51d2f102e00a4eefcf46ba7fec406d245825"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/symfony/polyfill-mbstring/zipball/0abb51d2f102e00a4eefcf46ba7fec406d245825",
+                "reference": "0abb51d2f102e00a4eefcf46ba7fec406d245825",
+                "shasum": ""
+            },
+            "require": {
+                "php": ">=7.1"
+            },
+            "provide": {
+                "ext-mbstring": "*"
+            },
+            "suggest": {
+                "ext-mbstring": "For best performance"
+            },
+            "type": "library",
+            "extra": {
+                "branch-alias": {
+                    "dev-main": "1.23-dev"
+                },
+                "thanks": {
+                    "name": "symfony/polyfill",
+                    "url": "https://github.com/symfony/polyfill"
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "Symfony\\Polyfill\\Mbstring\\": ""
+                },
+                "files": [
+                    "bootstrap.php"
+                ]
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "MIT"
+            ],
+            "authors": [
+                {
+                    "name": "Nicolas Grekas",
+                    "email": "p@tchwork.com"
+                },
+                {
+                    "name": "Symfony Community",
+                    "homepage": "https://symfony.com/contributors"
+                }
+            ],
+            "description": "Symfony polyfill for the Mbstring extension",
+            "homepage": "https://symfony.com",
+            "keywords": [
+                "compatibility",
+                "mbstring",
+                "polyfill",
+                "portable",
+                "shim"
+            ],
+            "support": {
+                "source": "https://github.com/symfony/polyfill-mbstring/tree/v1.24.0"
+            },
+            "funding": [
+                {
+                    "url": "https://symfony.com/sponsor",
+                    "type": "custom"
+                },
+                {
+                    "url": "https://github.com/fabpot",
+                    "type": "github"
+                },
+                {
+                    "url": "https://tidelift.com/funding/github/packagist/symfony/symfony",
+                    "type": "tidelift"
+                }
+            ],
+            "time": "2021-11-30T18:21:41+00:00"
+        },
+        {
             "name": "symfony/polyfill-php80",
-            "version": "v1.23.1",
+            "version": "v1.24.0",
             "source": {
                 "type": "git",
                 "url": "https://github.com/symfony/polyfill-php80.git",
-                "reference": "1100343ed1a92e3a38f9ae122fc0eb21602547be"
+                "reference": "57b712b08eddb97c762a8caa32c84e037892d2e9"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/symfony/polyfill-php80/zipball/1100343ed1a92e3a38f9ae122fc0eb21602547be",
-                "reference": "1100343ed1a92e3a38f9ae122fc0eb21602547be",
+                "url": "https://api.github.com/repos/symfony/polyfill-php80/zipball/57b712b08eddb97c762a8caa32c84e037892d2e9",
+                "reference": "57b712b08eddb97c762a8caa32c84e037892d2e9",
                 "shasum": ""
             },
             "require": {
@@ -741,7 +906,7 @@
                 "shim"
             ],
             "support": {
-                "source": "https://github.com/symfony/polyfill-php80/tree/v1.23.1"
+                "source": "https://github.com/symfony/polyfill-php80/tree/v1.24.0"
             },
             "funding": [
                 {
@@ -757,7 +922,83 @@
                     "type": "tidelift"
                 }
             ],
-            "time": "2021-07-28T13:41:28+00:00"
+            "time": "2021-09-13T13:58:33+00:00"
+        },
+        {
+            "name": "twig/twig",
+            "version": "v3.3.7",
+            "source": {
+                "type": "git",
+                "url": "https://github.com/twigphp/Twig.git",
+                "reference": "8f168c6ffa3ce76d1786b3cd52275424a3fc675b"
+            },
+            "dist": {
+                "type": "zip",
+                "url": "https://api.github.com/repos/twigphp/Twig/zipball/8f168c6ffa3ce76d1786b3cd52275424a3fc675b",
+                "reference": "8f168c6ffa3ce76d1786b3cd52275424a3fc675b",
+                "shasum": ""
+            },
+            "require": {
+                "php": ">=7.2.5",
+                "symfony/polyfill-ctype": "^1.8",
+                "symfony/polyfill-mbstring": "^1.3"
+            },
+            "require-dev": {
+                "psr/container": "^1.0",
+                "symfony/phpunit-bridge": "^4.4.9|^5.0.9|^6.0"
+            },
+            "type": "library",
+            "extra": {
+                "branch-alias": {
+                    "dev-master": "3.3-dev"
+                }
+            },
+            "autoload": {
+                "psr-4": {
+                    "Twig\\": "src/"
+                }
+            },
+            "notification-url": "https://packagist.org/downloads/",
+            "license": [
+                "BSD-3-Clause"
+            ],
+            "authors": [
+                {
+                    "name": "Fabien Potencier",
+                    "email": "fabien@symfony.com",
+                    "homepage": "http://fabien.potencier.org",
+                    "role": "Lead Developer"
+                },
+                {
+                    "name": "Twig Team",
+                    "role": "Contributors"
+                },
+                {
+                    "name": "Armin Ronacher",
+                    "email": "armin.ronacher@active-4.com",
+                    "role": "Project Founder"
+                }
+            ],
+            "description": "Twig, the flexible, fast, and secure template language for PHP",
+            "homepage": "https://twig.symfony.com",
+            "keywords": [
+                "templating"
+            ],
+            "support": {
+                "issues": "https://github.com/twigphp/Twig/issues",
+                "source": "https://github.com/twigphp/Twig/tree/v3.3.7"
+            },
+            "funding": [
+                {
+                    "url": "https://github.com/fabpot",
+                    "type": "github"
+                },
+                {
+                    "url": "https://tidelift.com/funding/github/packagist/twig/twig",
+                    "type": "tidelift"
+                }
+            ],
+            "time": "2022-01-03T21:15:37+00:00"
         }
     ],
     "packages-dev": [],
@@ -768,5 +1009,5 @@
     "prefer-lowest": false,
     "platform": [],
     "platform-dev": [],
-    "plugin-api-version": "2.1.0"
+    "plugin-api-version": "2.2.0"
 }

private/readme.md

@@ -0,0 +1 @@
+place for private files like dbase

public/index.php

@@ -1,57 +1,126 @@
 <?php
+
+namespace Blog;
+
+
+
 session_start();
 
 use Psr\Http\Message\ResponseInterface as Response;
 use Psr\Http\Message\ServerRequestInterface as Request;
 use Slim\Factory\AppFactory;
+use Blog\DB\User;
+use Blog\DB\Blog;
+use Blog\View\Twig;
 
 require __DIR__ . '/../vendor/autoload.php';
 
+$twig = new Twig('../templates');
+
+addNavbar();
+
 $app = AppFactory::create();
 
-function addNavbar($response)
-{
 
-    $response->getBody()->write("<html><head></head><body>");
-    if (isset($_SESSION['username'])) {
-        $response->getBody()->write('<div><a href="/">Index</a> | <a href="/blog/create">Create Blog</a> | <a href="/logout">Logout</a></div>');
-    } else {
-        $response->getBody()->write('<div><a href="/">Index</a> | <a href="/login">Login</a></div>');
-    }
-    return;
+
+function addNavbar()
+{
+    global $twig;
+
+    $urls = [
+        ["link" => "https://www.google.be", "name" => "Google"],
+        ["link" => "https://www.facebook.com", "name" => "Facebook"],
+        ["link" => "https://www.twiter.com", "name" => "Twitter"]
+    ];
+    $twig->addBlockVariable('navbar', ['urls' => $urls]);
 }
 
+
+
 function addFooter($response)
 {
     $response->getBody()->write('<div>Privacy statement | Cookie Policy | Contact</div>');
     $response->getBody()->write("</body></html>");
     return;
 }
+function init()
+{
+    $art1 = ["slug" => "artikel-1", "title" => "Dit is titel 1", "content" => "Lorem ipsum 1"];
+    $art2 = ["slug" => "artikel-2", "title" => "Dit is titel 2", "content" => "Lorem ipsum 2"];
+    $art3 = ["slug" => "artikel-3", "title" => "Dit is titel 3", "content" => "Lorem ipsum 3"];
+    $art4 = ["slug" => "artikel-4", "title" => "Dit is titel 4", "content" => "Lorem ipsum 4"];
+    $_SESSION['blogs'] = [$art1, $art2, $art3, $art4];
+}
 
 $app->get('/', function (Request $request, Response $response, array $args) {
+    if (!isset($_SESSION['blogs'])) {
+        init();
+    }
 
-    addNavbar($response);
-
-    $response->getBody()->write('<hr/><h1>Onze blog</h1>');
-    $response->getBody()->write('<ul>');
-    $response->getBody()->write('<li><a href="/blog/artikel-1">Blogartikel 1</a></li>');
-    $response->getBody()->write('<li><a href="/blog/artikel-2">Blogartikel 2</a></li>');
-    $response->getBody()->write('<li><a href="/blog/artikel-3">Blogartikel 3</a></li>');
-    $response->getBody()->write('<li><a href="/blog/artikel-4">Blogartikel 4</a></li>');
-    $response->getBody()->write('</ul>');
-    $response->getBody()->write('<hr/>');
-    addFooter($response);
+    $vars = [
+        "key" => "value",
+        'key2' => ["val1", "val2", "val3"],
+        "key3" => ["x1" => "y1", "x2" => "y2"],
+        "loggedIn" => isset($_SESSION['username']),
+        "content" => "Dit is de main body met info"
 
+    ];
 
+    global $twig;
+    $a =  $twig->render('index.html.twig', $vars);
+    $response->getBody()->write($a);
     return $response;
 });
 
+$app->map(['GET', 'POST'], '/blog/create', function (Request $request, Response $response, array $args) {
+    if (isset($_SESSION['username'])) {
+        if ($request->getMethod() == 'GET') {
+            addNavbar($response);
+            if (isset($_SESSION['error'])) {
+                $response->getBody()->write($_SESSION['error']);
+                $response->getBody()->write('<hr/>');
+                unset($_SESSION['error']);
+            }
+
+            // Opdracht : Toon reeds ingevoerde gegevens in geval van foutmelding
+            $response->getBody()->write('<form action="/blog/create" method="POST">');
+            $response->getBody()->write('<label for="slug">slug:</label>');
+            $response->getBody()->write('<input type="text" name="slug"/><br/>');
+            $response->getBody()->write('<label for="title">Titel:</label>');
+            $response->getBody()->write('<input type="text" name="title"/><br/>');
+            $response->getBody()->write('<label for="content">Inhoud:</label>');
+            $response->getBody()->write('<textarea type="textarea" name="content"></textarea><br/>');
+            $response->getBody()->write('<input type="submit"/>');
+            addFooter($response);
+        } else {
+            $data = $request->getParsedBody();
+            $blog = new Blog();
+
+            $res = $blog->createBlog($data);
+            if ($res) {
+                return $response->withHeader('Location', '/')->withStatus(302);
+            } else {
+                $err = $blog->lastErrorMsg();
+                $_SESSION['error'] = $err;
+                return $response->withHeader('Location', '/blog/create')->withStatus(302);
+            }
+        }
+    } else {
+        addNavbar($response);
+        $response->getBody()->write(('Please login'));
+        addFooter($response);
+    }
+    return $response;
+});
 
 $app->get('/blog/{slug}', function (Request $request, Response $response, array $args) {
 
     addNavbar($response);
-    $title = $args['slug'];
-    $response->getBody()->write("<h1>$title</h1>");
+    foreach ($_SESSION['blogs'] as $art) {
+        if ($art['slug'] == $args['slug']) {
+            $response->getBody()->write("<h1>" . $art['title'] . "</h1>");
+        }
+    }
 
     addFooter($response);
     return $response;
@@ -78,7 +147,11 @@ $app->map(['GET', 'POST'], '/login', function (Request $request, Response $respo
         addFooter($response);
     } else {
         $postdata = $request->getParsedBody();
-        if ($postdata['username'] == 'gebruiker' && $postdata['password'] == "abcd") {
+
+        $user = new User();
+        $logged_in = $user->checkUserPass($postdata['username'], $postdata['password']);
+        if ($logged_in) {
+            //if ($postdata['username'] == 'gebruiker' && $postdata['password'] == "abcd") {
             $_SESSION["username"] = $postdata['username'];
             addNavbar($response);
             $response->getBody()->write('Logged in');
@@ -96,9 +169,6 @@ $app->post('/postcomment', function (Request $request, Response $response, array
     return $response;
 });
 
-$app->post('/blog/create', function (Request $request, Response $response, array $args) {
-    $response->getBody()->write("Blog create");
-    return $response;
-});
+
 
 $app->run();

src/DB/Blog.php

@@ -0,0 +1,18 @@
+<?php
+
+namespace Blog\DB;
+
+
+class Blog extends DB
+{
+    public function createBlog($data)
+    {
+        $this->enableExceptions(false);
+        $stmt = $this->prepare("INSERT INTO blogs (slug, title, content) VALUES (:slug, :title, :content)");
+        $stmt->bindValue(':slug', $data['slug'], SQLITE3_TEXT);
+        $stmt->bindValue(':title', $data['title'], SQLITE3_TEXT);
+        $stmt->bindValue(':content', $data['content'], SQLITE3_TEXT);
+        $res = $stmt->execute();
+        return $res;
+    }
+}

src/DB/DB.php

@@ -0,0 +1,13 @@
+<?php
+
+namespace Blog\DB;
+
+use SQLite3;
+
+class DB extends SQLite3
+{
+    function __construct()
+    {
+        $this->open('../private/test.db');
+    }
+}

src/DB/User.php

@@ -0,0 +1,21 @@
+<?php
+
+namespace Blog\DB;
+
+use Blog\DB\DB;
+
+class User extends DB
+{
+    public function checkUserPass($user, $pass)
+    {
+        $sql = "SELECT count(*) as count FROM users WHERE username = '" . $user . "' AND password = '" . $pass . "';";
+        $ret = $this->query($sql);
+        $rows = $ret->fetchArray(SQLITE3_ASSOC);
+        $rowcount = $rows['count'];
+        if ($rowcount == 1) {
+            return true;
+        } else {
+            return false;
+        }
+    }
+}

src/View/Twig.php

@@ -0,0 +1,40 @@
+<?php
+
+namespace Blog\View;
+
+use Twig\Loader\FilesystemLoader;
+use Twig\Environment;
+
+class Twig
+{
+
+    protected $twig;
+    protected $variables;
+
+    public function __construct($tmpl_folder)
+    {
+        $loader = new FilesystemLoader($tmpl_folder);
+        $this->twig = new Environment($loader, []);
+        $this->variables = ['navbar' => [], 'messages' => [], 'footer' => []];
+    }
+
+    protected function load($tmpl)
+    {
+        return $this->twig->load($tmpl);
+    }
+
+    // add block variables to the global variable bag
+    public function addBlockVariable($block, $data)
+    {
+        $current = $this->variables[$block];
+        $new = array_merge($current, $data);
+        $this->variables[$block] = $new;
+    }
+
+    public function render($tmpl, $vars)
+    {
+        $template = $this->load($tmpl);
+        $variables = array_merge($this->variables, $vars);
+        return $template->render($variables);
+    }
+}

templates/base.html.twig

@@ -0,0 +1,10 @@
+<html>
+  <body>
+    <div id="navbar">
+      {% block navbar %} {% include "navbar.html.twig" %} {% endblock %}
+    </div>
+    <div id="messages">{% include "messages.html.twig" %}</div>
+    <diV id="main"> {% block main %}{% endblock %} </diV>
+    <div id="footer">{% block footer %}{% endblock %}</div>
+  </body>
+</html>

templates/index.html.twig

@@ -0,0 +1,8 @@
+{% extends "base.html.twig" %} 
+
+
+{% block main %}
+
+{{ content }}
+
+{% endblock %} 

templates/messages.html.twig

@@ -0,0 +1,5 @@
+<div>
+    {% for msg in messages.msgs %}
+      {{ msg.type }} - {{ msg.text }} </br>
+    {% endfor %}
+</div>

templates/navbar.html.twig

@@ -0,0 +1,9 @@
+<div>
+  <ul>
+    {% for url in navbar.urls %}
+    <li>
+      <a href="{{ url.link }}">{{ url.name }} </a>
+    </li>
+    {% endfor %}
+  </ul>
+</div>