Bootstrap Code Play

Leer responsief webdesign met Bootstrap-lessen die je kunt bewerken en bekijken. Bootstrap Code Play combineert uitleg, voorbeeldcode en een playground, zodat je kunt ontdekken hoe een wijziging in de markup een pagina beïnvloedt.

LEZEN, WIJZIGEN, BEKIJKEN

Kies een onderwerp, lees hoe het werkt en tik vervolgens op 'Probeer het' om het voorbeeld in de editor te openen. Wijzig een klasse, pas de inhoud aan of voeg een element toe. Open 'Voorbeeld' om het resultaat te inspecteren en ga vervolgens terug naar 'Code' voor een nieuw experiment.

LEER DE BOUWSTENEN

Oefen met responsieve grids, typografie, knoppen, meldingen, tabellen en formulieren. Verken componenten zoals kaarten, navigatiebalken, accordions en dialoogvensters in de relevante leertrajecten. Begeleide lessen bevatten stappen, uitdagingen en veelvoorkomende fouten, zodat je de code begrijpt in plaats van deze alleen maar te kopiëren. Projectlessen brengen concepten samen in voorbeelden zoals een prijssectie en een compact dashboard.

KIES EEN LEERTRAJECT

Bestudeer het meegeleverde Bootstrap 5.3.8-traject, of verken Bootstrap 4.6.2 en 3.4.1 voor oudere projecten. De oudere trajecten worden niet meer ondersteund en zijn beschikbaar voor leerdoeleinden en migratie. Een apart Bootstrap 6 alpha-traject is experimenteel; voor de preview is internettoegang en een moderne WebView vereist.

BLIJF OEFENEN

Zoek naar onderwerpen of blader per categorie. Markeer lessen als voltooid en bekijk je voltooiingsteller voor elke versie. Open de playground voor je eigen HTML-experimenten, sla een bestand op en ga er later naar terug via 'Opgeslagen bestanden'.

BEWERK MET HANDIGE TOOLS

Gebruik syntaxmarkering, ongedaan maken en opnieuw uitvoeren, zoeken en vervangen en ga naar een specifieke regel tijdens het werken aan voorbeelden. 'Opslaan als' bewaart een aparte kopie en 'Code delen' verzendt de tekst van de editor via de beschikbare deelopties.

Voor studenten, zelflerenden en ontwikkelaars die zich verdiepen in responsieve lay-outs, biedt de app een praktische cyclus: lees een uitleg, breng een kleine wijziging aan en bekijk het resultaat.

De app bevat advertenties. Voorbeelden die verwijzen naar externe bronnen vereisen een internetverbinding; de beschikbaarheid van externe bronnen kan variëren.