SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni...

28
ISSN: 2211-6486 ONDERWERPEN: Veilige toegang tot resources met Managed Server Identity Ontwikkelen voor de Microsoft Hololens (deel 1) Building a Chrome Extension Understanding the FireDAC Indexes Properties Nummer 136 December 2018 SDN Magazine verschijnt elk kwartaal en is een uitgave van Software Development Network SDN Magazine is hét lijfblad van en voor programmeurs, met artikelen over ontwikkelen voor Windows, Web, Mobile of Cloud. Of u nu ontwikkelt voor .NET, Delphi of iets anders, als lid van het SDN weet u alles. SDN MAGAZINE KNOW- LEDGE#136 IN DIT NUMMER BIJDRAGEN VAN O.A.: Gerald Versluis Cary Jensen Jan de Vries Roy Janssen

Transcript of SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni...

Page 1: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

ISS

N: 2211-6486

ONDERWERPEN:

Veilige toegang tot resources metManaged Server Identity

Ontwikkelen voor de Microsoft Hololens

(deel 1)

Building a Chrome Extension

Understanding the FireDAC Indexes Properties

Nummer 136 December 2018 SDN Magazine verschijnt elk kwartaal en is een uitgave van Software Development Network

SDN Magazine is hét lijfblad van en voor programmeurs, met artikelen over ontwikkelen voor Windows, Web, Mobile of Cloud. Of u nu ontwikkelt voor .NET, Delphi of iets anders, als lid van het SDN weet u alles.

SDN MAGAZINEKNOW-LEDGE#136

IN DIT NUMMER BIJDRAGEN VAN O.A.:

Gerald Versluis

Cary Jensen

Jan de Vries

Roy Janssen

Page 3: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

magazine voor software development 3

ColofonUitgaveSoftware Development NetworkZesentwintigste jaargangNo. 136 • december 2018

Bestuur van SDNMarcel Meijer, voorzitterRob Suurland, penningmeesterRemi Caron, secretaris

RedactieMarcel Meijer ([email protected])

Aan dit magazine werd meegewerkt doorRoel Hans Bethlehem, Bob Swart, Maarten van Stam, Arjen Bos, Fanie Reynders, Rob Suurland, Remi Caron, Marcel Meijer en natuurlijk alle auteurs!

ListingsZie de website www.sdn.nl voor eventuele source files uit deze uitgave.

ContactSoftware Development NetworkPostbus 506 7100 AM WinterswijkTel. (085) 21 01 [email protected]

Vormgeving en opmaakReclamebureau Bij Dageraad Winterswijk www.bijdageraad.nl

©2018 Alle rechten voorbehouden. Niets uit deze uitgave mag worden overgenomen op welke wijze dan ook zonder voorafgaande schrifte-lijke toestemming van SDN. Tenzij anders vermeld zijn artikelen op persoonlijke titel geschreven en verwoorden zij dus niet noodzake-lijkerwijs de mening van het bestuur en/of de redactie. Alle in dit maga-zine genoemde handelsmerken zijn het eigendom van hun respectieve-lijke eigenaren.

AdverteerdersAchmea . . . . . . . . . . . . . . . . . . . . . 2Futuretech . . . . . . . . . . . . 32

AdverterenInformatie over adverteren en de advertentietarieven kunt uvinden op www.sdn.nl onder de rubriek Magazine.

voorwoord

SDN MAGAZINEKNOW-LEDGE#136

Over Marcel Meijer:

Marcel Meijer is Freelance (Enterprise) Architect, Teamlead, CTO, CTO Advisor of interim manager. Daarnaast is Marcel voorzitter, bestuurslid, event organisator en eindredacteur bij de SDN. Sinds 2010 mag hij zich MVP noemen.

Beste SDN Magazine lezer, Het jaar is bijna voorbij en dit is het derde magazine van 2018. Afgelopen jaar is er weer veel gebeurd in het IT-landschap. Verschillende nieuwe producten of aangepaste producten zowel op hardware als op softwaregebied. De veranderingen gaan snel en dat zal in 2019 niet stoppen. Op het gebied van telefoons komen er nog diverse veranderingen met dubbele schermen, grotere schermen, beschrijfbare schermen, klapbare schermen etc. Nog meer AI en nog meer verschillende assistenten in de vorm van tools of bots zullen onze leven binnenkomen. Ook in de automobielindustrie zal de vooruitgang niet stil komen te staan. Naast de Tesla en Leaf zullen ook de andere grote merken met elektrische auto’s komen. Hoe disruptief deze dan zullen zijn, dat zal de toekomst uitwijzen. Het zal in elk geval steeds lastiger worden om niet connected te zijn. Ons hele leven wordt nu al beheerst door de pingeltjes, bliepjes, badges en andere aandachttrekkers. Kom volgend jaar naar onze events om op de hoogte blijven over de laatste ontwikkelingen en volg de SDN Cast voor de wekelijkse update. Ik nodig iedereen van harte uit om je kennis te delen met andere, als je kunt delen dan kun ook vermenigvul-digen. Bijvoorbeeld door artikelen te schrijven voor het SDN-magazine! In dit magazine artikelen over toegang met Managed Server Identity, deel 1 over het ontwikkelen voor HoloLens, je eigen Chrome Extension en een deepdive in FireDAC Indexes Properties geschreven door onze collega’s. De auteurs Jan de Vries, Roy Janssen, Gerald Versluis en Cary Jensen geven allemaal een inkijkje in hun ervaringen. Bedankt schrijvers, ik heb er weer veel van geleerd. Veel leesplezier en tot ons volgende event of uitzending van de SDN Cast. Wil je schrijven of spreken of meedoen aan onze cast meld je dan op [email protected]. Namens de SDN medewerkers alvast fijne feestdagen en een goed 2019! Groeten,

Marcel MeijerEindredacteur Magazine en Voorzitter SDN

Page 4: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

AGENDA 2019

13 Maart FutureTechConferenceJaarbeurs Utrecht

26 Januari dotNed Saturday Veenendaal

12 April SDN event 1Zeist

14 Juni SDN event 2Zeist

Medio Oktober Techorama Nederland Ede

4-8 November IgniteOrlando Florida

13 December SDN event 3Zeist

SDN MAGAZINEKNOW-LEDGE#136

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

4

Page 5: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

Inhoud

03 Voorwoord Marcel Meijer

05 Inhoudsopgave

06 Veilige toegang tot resources met Managed Server Identity Jan de Vries

10 Ontwikkelen voor de Microsoft HoloLens (deel 1) Roy Janssen

17 Building a Chrome Extension Gerald Versluis

21 Understanding the FireDAC Indexes Properties Cary Jensen

magazine voor software development 5

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

Page 6: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

VEILIGE TOEGANG TOT RESOURCES MET

Managed Service Identity

Jan de Vries

Page 7: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

Voordat Managed Service Identity beschikbaar was werkte je als het goed is al op een vergelijkbare manier. Wat je dan moest doen is een nieuwe identiteit maken binnen de AAD en de unieke identifier (Object Id) gebruiken om andere services te benaderen. Uiteraard moest deze applicatie identiteit dan wel voldoende rechten krijgen op de andere resource(s) binnen het Azure landschap om die services ook daadwerkelijk te kunnen benaderen.Dit is allemaal prima te doen, maar vergt wel enige ervaring in het opzetten van een veilige cloud omgeving.Omdat men bij Microsoft Azure graag wil dat we allemaal op een zo veilig mogelijke manier werken, falling in the pit of success, is bovenstaande nu volledig geautomatiseerd. Het enige dat je nog zelf hoeft te doen is de feature te activeren binnen jouw service en je bent al bijna klaar. Onderwater is dit allemaal best complexe materie, maar door de huidige implementatie van de Managed Service Identity feature kan eigenlijk iedereen het relatief eenvoudig in gebruik nemen.

Hoe dan?Termen als ‘relatief eenvoudig’ en ‘automatisch’ klinkt natuurlijk mooi, maar wat moet je er dan echt voor doen?De eerste stap is het activeren van de feature. Dit kan uiteraard via de Azure Portal. Er is zelfs een speciale blade ingericht voor dit onderdeel.

Uiteraard is dat niet de manier hoe wij professionals te werk willen gaan. De Azure Portal zou alleen als een read-only omgeving beschouwd moeten worden.Wat moeten we dan wel doen als eerste stap? Nou, dat is een nieuwe property toevoegen in het ARM-template dat je gebruikt om je volledige Azure omgeving uit te rollen. Er is de property `identity` geïntroduceerd waar je mee kunt aangeven of je wel of geen MSI wilt gebruiken. Wil je MSI gebruiken, stel deze dan als volgt in.

“identity”: {

“type”: “SystemAssigned”

}

Na uitrol van jouw template zal er een identiteit van jouw service in de AAD zijn aangemaakt.Heb je geen behoefte meer in het gebruik van MSI, verwijder de volledige property dan weer. Na een uitrol zal MSI worden gedeactiveerd en de identiteit van de applicatie wordt ook uit de AAD verwijderd.Als voorbeeld, een stukje uit een ARM-template dat verantwoordelijk is voor het aanmaken van een Azure App Service met MSI.

{

“apiVersion”: “2015-08-01”,

“name”: “[parameters(‘webSiteName’)]”,

“type”: “Microsoft.Web/sites”,

“kind”: “functionapp”,

“location”: “[resourceGroup().location]”,

“identity”: {

“type”: “SystemAssigned”

},

“dependsOn”: [

“[resourceId(‘Microsoft.Web/serverFarms/’, pa

rameters(‘hostingPlanName’))]”,

“[resourceId(‘Microsoft.Storage/

storageAccounts/’, variables(‘storageAccountName’))]”

],

“tags”: {

“[concat(‘hidden-related:’, resourceGroup().

id, ‘/providers/Microsoft.Web/serverfarms/’, paramete

rs(‘hostingPlanName’))]”: “empty”,

“displayName”: “Website”

},

“properties”: {

“name”: “[parameters(‘webSiteName’)]”,

“serverFarmId”: “[resourceId(‘Microsoft.Web/

serverfarms’, parameters(‘hostingPlanName’))]”

}

}

Na het uitrollen van jouw template zul je in de AAD Audit Log zien dat er enkele nieuw regels zijn toegevoegd, namelijk dat er een nieuwe Service Principal is aangemaakt! Uiteraard kan er op deze regels worden geklikt om meer details te tonen van het specifieke proces. Mijn inzien niet heel interessant, totdat er iets fout gaat natuurlijk.

Er is binnen Azure een relatief nieuwe feature toegevoegd, namelijk Managed Service Identity. Het is onderdeel van de Azure Active Directory en zorgt ervoor dat voor jouw ‘applicatie’ een Identity wordt gemaakt waarmee je andere resources binnen Azure kunt benaderen.

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

magazine voor software development 7

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

F I G U U R 1

Page 8: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

8

| | | | | | | | | | | | | | | | | | | | | | |Serverless integration:

Logic Apps en Functions

nn

nn

nn

nn

nn

nn

nn

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

8

| | | | | | | | | | | | | | | | | | | | | | |VEILIGE TOEGANG TOT RECOURSES MET

Managed Service Identity

nn

nn

nn

nn

nn

nn

nn

Hoewel het doorspitten van de Audit Log natuurlijk enorm interessant kan zijn, is er ook een eenvoudigere manier om te controleren of jouw nieuwe Service Principal is aangemaakt. De Service Principal zou namelijk ook zichtbaar moeten zijn binnen de Enterprise Applications blade binnen de AAD-tenant. Bij een succesvolle deployment is er namelijk een ‘Enterprise application’ aangemaakt met exact dezelfde naam als de aangemaakte Azure App Service (of ieder ander service waar MSI voor is geactiveerd).

Dit is alles wat er nodig is om te starten met het gebruik van MSI.Tot zo ver het eenvoudige gedeelte!

Gebruik maken van mSiDe tweede stap, het daadwerkelijk gebruik maken van de aangemaakte identity middels MSI.De meest voor de hand liggende service welke we in Azure willen benaderen met onze nieuwe identiteit is natuurlijk Azure Key Vault.

Azure Key Vault bevat als het goed is alle geheimen welke we nodig hebben om andere services te kunnen benaderen, zoals bijvoorbeeld connectiestrings.

Om de nieuwe identiteit toegang te geven tot Azure Key Vault moeten we twee nieuwe properties gebruiken die op het Azure App Service object zijn geplaatst, namelijk `tenantId` en `principalId`.Mocht je net als mij geen ARM-guru zijn, dan kan het even tijd kosten om uit te vinden hoe deze properties zijn te benaderen. Je moet namelijk een referentie verkrijgen naar de zojuist aangemaakte Azure App Service en hier het `identity` object op aan te spreken.In het stukje ARM-template hieronder zorg ik ervoor dat de zojuist aangemaakte App Service toegang krijgt tot de Key Vault met de rechten om `secrets` op te vragen.

“accessPolicies”: [

{

“tenantId”: “[reference(concat(‘Microsoft.Web/

sites/’, parameters(‘webSiteName’)), ‘2018-02-01’,

‘Full’).identity.tenantId]”,

“objectId”: “[reference(concat(‘Microsoft.Web/

sites/’, parameters(‘webSiteName’)), ‘2018-02-01’,

‘Full’).identity.principalId]”,

“permissions”: {

“keys”: [],

“secrets”: [

“get”

],

“certificates”: [],

“storage”: []

}

}]

Na weer een succesvolle deployment te hebben uitgevoerd zul je zien dat de Service Principal ook rechten heeft gekregen om de Key Vault te kunnen benaderen.

F I G U U R 2

F I G U U R 3

F I G U U R 4+

||||||||Azure Key VAult beVAt Als het goed is Alle

geheimen welKe we nodig hebben om Andere serVices

te Kunnen benAderen, zoAls bijVoorbeeld

connectiestrings.

0

“ “

Page 9: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

magazine voor software development 9

kan ik dan nu eindelijk proGrammeren?Het antwoord daarop is: Ja!Zodra de ARM-templates helemaal goed zijn opgesteld en uitgerold kun je beginnen met het gebruiken van MSI binnen jouw applicaties.Eigenlijk is dit het meest eenvoudige onderdeel van het geheel. Het enige dat je hoeft te doen is gebruik maken de property `KeyVaultTokenCallback` op de `AzureServiceTokenProvider` of de methode ̀ GetAccessTokenAsync` wanneer je met een andere service als Key Vault een connectie wilt opstellen.Omdat we in dit artikel toegang hebben geconfigureerd voor de Azure Key Vault zal de code er ongeveer als volgt uit komen te zien.

var azureServiceTokenProvider = new

AzureServiceTokenProvider();

var keyvaultClient = new KeyVaultClient(new

KeyVaultClient.AuthenticationCallback(azureServiceTok

enProvider.KeyVaultTokenCallback));

var secretValue = await keyvaultClient.

GetSecretAsync($”https://{myVault}.vault.azure.net/”,

“MyFunctionSecret”);

return req.CreateResponse(HttpStatusCode.OK, $”Hello

World! This is my secret value: `{secretValue.

Value}`.”);

In de browser zal dit er ongeveer als volgt uit komen te zien:

Al met al is dit alles wat je hoeft te doen om een veilige identity te maken voor jouw applicaties en daarmee andere services binnen Azure te benaderen. Mocht je graag de gehele ARM-template en code voorbeelden willen inzien, dan zijn deze beschikbaar op GitHub op de volgende link: https://github.com/Jandev/function-msi-with-other-servicesLet wel, deze feature is nog in ontwikkeling waardoor er continu nieuwe features aan worden toegevoegd. Mocht een bepaald onderdeel vandaag dus nog niet werken, dan kan het best zo zijn dat dit over twee weken is opgelost!

Ik zou in ieder geval adviseren om alvast naar deze Managed Service Identity feature te kijken en proberen te integreren binnen jouw huidige Azure landschap. Hoewel het nog wel in volle ontwikkeling is, is het voor veel scenario’s al goed genoeg om in de praktijk te gebruiken.

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

F I G U U R 5

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

jan de vrieS

Jan de Vries heeft in zijn loopbaan verschillende rollen gehad. Tegenwoordig werkt hij bij 4DotNet en wordt vaak ingezet als solution architect en/of ontwikkelaar op diverse projecten. Zijn focus is daarbij het opzetten van schaalbare en performante software oplossingen, waar Microsoft Azure een primaire rol in speelt. Hij verdiept zich graag in alles wat Azure te bieden heeft, waar serverless oplossingen op dit moment de meeste aandacht krijgen.Met enige regelmaat blogt Jan op https://jan-v.nl en kunt hem volgen op @Jan_de_V

+

||||||||||||||

hoewel mAnAged serVice identity nog wel in Volle

ontwiKKeling is, is het VOOR VEEL SCENARIO’S AL

goed genoeg om in de PrAKtijK te gebruiKen.

0““

Page 10: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

ONTWIKKELEN VOOR DE

Microsoft HoloLens(deel 1)

Roy Janssen

Page 11: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

Wat Heb je nodiG om voor HololenS te ontWikkelen?Als je voor een HoloLens wil ontwikkelen heb je minimaal het volgende nodig:- Windows 10 met minimaal de Fall Creators Update- Visual Studio 2017- Unity 3D- Simulator of Mixed Reality-portal (optioneel)Voor mij sprong de derde in dit rijtje er direct het meest uit, ik had namelijk nog nooit gebruik gemaakt van Unity 3D. En als ik andere developers om me heen hoor ben ik niet de enige voor wie dit nieuw was. Het gebruik van Unity 3D heeft een redelijk steile leercurve, maar er zijn online ruim voldoende tutorial’s en video’s te vinden om je op gang te helpen.

maar er zijn tocH al meer deviceS dan alleen de HololenS? Ja dat klopt, inmiddels zijn er al van meer fabrikanten devices voor Mixed reality op de markt gebracht. Dit zijn allemaal zogenaamde occluded devices, oftewel afgesloten devices. Met deze devices zie je anders dan bij de HoloLens jouw eigen omgeving niet meer. Deze devices zijn eenvoudig op je Windows 10 computer aan te sluiten en zijn wat aanschafprijs betreft een stuk goedkoper dan de HoloLens. In dit artikel zal ik me alleen richten op het ontwikkelen voor de HoloLens, maar heel veel is ook direct van toepassing op deze nieuwe groep devices.

De Microsoft HoloLens werd voor het eerst in januari 2015 door Microsoft aangekondigd en mijn interesse was direct gewekt. We moesten helaas nog ruim een jaar wachten voordat Microsoft in maart 2016 begon met het leveren van de eerste Developer editions. Deze eerste devices waren lastig verkrijgbaar en in het begin ook alleen maar in Amerika. Gelukkig kreeg ik het via Amerikaanse connecties voor elkaar dat ik in het derde kwartaal van 2016 ook mijn eigen Developer devices geleverd kreeg. Inmiddels alweer ruim twee jaar verder leek dit me een goed moment hier eens iets over te schrijven.

magazine voor software development 11

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

F I G U R E 2

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

F I G U R E 1

Page 12: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

12

| | | | | | | | | | | | | | | | | | | | | | |Serverless integration:

Logic Apps en Functions

nn

nn

nn

nn

nn

nn

nn

12

| | | | | | | | | | | | | | | | | | | | | | |ONTWIKKELEN VOOR DE

Microsoft Hololens(deel 1)

De eerste stap na het starten van een nieuw project in Unity 3D is het toevoegen van de MRTK. Op het moment van schrijven zijn we op versie “HoloToolkit 2017.4.2.0” die begin oktober zijn release beleefde. Kijk altijd even op:https://github.com/Microsoft/MixedRealityToolkit-Unityom daar de laatste versie van de unitypackages te downloaden. Op de github pagina staat ook altijd vermeld voor welke versie van de Unity editor de toolkit geschikt is.Nadat je een nieuw project hebt aangemaakt in Unity 3D ga je naar je assets en doe je een rechtermuisklik op je assets en kies je voor “Import Package” -> “Custom Package”.In het dialoog scherm navigeer je naar de locatie waar de MRTK is opgeslagen en kies je de juiste versie unitypackage.

nn

nn

nn

nn

nn

nn

nn

Naast dit officiële lijstje van benodigde software zou ik ook nog graag de Mixed Reality Toolkit, oftewel de MRTK, aan dit rijtje toe willen voegen. Hoewel het niet strikt noodzakelijk is van de MRTK gebruik te maken, biedt dit wel grote voordelen.De MRTK kent zijn oorsprong in de zogenaamde HoloToolkit. De HoloToolkit is door Microsoft als opensource project vrijgegeven nadat veel van de early adapters van de HoloLens op de fora op zoek waren naar voorbeeld code. Intussen is dit opensource project hernoemd naar MRTK (Mixed Reality Toolkit) en word deze nog actief onderhouden door een groep ontwikkelaars waaronder nog steeds een aantal Microsoft medewerkers. Omdat de MRTK zijn oorsprong kent als HoloToolkit zijn er nog regelmatig verwijzingen zijn die spreken van de HoloToolkit. Er verschijnen regelmatig updates op de MRTK, dit is voor de gebruikers van deze toolkit niet altijd een zegen, want dat betekent soms dat stukken code herschreven moeten worden om van de nieuwe toolkit gebruik te maken. Meestal vermijd ik zelf dan ook een nieuwe versie van de toolkit te introduceren in een lopend project. Beter is het dat project af te maken in de gebruikte versie van de MRTK en pas bij een volgend project de nieuwere versie te gaan hanteren.

een nieuW project Starten die Gebruik maakt van de mrtkNa deze ruime introductie, en het installeren van de benodigde software, is het nu echt tijd om aan de slag te gaan. Dit doen we anders dan we gewend zijn in Unity 3D en niet in Visual Studio. Na het starten van Unity 3D kies je voor “New” bovenin het scherm om een nieuw project te starten.

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

F I G U R E 3

F I G U R E 4

F I G U R E 5

F I G U R E 6 F I G U R E 7

Page 13: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

Na het uitvoeren van deze stappen ziet je hiërarchie en je scene er als volgt uit:

Op dit moment ben je klaar om je wereld te gaan vullen met hologrammen.

HoloGrammen toevoeGen aan je applicatieNu we een lege wereld hebben gemaakt is het tijd om hologrammen toe te gaan voegen. Er zijn meerdere manieren om dat voor elkaar te krijgen. Laten we beginnen met de meest makkelijke manier, namelijk het toevoegen van basic 3D objecten. In het Unity 3D menu kies je voor ‘GameObject’ en navigeer je door naar 3D Object. Hier krijg je de keuze tussen meerdere verschillende basic 3D objecten.

Na het importeren van MRTK en de Examples ziet je project structuur er als volgt uit.

Zoals direct opvalt zie je ook hier nog HoloToolkit als benaming staan, maar dit is uiteraard wel gewoon de MRTK die nu als Asset gebruikt kan worden. Als je vervolgens bovenin naar het menu kijkt valt ook direct op dat er een extra menu beschikbaar is geworden in Unity 3D.

Via dit menu is het heel eenvoudig om je zojuist aangemaakt Unity 3D project correct in te stellen voor Mixed Reality. We gaan dan ook als eerste de drie getoonde configuraties toepassen.

Achtereenvolgens voer je de volgende menu items uit:- Apply Mixed Reality Project Settings- Apply Mixed Reality Scene Settings- Apply UWP Capability SettingsJe kunt hierbij in eerste instantie gebruik maken van de standaard ingestelde waarden in de dialoog schermen, extra opties hebben we pas in een later stadium nodig.

F I G U R E 8

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

F I G U R E 1 0

F I G U R E 1 1

F I G U R E 1 2

F I G U R E 1 3F I G U R E 9

magazine voor software development 13

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

Page 14: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

14

| | | | | | | | | | | | | | | | | | | | | | |ONTWIKKELEN VOOR DE

Microsoft Hololens(deel 1)

Je ziet hier een aantal eigenschappen van de ‘Cube’ in onze scene. Let op dat alle waarden in Unity 3D in meters wordt weergegeven. Op basis van wat in de scene zichtbaar was kunnen we een aantal van de eigenschappen aanpassen.

Met deze aanpassingen is het de bedoeling dat de ‘Cube’ 3 meter van de camera af geplaatst wordt op 1 meter hoog in de lucht. Tevens roteren we de ‘Cube’ en maken we hem een stuk kleiner. Het gevolg van deze aanpassingen is dat de ‘Cube’ direct na het starten van de applicatie in het gezichtsveld van de gebruiker wordt geplaatst.

Dat is zichtbaar door op de ‘Game’ tab in Unity 3D te klikken. We zien nu een saaie witte kubus in ons scherm verschijnen. De volgende stap is deze kubus wat op te fleuren met bijvoorbeeld een kleur. Dit kunnen we bereiken door in onze assets een nieuw ‘Material’ asset aan te maken. Gebruik het context menu in het Assets window en kies voor ‘Create’ en kies vervolgens ‘Material’. Gebruik vervolgens het ‘Inspector’ scherm weer om de eigenschappen van je materiaal aan te passen, bijvoorbeeld een blauwe kleur. Dit materiaal sleep je vervolgens gewoon op je ‘Cube’ object om de eigenschappen van het materiaal op je kubus toe te passen. Dit is maar een zeer simpel voorbeeld, er is veel meer mogelijk maar daarvoor verwijs ik graag naar de rijke tutorials van Unity 3D zelf.https://unity3d.com/learn

de volGende StapNa al dit werk willen we uiteraard ook graag eens zien hoe dit er nou uit ziet op een HoloLens device. Voor de mensen zonder een HoloLens kan dit gedaan worden met de Mixed Reality-portal, maar het leukst is dit uiteraard op een HoloLens device. Om dit toch voor iedereen toegankelijk te houden zullen we in dit artikel naar de Mixed Reality-portal deployen. Graag verwijs ik naar de volgende pagina voor het activeren van deze Mixed Reality-portalhttps://docs.microsoft.com/nl-nl/windows/mixed-reality/using-the-windows-mixed-reality-simulator

nn

nn

nn

nn

nn

nn

nn

Laten we beginnen met het toevoegen van een simpele ‘Cube’ aan onze wereld.

Zoals je kunt zien is de ‘Cube’ midden in onze scene geplaatst, bovenop de camera positie. Door in de Hiërarchie op de MixedReality camera te klikken zie je dit nog iets duidelijker weergegeven. En aangezien je met de HoloLens zelf de camera bent betekent dit dat de ‘Cube’ op de positie van de HoloLens in de scene geplaatst wordt als de applicatie start. Dat is uiteraard niet praktisch dus laten we de ‘Cube’ maar eens op een betere plaats gaan zetten. Dit bereiken we in de ‘Inspector’ van Unity 3D. Allereerst moet je wel in de hiërarchie weer de ‘Cube’ selecteren zodat je de eigenschappen daarvan te zien krijgt in de Inspector.

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

F I G U R E 1 4

F I G U R E 1 5

F I G U R E 1 6

F I G U R E 1 7

F I G U R E 1 8

Page 15: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

In het ‘Build Window’ kun je doorgaan met het bouwen van het project met de knop ‘Build Unity Project’, dit bouwen kan soms wel even duren. Als dit proces klaar is open je voor het eerst Visual Studio door op de knop ‘Open in Visual Studio’ te klikken. Visual studio zal nu gestart worden en direct de zojuist door Unity 3D gemaakte solution openen.

Om de applicatie te kunnen bouwen en deployen is het wel noodzakelijk om de build settings goed te zetten.

Het debuggen op de ‘Local Machine’ kan alleen als je gebruik maakt van de Mixed Reality-portal. Deze moet je dus voor je op F5 gaat drukken eerst even opstarten.

Als we nu ons project opstarten met F5 zal deze automatisch in deze omgeving gestart worden, en komt onze kubus voor het eerst tot leven.Ik begrijp dat dit er iets minder spectaculair uitziet dan je wellicht gehoopt had, maar als je voor de eerste keer een eigen gebouwde kubus door een echte HoloLens bekijkt is dat echt magisch. Onze volgende stappen zouden kunnen zijn deze kubus te laten reageren als we ernaar kijken of als we er een ‘air-tap’ op geven, maar dat moet ik bewaren voor het volgende artikel.

F I G U R E 2 5

Nadat je ontwikkel machine correct is ingesteld kunnen we doorgaan met het bouwen van onze HoloLens applicatie. Eerst moeten we nog controleren of de scene ook geselecteerd is om gebouwd te worden. Dit doe je door via het ‘File’ menu naar de ‘Build Settings’ te gaan.

In de build settings controleer je of jouw scene al bij de ‘scenes to build’ staat. Is dit niet het geval dan klik je op ‘Add Open Scenes’ om je scene toe te voegen. Als deze instellingen goed staan kun je vervolgens via het menu ‘Mixed Reality Toolkit’ naar het ‘Build Window’ gaan.

magazine voor software development 15

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

F I G U R E 1 9 F I G U R E 2 0

F I G U R E 2 1

F I G U R E 2 2

F I G U R E 2 3

F I G U R E 2 4

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

Page 16: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

16

| | | | | | | | | | | | | | | | | | | | | | |ONTWIKKELEN VOOR DE

Microsoft Hololens(deel 1)

nn

nn

nn

nn

nn

nn

nn

Wat valt er noG meer te lerenIk heb in dit eerste artikel nog maar nauwelijks een begin gemaakt met het daadwerkelijk ontwikkelen voor de HoloLens. Dat betekent dat er nog veel meer te vertellen valt. In het volgende artikel wil ik graag verder gaan waar we zijn gebleven zodat we ook daadwerkelijk code te zien gaan krijgen. En daarna kunnen we door met de nog mooiere dingen zoals ‘environment mapping’ en ‘shared experiences’ die door de Mixed Reality Toolkit een stuk eenvoudiger aan je project toe te voegen zijn.

+

||||||||||||||

niets is zo mooi Als je eigen ontwiKKelde

soFtwAre in je eigen woonKAmer tot leVen

zien Komen...

0“

“concluSieEen conclusie die ik jullie nu al mee zou willen geven is dat het ontwikkelen voor HoloLens enorm leuk en uitdagend is. Je moet er open voor staan om veel nieuwe dingen te leren zoals Unity 3D en de mogelijkheden van de Mixed Reality Toolkit. En het mooiste is het als je de toegang hebt tot een HoloLens of een van de goedkopere Headsets die in het begin van dit artikel zijn genoemd. Niets is zo mooi als je eigen ontwikkelde software in je eigen woonkamer tot leven zien te komen.

roy janSSen

Roy Janssen is eigenaar van Semper IT Services en heeft al meer dan 19 jaar ervaring in IT. Hij vervult binnen kleine en grote projecten diverse rollen zoals onder andere technisch architect, lead developer en consultant. Verder is hij in te zetten als trainer, speaker en app developer. Zijn kennis in C#, WPF, XAML, NUI, PixelSense, HoloLens en andere deelt hij graag met de community.

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

F I G U R E 2 7

F I G U R E 2 6

+

tijdens het Volgende sdn eVent oP 14 december zAl iK

een sessie geVen oVer het ontwiKKelen Voor

hololens. deze sessie zAl zich richten oP het gebruiK

VAn de mixed reAlity toolKit en de Voordelen die dAt met

zich meebrengt.

we gAAn onder Andere kIjkEN NAAR ‘SpAtIAL

MAppINg’, ‘SpAtIAL uNdER-StANdINg’, ‘SpAtIAL SOuNd’ EN ‘ShARINg’. dIt zIjN ENkELE VAN

de onderdelen die door de mixed reAlity toolKit

AAnzienlijK eenVoudiger geïmPlementeerd

Kunnen worden.

-

““

||||||||||||||||||

Page 17: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

BUILDING A

Chrome Extension

Gerald Versluis

Since a while, Microsoft has moved over all documentation to their new environment: Microsoft Docs. While I really love the new system, how it looks and works is great, but there is one thing that really bugs me. As a non-native English speaker, the Microsoft Docs pages will detect that I am from the Netherlands and automatically redirects me to the Dutch translation of the page. There is a switch to go back to English, but this setting is not persisted. Although it is very much a #firstworldproblem, I decided to look into the world of Chrome Extensions to take matters into my own hands.

While the automatic translations seem like a good idea in theory, in practice it doesn’t work that great. Technical content is very hard to translate in an automated matter, mostly because there are so much technical terms that you just want to keep English and translations of these terms are hilarious more often than not. Because of this, reading becomes harder and you get distracted of what is trying to be explained.

The worst thing is: you can’t override this behavior from Docs. Per page you have a toggle in the top right which lets you show the original version, but the toggle is just for that one page. The is no way to persist it and just say; hey Microsoft! I always want the English content!

I got tired of toggling the same thing over and over again and decided to look into developing a Chrome Extension for this. I’m a developer, how hard can it be?!And actually, it was quite easy! Let me tell you a bit about the basics.

GettinG StartedIn your Chrome browser you can navigate to chrome://extensions to open the page where you can manage the installed extensions. Notice how there is the “developer mode” toggle in the upper-right corner. It gave me a couple of extra buttons, but still no clue on how to get started. You can see the toggle and buttons depicted in the image underneath.

magazine voor software development 17

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

F I G U R E 1 : D E V E L O P E R M O D E T O G L E A N D A C C O M A N Y I N G B U T T O N S

Page 18: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

18

| | | | | | | | | | | | | | | | | | | | | | |BUILDING A

Chrome Extension

nn

nn

nn

nn

nn

nn

nn

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

Then, I turned to Google and simply searched for “developing Chrome extension”. I quickly got to this page: https://developer.chrome.com/extensions/getstarted. Finally, this would help me get started to build my extension.

This “Getting started tutorial” teaches you the basics by building a simple sample extension. As I suspected, Chrome extensions are built in Javascript, HTML and some JSON, no surprise there. From this page, I also gathered that your extension starts by creating a manifest.json. Since it’s all Javascript and alike, the tooling that you use for development does not really matter. Being the Microsoft-minded guy that I am I picked up my favorite tool from the shed: Visual Studio Code. For the ones that don’t know VS Code yet: this is a very lightweight tool (think Notepad++ and Sublime Text) that is very extensible and great for these kinds of projects. You can also use it for “full” development if you like. There is support for C#, Azure Functions, Blazor, you name it!

manifeSt.jSon fileThe manifest.json file is basically the entry of your extension. Here you declare what files your extension consists of, what permissions your extension needs, add some nice icons and specify other metadata as you wish. The manifest.json is, as far as I know at this point, the only file that has to have a specific filename and needs to be in the root of your extensions folder. All other files are referenced from there and can be in folders or subfolders. Figure 2 underneath shows the manifest.json file I ended up with.

The contents in the above file are the bare minimum of what should be in there. A few keys can vary depending on the implementation. If you’re not creating an options page or running a script in the background for instance.

manifeSt keySLet me give you a quick rundown of the keys that are in the manifest file. There are some obvious keys in there. You will have to give your extension a name, description and version. Also, you have to specify the manifest_version. At this time, simply set it to 2. This specifies which version of the manifest you are using, so the Chrome extension parsing knows what keys to look for. At the time of writing, though, version 1 is no longer supported and there is no version 3, so 2 it is!

Then there is a key called background. I will explain this in more detail in the next section about extension types. Here you just need to reference the script(s) that can run in the background. Basically, you reference the Javascript file that does the work you want it to do.With the options_page key, you specify the HTML page that is opened whenever a user navigates to the settings of your extension. All extensions will have a button in the Chrome toolbar, if you press it you can go to the settings, here is where you specify what that settings page is.The HTML page can have anything you like. I downloaded Bootstrap and jQuery and hooked it up here to make it look nice and work easily for me. You can probably load it from a CDN to keep your extension size smaller, but I liked the idea of keeping it self-contained. Within the HTML page, you can load your own Javascript and do your thing with that. I quickly found out that to persist settings and read them in another place, you should simply use the browsers local storage.The page_action key will define what is shown whenever a user hits a certain page. This is also something that is explained in more detail in the next section.Lastly, there are couple of icon keys in there. Just make sure you have a nice icon and supply it in a number of different formats, this will make sure you have a nice icon on the Chrome toolbar as well as in the store.To read up in detail on all the different keys in here, refer to the Google documentation at https://developer.chrome.com/apps/manifest.

extenSion typeSThere are two types of extensions; either user triggered or background.The thing I wanted to do is take the URL the user might be navigating to, check if it contains the Microsoft Docs URL and then swap out the localization code if needed. Since this is something that should happen automatically, this would be a background plugin.

You can also choose to build an extension that acts whenever the user interacts with it. Regardless of if an extension is a background extension or not, it will always have an icon in the toolbar. From that icon, you can spawn a pop-up, which is just an HTML page where you can have your user interact and from there trigger any logic that you want. The difference here is if you implement it as a page action or a browser action.With both you can do the exact same thing, the difference is when your toolbar icon is activated. When it is not activated, it will show grayed out. Your popup will only show whenever the button is activated. As the name already implies: a page action only activated whenever the user lands on a certain page, and a browser action is available in the browser, that means in every page. The guideline Google prescribes for this is in their documentation is this:• Dousepageactionsforfeaturesthatmakesenseforonlyafew pages.• Don’t usepage actions for features thatmake sense formost pages. Use browser actions instead.• Don’tconstantlyanimateyouricon.That’sjustannoying.

To read more on page actions have a look at this page: https://developer.chrome.com/extensions/pageAction and browser actions van be found here: https://developer.chrome.com/extensions/browserAction

F I G U R E 2 : C O N T E N T S O F T H E M A N I F E S T . J S O N F I L E

Page 19: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

paGe actionSince the extension is very specific for just one website, or at least one base address, I decided to go for page action. You don’t even have to include a page action if you don’t want to, since the script will run in the background either way. But by adding a page action we get a nice active icon in the toolbar whenever the user gets to the Microsoft Docs pages to let the user know your plugin is active on this page. When you do not include browser action or page action, your extension icon – which is always there – will always look disabled and grayed out. With a browser action, it will always look enabled, since it is relevant to the browser and all pages. To define on which page your icon should be active, you use the piece of code from Figure 3 in your background JS file.

Notice how there is a condition in there that specifies the docs.microsoft.com hostname and triggers the action(s) on line 9. In this case the action to show the page action, making the toolbar icon active.For more information on declarative and normal events, have a look at this page: https://developer.chrome.com/extensions/events.

implementationAlthough the actual implementation of the plugin isn’t even of that much importance for this article, it still might be nice to take a

look at what it does and how it does it. In Figure 4, you can see the implementation of the background.js file. This file wires up the different events, and makes sure my extension is listening whenever the extension is installed for the first time and whenever Chrome is started. You can also see the piece of code of Figure 3 in there. Lastly, at the bottom, you can see the actual implementation of the extension.Here I hook into the onBeforeNavigate event of the actual navigation to pages. Before the actual navigation is done, I check if there are certain settings in the local storage – else I don’t know what to translate from and to – and then see if we are navigating to the Microsoft Docs pages. If all of this is true, I replace the localized language code with the configured one and that is basically all there is to it.Then there are a lot of files that have to do with the configuration of the extension. As I mentioned: it is all HTML, CSS and Javascript, so also the configuration screen you see in Figure 5 is a web page for instance. To make that work and validate the input fields etc. some extra scripting is done.

debuGGinGThe debugging experience was quite good! Because it all runs in Chrome and it’s all web languages, you can, debug everything with the Chrome Developer Tools that are already available to you in the browser. There is, however, a difference between unpacked and packed debugging. Ask me how I know…

unpackedUnpacked is the name they gave to just a folder which contains all your files. You can simply point to that folder from the extensions screen where your manifest.json file is in developer mode, and it will load the extension like it would normally. The extra thing you get is that you can debug through it.Depending on what kind of extension you are building you can just go into the developer tools as you normally would, set breakpoints and trigger them. However, if you’re building a background extension like me, you will have to open the developer console from the extensions page. If you go there, you will notice that the words “background page” are blue, indicating that it is a link. When you click on it, you will get the same developer console as you would normally open yourself on a page. You can see this in Figure 4.

F I G U R E 3 : R E G I S T E R T H E D O C S . M I C R O S O F T . C O M H O S T N A M E A S P A G E A C T I O N R U L E

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

magazine voor software development 19

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

F I G U R E 4 : I M P L E M E N T A T I O N O F B A C K G R O U N D . J S

F I G U R E 5 : C O N F I G U R E T H E E X T E N S I O N T H R O U G H T H E P A G E A C T I O N P O P U P

Page 20: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

20

| | | | | | | | | | | | | | | | | | | | | | |BUILDING A

Chrome Extension

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

packedA packed extension is actually the release version. The important thing you should know here is that when using an unpacked extension, you seem to have less limitations. So, what happened was; I thought I was done, packed up my extension (note: don’t do it with the pack button, but simply zip it) and took it to the extension store. After it was published, I decided to uninstall my development version and download it from the store to see if the behavior was the same. As it turned out, it wasn’t. The extension didn’t work.At first, I was a bit confused on how I should then test my extension when the unpacked version worked properly. After a little search engine action, I found out that you can bypass the store by packing your extension with the designated button in the extension screen and then drag the packed .crx extension file back into your Chrome instance. That way, your extension is installed the same way as it would through the store. There is a field there for a signing key, as far as I can tell it’s not important since it’s just used for local debugging. One might expect that this is also the package that you need for distribution, but it is not, as we will learn a little bit later on.

releaSinG in tHe cHrome Web StoreAfter little more than an hour, I had the first version of my extension ready, pretty fast, right? Thinking to myself I couldn’t be the only one being annoyed by the Microsoft Docs translation fairy, I decided to put this in the extension store. So, the next step would be to find out how to publish it there.Although I already have an Android developer account, this is apparently not a global Google developer account. I had to create a separate account for the Chrome extension. Don’t worry though, the process is pretty simple and can be completed within a matter of minutes. If you’re already a Google user, that is.All I needed to do was click on the developer console in the options and enter some details. The funny thing is, is that I had to pay a small amount of 5 dollars (once) to be able to publish to the store. For that 5 dollars you can even put 20 extensions in the store! This payment is probably to prevent people from creating all kinds of minor extensions and take them to the store. Oddly enough, there was no further review of my code. At least, not that I’m aware of.Anyway, after going through these hoops I was taken to the developer dashboard, which looks horrific by the way, and I could start creating my extension entry. To create the entry, you have to enter some simple data like a description and some images. Then to add your actual extension, you simply bump up the version number in

your manifest.json file, zip the folder and upload that to the developer portal.If you look closely at the old developer portal, there is an alert that tells you the new developer portal is in preview and you can try it. You should! It looks and works much, much better and if you, by any chance, know the Android developer portal, it looks pretty much the same. Maybe, by the time you read this, the portal is already replaced by the new one.

SummaryCreating a Chrome extension isn’t very hard, but can solve some issues that you might have with certain web applications or really add value to your browser experience. For instance, I have an extension for ages that lets me pick a color from the page that I am on. And now, for this hassle I encountered myself, I have created a small piece of code, that I learned from, and I won’t be bothered with poor Dutch translations any longer. Soon after this extension I created a second one that polls StackOverflow for my favorite tags and notifies me whenever there is a new question I could answer. Small (first world) problems that can easily be solved by a small extension.

If you want to use the Microsoft Docs extension, you can get it from here: https://chrome.google.com/webstore/detail/microsoft-docs-langyfier/gkneebafjlcpcgahjdlmdoejhjnfleha. If you like it, please rate and/or share it!

Maybe you’re also interested in the StackOverflow extension, you can find that here: https://chrome.google.com/webstore/detail/ibhajcdkooakdallelflpgpplpgkopla.

I hope this write-up will help you get started for yourself and please let me know if you have created any cool extensions of your own, or if you are using mine. Everything described here is open-source on GitHub: https://github.com/jfversluis/Microsoft-Docs-Langyfier and https://github.com/jfversluis/StackNotifier. I will gladly look at any issues or accept any improvements through pull requests.

F I G U R E 6 : T H E U N P A C K E D L O A D E D E X T E N S I O N I N T H E C H R O M E : / / E X T E N S I O N S P A G E . N O T I C E T H E “ B A C K -G R O U N D P A G E ” L I N K T O D E B U G O U R B A C K G R O U N D S C R I P T

Gerald verSluiS

Gerald Versluis (@jfversluis) is an all-round software developer, Microsoft MVP and three-time author from The Netherlands. After years of experience working with Azure, ASP.NET, Xamarin and other .NET technologies, he has been involved in a number of different projects and has been building several real-world apps and solutions.

Not only does he like to code, but he is also passionate about spreading his knowledge - as well as gaining some in the bargain. Gerald involves himself in speaking, providing training sessions and writing blogs (https://blog.verslu.is) or articles in his free time. Twitter: @jfversluis | Website: https://gerald.verslu.is

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

Page 21: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

UNDERSTANDING THE

FireDAC Indexes Property

Cary Jensen

Page 22: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

22

| | | | | | | | | | | | | | | | | | | | | | |UNDERSTANDING THE

FireDACIndexes Property

nn

nn

nn

nn

nn

nn

nn

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

To say that FireDAC supports the TDataSet interface is, of course, a gross understatement. Assuming that the BDE is the standard on which the TDataSet interface is based, FireDAC exceeds, by all accounts, the features offered by the BDE. In this article I am going to take a closer look at one of the mostly overlooked features of FireDAC – Indexes.

introduction to indexeSAre you still with me? You are? OK, good. I wouldn’t be surprised if you had just stopped reading at this point, because, well, indexes are boring. Or are they?

Indexes are such a mundane aspect of database development that it’s easy to underestimate them. And I suspect that this is why this feature is easily overlooked.

So let’s start by getting the boring part out of the way. An index is a structure that permits you to provide a customized view of a result set. There are other mechanisms that do something similar, and they include ranges, filters, Local SQL, and the cached updates-related FilterChanges property. Like indexes, all of these feature are client-side features.

Database servers, and nearly all types of databases, support the concept of indexes as well. These indexes, however, are structures associated with the database itself, and are entirely distinct from FireDAC indexes. Specifically, even though a particular database table may possess one or more indexes on the server, a query of that table will produce a client-side result set, and by default that result set will have no indexes.The indexes I am covering in this article are specifically client-side indexes, and if you want one or more of them, you either have to define them at design time, or specifically create them at runtime, or both.

So, what does an index actually do? To begin with, it provides a mechanism for sorting the records in the result set. For example, imagine the following SQL query:

SELECT First_Name, Last_Name FROM Employee ORDER BY

Emp_No

Delphi has supported a number of different data access frameworks over the years, including the Borland Database Engine (BDE), dbExpress, IBExpress, and dbGo (a framework for Micro-soft’s Universal Data Access, a COM-based data access mechanism). Beginning with Delphi XE3, and Embarcadero’s acquisition of AnyDAC, Delphi introduced FireDAC.

The BDE was deprecated many years ago, and with the exception of FireDAC, each of the remaining data access frameworks have their own limitations. Due to FireDAC’s support for the traditional Delphi TDataSet interface, it has firmly established itself as the Delphi data access mechanism of choice.

This query will return a result set that includes the First_Name and Last_Name columns of the Employee table, and will order these records based on the Emp_No field value, in ascending order (the default). Using a FireDAC index, you can display the results of this query sorted by First_Name, or Last_Name, or by Last_Name and then First_Name. You can even create all three of these indexes, and then easily switch between them at runtime, thereby changing the sort order of the records in the result set.

This sorting of the records in a result set has several valuable purposes. The obvious purpose is that you can display the records to your users in a meaningful order. For example, when a user is reviewing peoples’ names they often want to see the names sorted alphabetically, something that is highly unlikely when the result set is retrieved in order of Emp_No.

Another benefit of this sorting is that it enables FireDAC to perform certain types of operations on the data, such as searching, joining, and ensuring uniqueness. For example, if you want to permit the user to search the employee database by Last_Name you must first sort the result set by Last_Name before calling the FindKey method.

Similarly, if you want to create a master/detail join between the Customer and Sales tables, the Sales table will have to be sorted by the Cust_No field, the primary key of the Customer table. Importantly, it is not necessary that the Sales table have a Cust_No field index on the database server. An index on the client, on the Sales table result set, is not only sufficient, but is required.

An index that is designated as a unique index ensures that no two records can have the same index value. For example, if you have an FDMemTable into which a user is entering data, you can create a unique index on an identity field (such as Cust_No, Emp_No, or AccountID). If a user attempts to post a record where the value of the identity field duplicates a value already posted, the post will be rejected.

In FireDAC, all FDDataSets support indexes. This means you can create client-side indexes on FDTables, FDQueries, FDStoredProcs, and FDMemTables. As a result, anytime that one of these DataSets returns a result set, you can create one or more indexes, as needed.

Page 23: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

firedac index typeSFireDAC supports four types of indexes. These are field-based indexes, expression-based indexes, distinct indexes, and filter-based indexes. The indexes that I’ve mentioned so far in this article are all field-based indexes. Specifically, they are based strictly on the fields (columns) returned in the result set.

Expression-based indexes are based on an expression, which can include one or more of the following: field-references, operators, literals, expression engine functions, and FireDAC scalar functions. It is the result of the application of the expression upon which the index is based and the result set records are sorted.

Distinct indexes are used to display only one record for each index value. These indexes can be field-based or expression-based. Note, however, distinct indexes are not the same as unique indexes. A distinct index based on either fields or expressions that is not also a unique index will permit duplicate index values in the result set, it’s just that only one of the duplicates will be displayed in the result set.

For example, you may have a distinct index based on the Country field of a table. When this index is applied, only one record from each country will be displayed in the result set, regardless of how many records for each country exist in the result set. If this sounds confusing, don’t worry. It will become more clear in the example discussed later in this article.

The final index type, filter-based indexes, has some similarities to distinct indexes in that they may cause some of the records in the result set to be suppressed. Like a distinct index, filter-based indexes are based either on fields or expressions. Only those records that match the filter criteria will be displayed.

Imagine that you have a filter index based on the Country field. Using the following filter, once the index is applied to the result set only those records in the result set where the Country field contains the value USA will appear.

[Country] = ‘USA’

creatinG indexeSIn this section I am going to demonstrate how to create each of the four types of indexes, one at design time and a corresponding index at runtime. You can use the link at the end of this article to download the sample project. This project uses a previously saved query result, in XML format, that is loaded into an FDMemTable both at design time as well as at runtime. This persisted query result is found in the same directory as the project source files.Before I begin, I want to acknowledge that there is a simple property, named IndexFieldNames, that you can use to easily create field-based indexes. However, it has limitations. As a result, I am going to concentrate specifically on the Indexes property. If you want to learn about IndexFieldNames, refer to the FireDAC help files.

creatinG indexeS uSinG tHe indexeS propertyThe FDDataSet Indexes property is a collection of TFDIndex instances. At design time you create these TFDIndex instances for a FDDataSet by first selecting the FDDataSet in the Object Inspector, and then by clicking the ellipsis next to the Indexes property. Delphi responds by

displaying the Indexes collection editor, shown here.

Click the Add New button on the Indexes collection editor toolbar, or press Ins, to create a new index. The new index appears in the collector editor, as shown in Figure 2.

Once an index has been created, select it to display its properties in the Object Inspector. Use the Object Inspector to set its properties. At a minimum, you must provide a Name for the index, set either the Fields or Expression properties, and make the index available by setting its Active property to True. There may be other properties that you want to set, and those will be discussed later in this article.

Creating an index at runtime is similar. You create the TFDIndex instance by calling the Add method of the FDDataSet’s Indexes property, after which you set the Name, Active, Fields or Expression properties, and maybe some others.

This looks something like the following:

var

Index: TFDIndex;

begin

Index := FDQuery1.Indexes.Add;

Index.Name := ‘IdxName’;

Index.Fields := ‘Last_Name;First_Name’;

Index.Active := True;

F I G U R E 1 : T H E I N D E X E S C O L L E C T I O N E D I T O R

F I G U R E 2 : A N E W T F D I N D E X H A S B E E N A D D E D T O T H E I N D E X E S C O L L E C T I O N E D I T O R

magazine voor software development 23

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

Page 24: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

| | | | | | | | | | | | | | | | | | | | | | |UNDERSTANDING THE

FireDACIndexes Property

nn

nn

nn

nn

nn

nn

nn

Regardless of whether you create the index at design time or runtime, you make the index the current index for the FDDataSet by setting its IndexName property to the name you have given to the associated index. To remove the index, set the IndexName property to an empty string, after which the display of the FDDataSet’s records will restore to the original record order.

During the creation of the main form, the runtime indexes are created and a combo box is populated with the names of both the design time and runtime indexes. The first item in the combo box is No Index. Here is the code that gets executed when an item is selected from the combo box. When No Index is selected, the FDQuery’s IndexName property is set to an empty string. When one of the index names is selected, FDQuery1.IndexName is set to the name of the corresponding index. This can be seen in the following event handler.

procedure TMainForm.cbxIndexesChange(Sender: TObject);

var

s: string;

Index: TFDIndex;

begin

if cbxIndexes.ItemIndex <> -1 then

begin

if cbxIndexes.ItemIndex = 0 then

begin

Start;

FDMemTable1.IndexName := ‘’;

Complete;

exit;

end

else

begin

Start;

FDMemTable1.IndexName := cbxIndexes.Text;

Complete;

end;

end;

end;

If you inspect this code, you will notice two function calls: Start and Complete. These are custom methods that I created to measure the time it takes, in milliseconds, to apply the selected index, as well as to display the number of records that appear in the index view. Here is the code associated with these two methods, which requires the System.Diagnostic unit in order to access the TStopWatch definition.

procedure Start;

begin

StopWatch := TStopWatch.StartNew;

end;

procedure Complete;

begin

StopWatch.Stop;

MainForm.StatusBar1.Panels[0].Text := ‘Elapse time:

‘ +

StopWatch.ElapsedMilliseconds.ToString + ‘

milliseconds’;

MainForm.StatusBar1.Panels[1].Text := ‘Record

count: ‘ +

MainForm.FDMemTable1.RecordCount.ToString;

end;

In the following sections I will show you two indexes for each type of index. The first index is created at design time, and these index names will include the suffix DTIdx, which is something I’m using in these examples to identify the index as a design time index. The second index is the same index created at runtime, where I show the code to create the index. The names of these indexes end in RTIdx, which I’m using to identify the index as a runtime index.Creating Field-based IndexesYou create a field-based index by setting the Fields property of the TFDIndex to either the name of a field in the result set, or a semicolon separated list of field names.

By default the fields are sorting in ascending order. If you want a particular field sorted in descending order, follow the field name with a colon and the letter D.

The StateProvCityDTIdx is a design time index that is sorted first by State_Province, in descending order, following by City, in ascending order. It is shown here in Figure 3.

The following code segment demonstrates how to create an identical index programmatically.

Index := FDMemTable1.Indexes.Add;

Index.Name := ‘StateProvCityRTIdx’;

Index.Fields := ‘State_Province:D;City’;

Index.Active := True;

F I G U R E 3 : S T A T E P R O V C I T Y D T I D X I S A M U L T I - F I E L D I N D E X C R E A T E D A T D E S I G N T I M E

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

24

Page 25: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

Figure 4 show how the main form looks when the StateProvCityDTIdx has been selected. In this image I have adjusted the order of the columns in the DBGrid so that you can see State_Province and City. The descending nature of the State_Province column is obvious, and the ascending nature of the City column results in the city Pebble Beach appearing before San Diego.

creatinG expreSSion baSed indexeSAs mentioned earlier in this article, an expression-based index can contain field-references, operators, literals, expression engine functions, and FireDAC scalar functions. As a result, you can do some very creative things using an expression index.

One of the more powerful elements of an expression is the ability to use FireDAC scalar functions. A detailed discussion of FireDAC scalar functions is beyond the scope of this article, but there are dozens of functions available to you, and they include a wide variety of character, numeric, date, system, and miscellaneous functions. For a list of the available FireDAC scalar functions, go to the Main Delphi help.

Expand the nodes for Key Application Types -> Developing Database Applications -> FireDAC -> Working with DataSets -> Writing Expressions. Before you can use FireDAC scalar functions in your expression-based indexes, you must ensure that the FireDAC.Stan.ExprFuncs unit appears in your uses clause.

In the LengthContact_LastDTIdx index the FireDAC scalar function Length is used. This index sorts the data based on the length of the Contact_Last field, as shown in Figure 5. Here is the code that creates this same index at runtime.

Index := FDMemTable1.Indexes.Add;

Index.Name := ‘LengthContact_LastRTIdx’;

Index.Expression := ‘Length( Contact_Last )’;

Index.Active := True;

In Figure 6 the LengthContact_LastRTIdx index has been applied. You can see here that the records are ordered based on the length of the Contact_Last field. Once again, I have ordered the fields in the DBGrid so that the effects of the index can be seen.

Note: In some distributions of Delphi the Length FireDAC scalar function, as well as some other, do not work. This is because these distributions failed to run a script that creates the STRLEN user defined function (UDF), among others, in the InterBase server. If you run into this problem, you will need to locate this SQL script and run it against any server against which you want to run the associated FireDAC scalar functions.

The script is named ib_udf.sql, and it is located in the gds_db\examples folder under the InterBase installation directory. On my machine, this directory was found in the following location:

c:\ProgramData\Application Data\Embarcadero\

InterBase\gds_db\examples

creatinG diStinct indexeSA distinct index suppresses duplicate values in the index, but as mentioned earlier, does not enforce uniqueness. For example, if you create a distinct index on a field named City, after the index has been applied the result set will only show one record for each city. Which record? Well, that depends on the order of records in the result set.

F I G U R E 4 : T H E S T A T E P R O V C I T Y D T I D X I N D E X H A S S E E N S E L E C T E D

F I G U R E 5 : L E N G T H C O N T A C T _ L A S T D T I D X I S A N E X P R E S S I O N I N D E X C R E A T E D A T D E S I G N T I M E

F I G U R E 6 : A N E X P R E S S I O N - B A S E D I N D E X O R D E R S T H E R E C O R D S B A S E D O N T H E L E N G T H O F T H E C O N T A C T _L A S T F I E L D

magazine voor software development 25

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

Page 26: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

| | | | | | | | | | | | | | | | | | | | | | |UNDERSTANDING THE

FireDACIndexes Property

nn

nn

nn

nn

nn

nn

nn

A filter is a Boolean expression that can contain the following elements: field references, operators, literals, expression engine functions, and FireDAC scalar functions. Only those records for which the filter expression evaluates to True will be visible in the result set.

The CAOnlyRTIdx filter is an example of a filter-based index. Figure 9 shows is how this index appears in the Object Inspector.

Index := FDMemTable1.Indexes.Add;

Index.Name := ‘CAOnlyRTIdx’;

Index.Fields := ‘State_Province’;

Index.Filter := ‘[State_Province] = ‘’CA’’’;

Index.Active := True;

But the important point is that each city will be represented by only one record.

The CountryDistinctDTIdx index is a distinct index, and when it is applied the result set will only contain one record for each country in the result set. Figure 7 shows this distinct index in the object inspector.

The following is an example of how to create this same index at runtime.

Index := FDMemTable1.Indexes.Add;

Index.Name := ‘CountryDistinctRTIdx’;

Index.Fields := ‘Country’;

Index.Distinct := True;

Index.Active := True;

The CountryDistinctDTIdx has been applied in Figure 8. Here, not only can you see that the records are ordered by Country, but there appears only one record for each country in the result set. Notice in the status bar that there are only 11 records here, while in the Figures 4 and 7 there are 33 records.

Distinct indexes are not limited to field-based indexes. For example, if you were to create a distinct index based on the expression Length( Contact_Last ), the result set would include only one record for each last name length.

creatinG filter-baSed indexeSA filter-based index is one where a field-based or expression-based index is restricted to those records that match some filter criteria.

F I G U R E 7 : C O U N T R Y D I S T I N C T D T I D X I S A D I S T I N C T I N D E X C R E A T E D A T D E S I G N T I M E .

F I G U R E 8 : A D I S T I N C T I N D E X L I M I T S T H E R E S U L T S E T T O O N L Y O N E R E C O R D P E R C O U N T R Y

F I G U R E 9 : C A O N L Y D T I D X I S A F I L T E R - B A S E D I N D E X C R E A T E D A T D E S I G N T I M E

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

26

Page 27: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

After the CAOnlyRTIdx index has been applied, as shown in Figure 10, only records where the State_Province field contains the value CA are visible.

SummaryIndexes are a powerful, though often underappreciated feature of FireDAC DataSets. In this article I have explored the four types of FireDAC indexes, which include field-based, expression-based, distinct, and filter-based indexes. I hope that I have inspired you to take another look at this important capability.

You can use the following URL to download the code sample for this article:

http://www.JensenDataSystems.com/FireDACIndexes.zip

magazine voor software development 27

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

cary jenSen

Cary is Chief Technology Officer at Jensen Data Systems, Inc., a company that has been providing training, consulting, and software development services since 1988. He is an award-winning author and trainer. His latest book is Delphi in Depth: FireDAC. He is an active developer, providing clients with assistance in data modeling, software architecture, software development, team development, mentoring, training, and software migration. Cary has a Ph.D. in Engineering Psychology, from Rice University, specializing in human-computer interaction

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

-

www.sdncast.nl

Een wekelijkse blik op ontwikkelingen op het gebied van software ontwikkeling, tech nieuws en events op informele wijze

doorgenomen door Microsoft MVP’s en SDN-ers Marcel Meijer, Maarten van Stam en Fanie Reynders af en toe aangevuld met een gastspreker.

De eenvoudigste manier is om naar de SDN Cast website http://www.sdncast.nl te gaan. Daar staan alle opnames van de SDN Cast

overzichtelijk op één pagina en kan je bovendien zien wanneer de volgende uitzending gepland staat.

SDN Cast

magazine voor software development 27

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK BEELDMERK

FULL-COLOUR

SOFTWARE DEVELOPMENT NETWORK DIVISIES

CONFERENCE

MAGAZINE

EVENTS

.NET

.NL

DELPHI

5 0 c y a a n1 0 0 g e e l

5 0 z w a r t1 5 c y a a n

SOFTWARE DEVELOPMENT NETWORK SOFTWARE DEVELOPMENT NETWORK

SOFTWARE DEVELOPMENT NETWORK

CLOUD

WEB

SQL

DELPHI

BIG DATA

ALM

GENERAL

DEVOPS WINDOWS MR

Page 28: SDN Magazine 136 · 2018. 12. 12. · dotNed Saturday Veenendaal 12 April SDN event 1 Zeist 14 Juni SDN event 2 Zeist Medio Oktober Techorama Nederland Ede 4-8 November Ignite Orlando

March 13th Jaarbeurs Utrecht

A R T I F I C I A L I N T E L L I G E N C E

B L O C K C H A I NM I X E D R E A L I T Y ( V R & A R )

S E C U R I T Y I O T F U T U R E T E A M S

Get ready for the developer conference focused on Microsoft technologies

and the future of development

www.futuretech.nl

Powered by

submityourpaper

FutureTech_ad in SDN V2.indd 1 29-10-18 11:23