Simpele Code Editor
Date: 16-11-2017, Author: S. Ramasray


Simpele Code Editor

Bij BizFusion werk ik voornamelijk aan boekhoud- en kassasoftware, maar af en toe
besteed ik ook wat tijd aan een hobbyproject dat buiten mijn comfortzone ligt.


Microsoft heeft in Maart 2017 een nieuwe versie van Visual Studio (VS) uitgebracht.
Ik ben een Microsoft ontwikkelaar, dus het zal je niet verbazen dat ik de hele dag in Visual Studio werk.
En als je de hele dag in Visual Studio werkt, dan kom je snel tot de conclusie dat de Code Editor een
indrukwekkend stukje software is.

Hoe werkt een code editor eigenlijk? En hoe moeilijk is het om zelf een code editor te bouwen?
Dat zijn vragen die ik al heel lang in mijn hoofd heb, al sinds de eerste keer dat ik Visual Studio zag.
Dus een tijdje terug besloot ik om zelf een "eenvoudige" code editor te bouwen, maar het was me niet
gelukt om een werkende editor te bouwen.

De recente lancering van Visual Studio gaf me de inspiratie om het nog eens te proberen.
En ik had meer succes dit keer, want het is me gelukt om een bruikbare editor te bouwen.

Hier zijn een paar schermvoorbeelden van mijn code editor.



Mijn vorige prototypes waren te 'langzaam' of te 'buggy', en waren daarom niet geschikt
voor echt ontwikkelwerk. Maar dit is een bruikbare editor, het bevat alle basisfuncties
die je mag verwachten van een code editor.




Ik heb ook een statusindicator toegevoegd die toont of een regel aangepast is of niet.
Het was me nooit opgevallen hoeveel ik hierop vertrouwde in Visual Studio, totdat ik dit begon
te missen in mijn eigen code editor. Het werd zelfs een "must-have" functie in mijn code editor.
Gelukkig was het niet al te moeilijk om deze functionaliteit na te bouwen.



Wat nu?
Ik ben ongeveer een week bezig geweest met de ontwikkeling van de code editor.
Als je gemeen bent, dan kun je zeggen dat dit geen "echte" code editor is:
het is gewoon Notepad met wat syntax kleurtjes.
Maar weet je, er zijn een hoop ontwikkelaars die dat meer dan genoeg vinden.

Ik vroeg me wel af of ik de editor naar een hoger niveau kon tillen.
Als ik een “parser” zou toevoegen, dan zou ik de structuur van een codebestand kunnen weergeven
zoals in Visual Studio. Als je dan een methode of eigenschap selecteert, dan springt de code editor
automatisch naar de corresponderende sectie in de code.
Dat is iets dat ik aan een toekomstige versie zou kunnen toevoegen.
Hierdoor wordt mijn "simpele" code editor een "echte" code editor.



Ik heb al een poging gewaagd door een simpele “parser” toe te voegen aan de code editor.
Dit gaf me het vertrouwen dat het toevoegen van deze functionaliteit zeker mogelijk is.



Sommige van jullie vragen zich vast af waarom het überhaupt een week duurde om dit te ontwikkelen.
Kon je niet gewoon de "Rich Text Editor" uitbreiden met extra functionaliteit?

Ik ben van plan om "rijkere" functionaliteit toe te voegen aan de code editor.
Denk bijvoorbeeld aan de mogelijkheid om code blokken in/uit te klappen, en een
"Intelli Sense" functie waarmee je code automatisch kunt aanvullen met suggesties.

Je kunt dit soort functionaliteit niet eenvoudig toevoegen aan de Rich Text Editor.
Dus ik moest een tekst editor van de grond af aan bouwen, en ik kreeg te maken met alle
problemen die je tegenkomt tijdens de ontwikkeling van een "echt" maatwerkcomponent.

Dus ik vind een week ontwikkelwerk best snel!


Tot slot
Man, je had mijn vorige prototypes moeten zien.
Ze waren langzaam; ze hadden allerlei rare grafische bugs; en waren hierdoor onwerkbaar.
Maar je vergeet dat je ook ongelooflijk veel leert door prototypes te bouwen.
Deze code editor zou nooit gelukt zijn als ik niet eerst een paar keer gevallen was tijdens de ontwikkeling
van de prototypes.

Je moet verder weten dat ik voornamelijk bedrijfssoftware ontwikkel, dus het bouwen van
"tool software" is niet iets dat in mijn comfortzone ligt, dus het is niet gek dat ik een paar keer struikelde
tijdens de ontwikkeling van een code editor.

Het was in elk geval een leuke uitdaging om een code editor te bouwen.


Previous: Boekhouding Lightspeed Webwinkel