Categoriearchief: Web Development

Web Development, Webdesign

Handboek JavaScript en jQuery

Een reactie plaatsen

Het zal niemand in de webdevelopment wereld zijn ontgaan. JavaScript is de laatste jaren in sneltreinvaart geëvolueerd. Lange tijd was het een programmeertaal waarmee je klokjes in de statusbalk van de browser kon tonen of eenvoudige animaties in de pagina plaatste. Maar sinds de komst van jQuery in 2006 werd alles anders.

Voor het eerst werden complexe, cross-browser compatible handelingen mogelijk zoals het selecteren van elementen en er allerlei handelingen mee uitvoeren. Het is niet overdreven om jQuery ‘de redding van JavaScript’ te noemen. jQuery is een bibliotheek die in aanvulling op JavaScript wordt gebruikt.

Populariteit

Ook met de populariteit van frameworks zoals React, Angular en Vue is de rol van ‘gewoon’ JavaScript en jQuery nog lang niet uitgespeeld. JQuery wordt meegeleverd met de standaardinstallaties van WordPress (35% van álle honderden miljoenen websites ter wereld draait op WordPress), andere content management systemen, wordt aanwezig veronderstelt in de populaire CSS-bibliotheek Bootstrap en wordt in het onderwijs gebruikt om snel interactiviteit aan webpagina’s toe te voegen. JQuery is meegegroeid met deze ontwikkelingen. Oude opdrachten verdwenen uit de bibliotheek, nieuwe opdrachten zijn toegevoegd.

De laatste jaren zijn er echter ook wijzigingen doorgevoerd in de taal JavaScript zelf. De manier om variabelen te declareren met var werd vervangen door const en let. Er zijn nieuwe manieren om functies te definiëren en bijvoorbeeld communicatie met een achterliggende API en database zijn nu rechtstreeks vanuit JavaScript mogelijk met de opdracht .fetch().
Lees verder Handboek JavaScript en jQuery →

Web Development, Web- & UX-design

Programmeren voor het web: alles over JavaScript

6 reacties

Of je nu net van school komt of al jaren meedraait in de webdevelopercultuur, het zal je niet verbazen dat je continu nieuwe dingen moet blijven leren om je kennis up-to-date te houden. Het is niet meer voldoende om een eenvoudige website te kunnen maken met HTML en CSS. Werkgevers vragen ook om interactiviteit in die website. En dan is JavaScript je enige keuze!  Wil je nu alles over JavaScript leren? Dan is er een bundel van drie boeken over JavaScript die je nu voor een speciale bundelprijs kunt aanschaffen! De boeken JavaScript, EcmaScript en TypeScript, en Node.js schaf je nu samen aan voor €49,99, een korting van bijna €38,-!
(Foto hierboven: Irvan Smith on Unsplash.)

Als backend programmeur kun je kiezen uit tal van programmeertalen en technieken: Java, .NET, PHP, Python, of talloze andere. In de wereld van frontend webdevelopment heb je eigenlijk maar één keuze: JavaScript. Immers, dat is de enige programmeertaal die de browser begrijpt. Maar het JavaScript-landschap is de laatste jaren enorm uitgebreid. Er zijn letterlijk honderden bibliotheken en frameworks beschikbaar. Waar moet je beginnen? Als je googelt op ‘JavaScript’ vindt je miljoenen pagina’s met informatie. Zelfs als je het trefwoord ‘beginnners’ of ‘tutorial’ er aan toevoegt, blijven er nog tienduizenden hits over.
Lees verder Programmeren voor het web: alles over JavaScript →

Fotografie, MS Office, Photoshop, Web Development

Leuke boeken in de aanbieding bij Van Duuren Media

Een reactie plaatsen

Zwarte vrijdag (Black Friday) lijkt eigenlijk meer op zwarte spamdag. Al die mailtjes die in mijn mailbox verschijnen… Waarom worden die er niet uitgefilterd door mijn fijnmazige spamfilter? Het zijn vaak aanbiedingen die mooier lijken dan ze zijn en er zijn zoveel aanbiedingen, dat je door de bomen het bos niet ziet. Maar er zijn wél leuke boeken in de Black Friday-aanbieding bij Van Duuren Media: tot en met 4 december een 30-tal boeken voor een tientje per stuk!

Échte kortingen, daar heb je op Black Friday en omstreken behoefte aan. Black Friday valt al lang niet meer alleen op de laatste vrijdag van november. De meeste aanbiedingen kun je al kopen vanaf begin deze week. Zo ook de boeken van Van Duuren Media die als Black Friday-aanbiedingen vanaf nu tot en met 4 december te koop zijn. Het gaat bij deze aanbiedingen om 10 boeken op het gebied van fotografie en 17 boeken op het gebied van ‘informatica’. Lees verder Leuke boeken in de aanbieding bij Van Duuren Media →

Informatica, Web Development

Maak zelf een HSL-kleurkiezer in HTML en CSS (3)

Een reactie plaatsen

Handboek HTML 5 en CSS3Het boek van de maand oktober is Handboek HTML5 en CSS3, 5de editie van Peter Doolaard. Deze maand bespreken we het boek, geven we op dit blog wat voorproefjes uit het boek. Dit is deel 3 uit een serie over het maken van een HSL-kleurenkiezer met HTML, CSS en wat JavaScript. Deel 1 vind je HIER, deel 2 vind je HIER. De site die bij het boek hoort vind je HIER. (H.F.)

Tijd voor het vervolg van een serie over het maken van je eigen HSL-kleurkiezer. In deel 2 is met hulp van het schaduw-DOM de basisopmaak voor de regelaars ingesteld en kreeg de tintregelaar een kleurverloop volgens het HSL-systeem. Die kleur is niet meer dan een achtergrond. De werkelijke waarde komt uit het attribuut value. Hetzelfde geldt voor de andere regelaars. Met JavaScript kunnen we die waarden lezen en verwerken tot een CSS-kleurdeclaratie of de inhoud van een tekstveld. Lees verder Maak zelf een HSL-kleurkiezer in HTML en CSS (3) →

Boekbesprekingen, Web Development, Webdesign

De pijlers van het digitale web – HTML5 en CSS3 – op papier

Een reactie plaatsen

Als je serieus aan de slag wilt gaan met het technisch bouwen van websites, dan is kennis van HTML5 en CSS3 en JavaScript onontbeerlijk.

Nu kan je de technieken voor HTML en CSS op heel veel digitale manieren leren; er zijn zát online tutorials en trainingen ! Maar het gros daarvan is in het Engels. Voor velen is dat misschien geen groot probleem (web-technieken zijn immers volledig Engelstalig georiënteerd). Maar er zijn ook veel mensen die het wel zo prettig vinden als een en ander op zijn minst in het Nederlands wordt beschreven en uitgelegd !

cover boek html css doolaardDe 5eeditie van het boek “HTML5 en CSS3” van Peter Doolaard voorziet daar uitstekend in. Lees die éérst, dan kan je daarna alles gaan nakijken en uitdiepen in allerlei handige online overzichten en hulpmiddelen.

Even wat achtergrond-informatie: anno 2019 bestaat het web 30 jaar. De eerste tien jaren waren woest en wild. Als gevolg daarvan heerste in het tweede decennium vooral moedeloosheid bij de grondleggers. Maar dankzij een hoognodige grondige ommezwaai (HTML5) is het web uit een diep dal gekrabbeld en floreert het nu als nooit tevoren. Lees verder De pijlers van het digitale web – HTML5 en CSS3 – op papier →

Informatica, Scripting, Web Development

Lokaliseer uw programmacode rechtstreeks met JavaScript met de API Intl

Een reactie plaatsen

JavaScript heeft lang de naam gehad weliswaar een krachtige taal te zijn, maar waarbij voor het serieuze werk toch aanvullende gereedschappen nodig zijn. Voor het manipuleren van webpagina’s was jQuery jarenlang de aangewezen tool. Voor het rekenen met datums en tijden en het omzetten van het lastige datumformaat van JavaScript naar leesbare tekst werd veelal de bibliotheek moment.js gebruikt. Dat is handig, maar betekent ook dat potentieel tientallen extra kilobytes voor het ondersteunen van allerlei talen wordt meegebundeld met uw applicatie. Maar dat hoeft nu niet meer dankzij de API Intl.

Er was al de website You might not need jQuery, de nieuwe specificaties van JavaScript voorzien tevens in een API die Intl heet (een afkorting voor ‘internationalization’), waarin de meest voorkomende handelingen voor het werken met datums, tijden, getallen en valuta zijn gebundeld.

De API Intl

In de nieuwste versies van Internet Explorer, Edge, Chrome en Firefox is de API Intl ingebakken en kan hij rechtstreeks vanuit JavaScript-code worden aangeroepen. Tip: wilt u weten of een bepaalde feature door uw favoriete browser wordt ondersteund, bezoek dan caniuse.com en typ de naam van de eigenschap. De website laat zien welke versies van de browser de gevraagde eigenschap ondersteunen (of niet). Lees verder Lokaliseer uw programmacode rechtstreeks met JavaScript met de API Intl →

De Upgrade-podcasts, Podcast, Uncategorized, Web Development

Upgrade-Podcast: Aan de slag met Vue.js voor de voorkant van een website

Een reactie plaatsen

Luister elke maand naar een nieuwe aflevering van Upgrade, de podcast van ComputerCreatief. Deze maand praat Peter de Ruiter met Peter Kassenaar, schrijver van het boek over Vue.js, het Javascript framework waarmee je de voorkant van een website samenstelt.

In een tijd waarin de voorkant- en de achterkant van websites steeds vaker van elkaar worden onderscheiden, heeft het programma Vue.js in vijf jaar tijd een goede positie weten te verwerven. Op Github staat dit Javascript-framework momenteel bovenaan in populariteit. IT-schrijver en docent Peter Kassenaar schreef een boek over het front-end dat je met Vue.js kan samenstellen, van een kleine hobbysite tot een complexe internationale webshop als die van Alibaba.

Peter de Ruiter voelt Peter Kassenaar aan de tand over de educatieve waarde van zijn boek. Luister naar deze aflevering van de podcast Upgrade om te horen wat Vue.js is, wat je er mee kan en hoe je er mee aan de slag kunt gaan.

Lees verder Upgrade-Podcast: Aan de slag met Vue.js voor de voorkant van een website →
UX Design, Web Development, Web- & UX-design, Webdesign

Afkortingen: Van MVP via MoSCoW en NUF naar MLF

Een reactie plaatsen

In de hele wereld maar vooral in IT-sferen is men verzot op afkortingen. Het geeft een gevoel van incrowd versus mystiek, voor hen die wèl of níet weten waar een afkorting voor staat. Zo ook bij UX-design. Het begint immers al met die ‘UX’ (User Experience), dat valt mee. Maar al snel kom je afkortingen tegen zoals MVP, MLF, NUF en MoSCoW. Je denkt dan: wat is hier aan de hand, wat mis ik ?

Bij alles wat we maken en wat anderen hopelijk gaan gebruiken – of het nou fysieke producten of digitale diensten zijn – vraag je je af: welke functies en opties moet mijn creatie gaan bieden ? Welke zijn daarbij cruciaal of optioneel ? Waarmee moet ik beginnen ? Om die afwegingen te maken, ga je nadenken of onderzoeken wat een gebruiker blijkbaar hard nodig heeft of kennelijk verwacht. In die fasen komen dergelijke afkortingen boven water.

MVP

Zo staat MVP voor Minimal Viable Product, oftewel ‘wat moet er minstens in zitten om een bruikbare website of app te zijn ?’ Dus zonder een goede uitwerking van die ene functie heeft het hele idee gewoon geen zin. Je zou denken dat zoiets niet voorkomt, maar er zijn voorbeelden genoeg: een mes dat niet kan snijden, een handdoek-haakje waar niets aan blijft haken, een citroen-stampertje dat niet kan stampen. Lees verder Afkortingen: Van MVP via MoSCoW en NUF naar MLF →

Column, Informatica, Web Development, Webdesign

Vue.js – het nieuwe JavaScript-framework

Een reactie plaatsen

In de webwereld is het frontend vakgebied een hot topic. Steeds meer bedrijven en organisaties kiezen ervoor hun frontend gescheiden te ontwikkelen van het backend. Zo kan het backend zich concentreren op authenticatie, API’s en datavoorziening, terwijl het frontend kan profiteren van compacte en lichtgewicht webapplicaties die op elke device draaien. Vaak wordt gekozen voor Angular of React als frontend framework, om niet telkens het wiel opnieuw te hoeven uitvinden. Maar sinds enige tijd is ook Vue.js een steeds vaker gekozen alternatief.

vue.js
De vue-homepage..

Vue.js is evenals React en Angular een frontend framework. Dit betekent dat in één geïntegreerde omgeving wordt voorzien in alle eisen waaraan een moderne webapplicatie moet voldoen. Denk aan zaken als webcomponenten, databinding, routing, state management en communicatie met het backend via http. Het gebruik van losse bibliotheken zoals jQuery, knockout, mobx (voor state management) en andere is vaak niet meer nodig. Alles is al beschikbaar in het framework. Het ene framework biedt out-of-the-box iets meer (Angular), het andere framework iets minder (React), maar daar staat dan weer meer keuzevrijheid tegenover. Vue.js biedt wat dat betreft een tussenweg. Er zijn standaard bibliotheken voor routing en state management, maar het is niet verplicht ze te gebruiken. Lees verder Vue.js – het nieuwe JavaScript-framework →

Boek van de maand, Uit het boek, Web Development, Webdesign

Handboek WordPress 5: De visuele editor gebruiken – 2

Een reactie plaatsen

Handboek WordPress 5Deze maand besteden we extra aandacht aan WordPress én het Handboek WordPress 5. We praten (weer) met schrijver Dirkjan van Ittersum. Deze keer over de vernieuwingen in WordPress 5 en de mogelijkheden van WordPress. We laten je kennis maken met het boek door wat voorproefjes uit het boek op dit WordPress-blog (Computer Creatief) te plaatsen. Daarnaast vertellen we over onze eigen ervaringen met WordPress. We beginnen de voorproefjes met de beschrijving van de nieuwe visuele editor Gutenberg, de opvolger van de ‘klassieke’ editor. Dit is deel 2 van het gebruik van de visuele editor: Afbeeldingen toevoegen. Deel 1 vind je HIER. (H.F.)

Afbeeldingen toevoegen

Er zijn meerdere mogelijkheden om een afbeelding toe te voegen aan een bericht. We zagen al even de mogelijkheid om een beeld inline toe te voegen aan een tekstblok. Die optie biedt weinig mogelijkheden om de positie van het beeld te bepalen en is daarom van beperkt nut. Veel beter is het om de afbeelding als blok toe te voegen. Er zijn drie opties: afbeelding, omslagafbeelding en galerij. We bespreken ze in de volgende paragrafen.

Bestandsformaten voor afbeeldingen

Voor beelden kunt u de bestandsformaten JPG, GIF en PNG gebruiken. Al deze bestandsformaten maken gebruik van compressie. Ze tasten de kwaliteit dus enigszins aan, maar daardoor zijn de bestanden wel veel kleiner en verschijnen ze sneller op het scherm. Ieder bestandsformaat heeft voor- en nadelen. Lees verder Handboek WordPress 5: De visuele editor gebruiken – 2 →