Resilienz-Kongress - an online summit / conference

[joshua]

We recently launched the website “Resilienz-Kongress”, which is kind of an online summit / online conference about resilience (only in German language). The users can register as a participant and will receive daily emails during the conference timeframe with a conference room link for each day. Within this virtual conference room the participants can watch several interviews with experts and exchange ideas via comments.
This concept is especially during the COVID-19 lockdown an interesting possibility for idea exchanges.

Some technical details:
    •    ProcessWire 3.0.155+
    •    ProCache
    •    ProFields (RepeaterMatrix)
    •    PrivacyWire
    •    Seo Maestro
    •    WireMail SendGrid
    •    CodyFrame UI Framework
    •    CopeCart (as the E-Commerce API)
    •    Git, Node, Yarn, Gulp, PostCSS, Autoprefixer for a modern workflow combined with our individual local <-> stage <-> live environment and sync helper build with Python

We heavily used the ability to specify custom Page classes (introduced in PW 3.0.152) and a lot of custom helper classes for cleaner code.
Every frontend user registration with double opt-in is linked with the SendGrid API.

The login process for frontend users is quite individual as we wanted to integrate a password-free login method similar to “Magic Links”.
To achieve this we developed a “FrontendUserManagement” Class, which takes care of all the magic in the background. I’ll write another article about this topic as soon as I find the time, as I like the idea to implement this solution also as an open-source ProcessWire module.

For the after-selling area we used CopeCart as our cart system with their IPN. With this combination we don’t have to handle the billing process at all. Also a clean cross-device affiliate tracking system between CopeCart, ProcessWire and SendGrid is integrated even though we’re currently not using the affiliate system at all.

As frontend framework we used CodyFrame with an intense usage of CSS Custom Properties (for modern browsers with a classic fallback CSS for old browsers).

https://www.resilienz-kongress.de/

[Ivan Gretsky]

The read is as cool as the site @joshua!

Could you share some more details (and maybe even code) about this:

20 hours ago, joshua said:

a modern workflow combined with our individual local <-> stage <-> live environment and sync helper build with Python

and this:

We heavily used the ability to specify custom Page classes (introduced in PW 3.0.152) and a lot of custom helper classes for cleaner code.

[joshua]

Thank you! ?

Yes, sure, I can give some examples. The workflow is getting refactored right now, so I can't show any specific details, but I'll describe the process.

A quite simple example for a tiny helper class is this Headline Class for rendering headlines without risking to use more than one <h1> tag per page call:

I like to use this on content heavy pages (e.g. within RepeaterMatrix Elements) where I want to be sure to not have more than one <h1>. By default only the first call of this helper method returns the <h1> tag, all the others an <h2> (unless otherwise specified with $sizeTag).

To output a headline with this, simply use

<?php echo Headline::render($page->headline); ?>

I also have some helpers for rendering responsive (lazy loading) images or buttons and in this project most of the business logic of the "magic link" login is within one of these helper functions. Currently I require these classes manuelly within the ready.php

include_once($_SERVER['DOCUMENT_ROOT'] . "/site/templates/helpers/Headline.php");
include_once($_SERVER['DOCUMENT_ROOT'] . "/site/templates/helpers/Image.php");
include_once($_SERVER['DOCUMENT_ROOT'] . "/site/templates/helpers/Link.php");
include_once($_SERVER['DOCUMENT_ROOT'] . "/site/templates/helpers/FrontendUserManagement.php");
include_once($_SERVER['DOCUMENT_ROOT'] . "/site/templates/helpers/CopeCartHandler.php");

But I definitely want to dig deeper into autoloading them.
I want to refactor especially my Link and Image helper soon, perhaps I'll explain them afterwards further...

As example for the custom Page Class here is an extract from my SpeakerPage:

 

My Workflow Local <-> Stage <-> Live

Our webserver uses Plesk Onyx as the hosting control panel. For each web project we create a separate "subscription" where the stage and live domain will live.
For the dev / stage domain we use the plesk integrated git repo as dev branch. The live domain gets connected to the master branch of the same repo.

As we exclude a lot of files in git (e.g. the whole /wire/ directory or the assets and module directories) we had to find a solution to copy them between stages. I'll come to that point later again.

In my local environment I'm using MAMP Pro for the server environment. After pulling everything from the dev branch, we need also pull the database and exluded files / directories. To do so, the python script connects itself via SSH to the server and dumps the database, creates the same database locally and imports its contents.
The files / directories will be pulled as zip files and extracted locally. Our first try here was to use rsync, but with asset-heavy pages this can take quite a while to copy...

During development we usually do all the database-related stuff in the staging environment and just pull the database with our Python CLI script.
When we need to pull also modules or the wire dir, our CLI script can handle that as well.
Our content-editors mostly work in the staging environment ( on new web projects) or directly in the live environment (on existing projects).

I'll definitely write an in-depth article about this, as soon as we have refactored it completely! Then I can also show some code snippets or even publish it, we'll see.

[Ivan Gretsky]

I am using rsync to copy files between local and prod envs. Making an automation script was sitting in my todo list for way too long. So eagerly waiting for the sequel)