Gemakkelijk in gebruik voor zowel developers als eindgebruikers. Dat is de missie van Servconnect3. Dit jaar brengen we de uitgebreide Servconnect 3 SDK uit voor web ontwikkelaars. De SDK bestaat uit de volgende tools voor ontwikkelaars:
- Uitgebreide documentatie: Voor alle details over klassen, helper functies en de werking van componenten in de Servconnect hebben we een uitgebreide, makkelijk te volgen documentatie geschreven. Deze documentatie wordt voor de release van de SDK vrijgegeven op een aparte 'Servconnect Dev'-website.
- Sjablonen voor interfaces: Geef een kickstart aan je nieuwe app door een sjabloon te gebruiken. Sjablonen en voorbeelden van code zullen beschikbaar zijn via de 'Servconnect Dev'-website en 'Servconnect Dev for Visual Studio Code'.
- Tools voor Visual Studio Code: Het overgrote gedeelte van web ontwikkelaars gebruikt Visual Studio Code van Microsoft om code in te schrijven. Visual Studio Code is snel de open-source gold standard geworden van elke ontwikkelaar. Met 'Servconnect Dev for Visual Studio Code' brengen we tools voor het inpakken en ondertekenen van app pakketten direct naar Visual Studio Code. Zo is het mogelijk om met één druk op de knop je app testen in een lokale Servconnect-installatie.
Servconnect Dev for Visual Studio Code
Voor de nieuwe generatie Servconnect-apps willen we graag een stapje verder gaan. In Servconnect 2 moest je zelf je apps inpakken, ondertekenen, installeren in Servconnect en nog meer dingen doen die prima geautomatiseerd konden worden. We hebben gekozen voor het ontwikkelen van een extensie voor Visual Studio Code, omdat bijna (elke) web developer er mee werkt en het een ontzettend fijn ecosysteem heeft.
Servconnect Dev for Visual Studio Code zal te downloaden zijn in de Extension Marketplace in VS Code, net zoals elke andere extensie.
Een aantal hoogtepunten:
- No-Click Run: Heb je een verandering in de code gemaakt? Wanneer je het document opslaat stuurt Servconnect Dev automatisch op de achtergrond de wijzigingen door naar je lokale Servconnect-installatie. Staat de app op dat moment ook open in een browser? Dan ververst Servconnect gelijk en opent je app, zodat je je app kunt testen.
- Sjablonen: Krijg een voorsprong door een sjabloon te kiezen tijdens het maken van de app. Je krijgt alle source code, inclusief comments om uit te leggen wat elk klein dingetje doet.
- Koppel met Servconnect3: Koppel je lokale Servconnect-installatie aan Servconnect Dev om Servconnect in 'Developer Mode' te zetten. Je krijgt dan toegang tot het uitvoeren van allerlei handige tools die je helpen je applicatie te debuggen. Ook wordt je nieuwe app automatisch bij elke kleine wijziging geïnstalleerd en uitgevoerd.
- Upload naar Servconnect Marketplace: Je kunt direct updates naar de Servconnect Marketplace pushen zodat 'normale' gebruikers kunnen updaten. Het inpakken en ondertekenen van je '.scapp'-pakket wordt automatisch voor je geregeld middels je Servconnect Dev-account.
- IntelliSense Auto Completion: De documentatie en auto complete wordt samen met de Servconnect Dev extensie geïnstalleerd. Je hebt alle documentatie direct in VS Code en met VS Code IntelliSense wordt snel code schrijven een fluitje van een cent.
Verschillen tussen Servconnect en WordPress
WordPress heeft zelf een waslijst aan moeilijk te onthouden interne functies. Servconnect heeft echter een veel, maar dan ook veel, betere structuur als het gaat om plaatsing van functionaliteit.
WordPress heeft bijna alleen maar globale functies, Servconnect werkt exclusief met klassen om je eigen code niet in de weg te zitten. Elke keer dat je een interne functie van Servconnect wilt benaderen begin je met Servconnect::. Vervolgens heb je een paar mogelijkheden:
Servconnect::$accounts->{functie}: Alle functionaliteit met betrekking tot Servconnect Accounts ('Personen' genoemd in Servconnect zelf).Servconnect::$files->{functie}: Alle functionaliteit met betrekking tot bestanden zoals foto's en fotoalbums.Servconnect::$mail->{functie}: Alle functionaliteit met betrekking tot e-mail; van verzenden en ontvangen tot opmaken en maillijsten.Servconnect::$platforms->{functie}: Alle functionaliteit met betrekking tot gekoppelde platformen zoals Facebook.Servconnect::$services->{functie}: Alle functionaliteit met betrekking tot Services, aangeboden door Servconnect Apps.
Het mooiste is dat je nergens in je code een global hoeft te definiëren. Wil je bijvoorbeeld een geüploade afbeelding automatisch om laten zetten naar .webp, .jpg en .png in verschillende formaten (thumbnail, small, medium, large en original)? Dan is Servconnect::$files->convertUploadedFile(); het enige wat je hoeft te callen. De foto's worden automatisch voor je als bestanden en in de interne Servconnect database opgeslagen, zodat je ze gelijk kunt gebruiken in bijvoorbeeld img tags. Sterker nog, aangezien Servconnect al weet dat het jouw app is die deze functie gebruikt, zet Servconnect de omgezette bestanden automatisch voor je in het album van je app en maakt het beschikbaar via Servconnect FileSync en Servconnect Bestanden-app in Servconnect. Dit alles met een lijn code van nog geen 50 karakters lang. Wil je deze foto's later allemaal nog eens bekijken? Dan heb je alleen de AlbumUID nodig om alle foto's in een album terug te halen met Servconnect::$files->getAlbumByUID({AlbumUID});.
We willen dat je aan het einde van de rit minder code schrijft om meer gedaan te krijgen, zonder dat het negatieve gevolgen heeft voor snelheid en leesbaarheid van je code. Gelukkig is voor de snelheid Servconnect Engine in het leven geroepen.
Servconnect Engine
Dit is de core van Servconnect waar alle vertrouwde interne tools in draaien. Servconnect Engine regelt bestanden, output, welke apps worden geladen en zorgt voor de updates. Er wordt niets geladen tenzij Servconnect Engine aangeeft dat er iets geladen moet worden. Klassen, apps en tools binnen Servconnect worden pas geladen wanneer een script er om vraagt.
Admin Environment
Met één lijn code controleer je of je script in de Servconnect Admin omgeving of op een andere plek, zoals een website, draait. Het is zo simpel als controleren of Servconnect::isAdmin(); 'false' is. Krijg je iets anders terug dan 'false'? Dan weet je voor honderd procent zeker dat je script is aangeroepen door iemand die met een Servconnect Account aangemeld is, zich in Servconnect bevindt en de bevoegdheid heeft om iets te wijzigen.
Servconnect Runtime
De Servconnect Runtime is de combinatie van JavaScript in de admin omgeving (Servconnect) en alle componenten en functionaliteit die daar bij hoort. Wij moedigen ontwikkelaars aan om interfaces en designs speciaal voor andere portalen, zoals websites, te maken. Daarom heeft Servconnect geen componenten voor bijvoorbeeld de website of een iOS- of Android-app.
De Servconnect Runtime blijft wel beschikbaar voor de backend PHP-scripts, zoals het grootste gedeelte van de Servconnect:: functionaliteit. Zo is het bijvoorbeeld nog steeds mogelijk om foto's die geüpload zijn vanaf de website in één keer om te zetten in verschillende formaten en automatisch in een album te plaatsen via Servconnect::$files->convertUploadedFile();.
Servconnect App Services
Je kunt andere apps niet vanuit je eigen app aanroepen. Je kunt wel een gedeelte van een App aanroepen via een zogenoemde Service. Apps kunnen services aanbieden aan alle, of alleen bepaalde apps. Wanneer een Service wordt aangeroepen wordt alleen een klein gedeelte van een app ingeladen wat nodig is om alle functies in een Service te laten functioneren.
Voorbeeld:
Stel, je wilt een gedeelte van je app open stellen zodat alleen Servconnect Accounts het kan gebruiken om te laten zien op de website. Servconnect Accounts heeft in dit geval documentatie over het toevoegen van een nieuw gedeelte op de 'Mijn Account' pagina op de Website. Ik geef in mijn app.json bestand aan waar mijn Service te vinden is en wat het doet:
...
"services": [
{
"appID": 2, // Ik wil het aanbieden aan de Servconnect Accounts-app.
"type": "sidebar", // Het type Service. Dit kan voor elke app verschillend zijn.
"class": "servconnectShowroomClientSidebar", // De naam van de klasse waarin de code zich bevindt.
"data": { // Data object. Kan voor elke app verschilend zijn.
"uri": "/showroom/tradein" // Welke url ik wil gebruiken. Bijv. mijnwebsite.nl/account/showroom/tradein
},
"location": "/services/accounts/common" // De locatie van mijn script.
},
{
"appID": 2,
"type": "dashboard", // Dit moet een sectie worden in het 'Mijn Account - Dashboard' gedeelte.
"class": "servconnectShowroomClientDashboard",
"location": "/services/accounts/common"
},
{
"appID": 2,
"type": "page", // Ik geef aan dat deze klasse de pagina bevat waar men naar toe moet worden geleid.
"class": "servconnectShowroomClientTradeInListPage",
"data": {
"uri": "/showroom/tradein"
},
"location": "/services/accounts/tradein/list"
}
],
.../services/accounts/common(.php)
servconnectAccountsSidebar is een klasse die door Servconnect Accounts is samengesteld om items in de zijbalk toe te voegen.
<?php
// servconnectShowroomClientSidebar is aangegeven in app.json.
class servconnectShowroomClientSidebar extends servconnectAccountsSidebar {
public function __construct() {
parent::__construct();
$this->sidebarTitle = ["nl" => "Showroom", "en" => "Showroom"];
$this->sidebarItems = [
[
"title" => ["en" => "Trade-in", "nl" => "Inruil"],
"uri" => "/showroom/tradein",
"icon" => "repeat"
]
];
}
}
// servconnectShowroomClientDashboard is aangegeven in app.json.
class servconnectShowroomClientDashboard extends servconnectAccountsDashboard {
public function __construct() {
parent::__construct();
$this->dashboardSection = new _pageSection();
$showroomBoxGrid = new _pageBoxGrid(["en" => "Showroom", "nl" => "Showroom"]);
$showroomTradeInBox = new _pageBox(
[
"en" => "Trade-in Requests", "nl" => "Inruilverzoeken"
], [
"en" => "View and track all your current and previous trade-in requests.",
"nl" => "Bekijk uw inruilverzoeken."
], [
"en" => "View",
"nl" => "Bekijk",
"more" => true,
"href" => "/showroom/tradein"
]);
$showroomBoxGrid->add($showroomTradeInBox);
$this->dashboardSection->add($showroomBoxGrid);
}
}
?>Met nog geen 100 lijnen code heb je een sectie op het 'Mijn Account' dashboard aangemaakt en een item in ze zijbalk toegevoegd.
Servconnect Accounts gebruikt gestructureerde Services, dus alleen Services die een klasse van Servconnect Accounts 'extenden'. Je kunt ook ongestructureerde Services maken met je eigen klassen. Je kunt je Service zelfs richten aan alle apps in Servconnect. Echter beslist een app zelf wat het met een Service doet. Je kunt bijvoorbeeld wel een Service richten aan Servconnect Showroom, maar omdat het nergens gebruik maakt van Services, zie je deze nergens in terug. Op deze manier blijft je app altijd de touwtjes in handen houden.
Databases in Servconnect
Servconnect werkt exclusief met geoptimaliseerde SQLite databases. We hebben hier voor gekozen om:
- Elke app een eigen database te geven: Elke app in Servconnect heeft een eigen database die automatisch indexes voor je aanmaakt op basis van wat je het meeste gebruikt. Elke app leeft hiermee in een eigen silo en kan niet bij de gegevens van andere apps.
- Stabiliteit te waarborgen: Omdat elke app een eigen database heeft, is het niet erg wanneer één app crasht of niet meer werkt om wat voor reden dan ook. De app zelf is dan misschien kapot, maar Servconnect en de portalen blijven gewoon werken.
- Reservekopieën te kunnen maken: Aangezien SQLite een systeem is wat werkt met bestanden in plaats van een database server, kan Servconnect zonder problemen back-ups maken en terugzetten. Sterker nog, omdat elke app een eigen database heeft kan Servconnect database reservekopieën maken per app; wanneer er een reservekopie van een app database teruggezet moet worden, blijven Servconnect en andere apps intact. Zo voorkomen we ook dataverlies.
Servconnect WP Compatibility Layer
We raden alle ontwikkelaars die starten met een nieuw project, deze vanaf het begin af aan te ontwikkelen met de native Servconnect SDK. Voor legacy projecten en om een grote kickstart te geven aan de hoeveelheid apps voor Servconnect zijn we begonnen met research & development van een 'Compatibility Layer' voor reeds bestaande WordPress plugins.
Hiermee willen we gebruikmaken van het beste wat WordPress te bieden heeft; het plugin ecosysteem.
Wanneer?
We kunnen niet wachten om te zien wat ontwikkelaars creëren voor Servconnect. Dit is alleen nog maar het begin.
De Servconnect Dev website en Servconnect Dev for Visual Studio Code zijn voor het einde van 2023 beschikbaar. Houd onze website in de gaten voor meer informatie, we kunnen niet wachten om te zien wat je maakt in het krachtige Servconnect.