Pdf downloadenPdf downloadenX
Dit artikel is bijdragen van Stan Kats. Stan Kats is technoloog, operationeel directeur van en hoofd-technoloog bij de STG IT Consulting Group in West Hollywood, Californië. Stan biedt uitgebreide technologische oplossingen voor bedrijven door middel van externe IT-diensten en voor particulieren door middel van zijn consumentenbedrijf Stan's Tech Garage. Hij heeft een bachelordiploma in internationale betrekkingen behaald aan de University of Southern California. Stan begon zijn IT-carrière bij Fortune 500-bedrijven. Hij heeft zijn bedrijven opgericht om kleine bedrijven en particulieren te kunnen helpen met deskundige kennis over lastige en ingewikkelde vraagstukken.
Dit artikel is 1.968 keer bekeken.
Visual Studio Code is een door Microsoft ontworpen broncodebewerker die beschikbaar is voor Windows, macOS en Linux. Je kunt er codes mee schrijven en bewerken in allerlei verschillende codetalen, waaronder HTML. Vraag je je af hoe je een HTML-code kunt laten draaien om het resultaat te zien? Om te beginnen bestaan er allerlei extensies waarmee je heel makkelijk een HTML-code kunt laten draaien in Visual Studio Code. Maak je kunt ook de Terminal gebruiken om het HTML-bestand te laten draaien. In dit artikel lees je hoe je op verschillende manieren een HTML-bestand kunt draaien in Visual Studio Code.
Stappen
Open Visual Studio Code. Visual Studio Code heeft een icoontje dat eruitziet als een blauw strikje. Klik op het icoontje van Visual Studio Code om de codebewerker te openen. Je vindt het in het startmenu van Windows, de Apps-map op je Mac, of in het Appsmenu van Linux.- Als je dat niet al gedaan hebt, kun je Visual Studio Code gratis downloaden op https://code.visualstudio.com/. Klik gewoon op de knop Downloaden op de website en open het installatiebestand vanuit je webbrowser of je map met gedownloade bestanden. Follow the instructions to complete the installation.
Open een HTML-bestand of maak er een aan. Gebruik een van de stappen hieronder om een bestand te openen of een nieuw bestand aan te maken:- Klik om een nieuw bestand aan te maken op Bestand in de menubalk bovenaan. Klik vervolgens op Nieuw bestand. Begin met het typen van je HTML-code.
- Klik om een bestaand bestand te openen op Bestand in de menubalk bovenaan. Klik vervolgens op Bestand openen. Surf naar het HTML-bestand dat je wilt openen en klik erop om het te selecteren. Klik vervolgens op Openen.
Sla het bestand op als HTML-bestand. Als je klaar bent om een HTML-bestand te laten draaien in Visual Studio Code, zul je het bestand eerst als HTML-bestand op moeten slaan. Zodra je het HTML-bestand hebt opgeslagen, kun je het laten draaien in een willekeurige browser. Volg om je HTML-bestand op te slaan in Visual Studio Code de volgende stappen:- Klik op Bestand in de menubalk bovenaan.
- Klik op Opslaan als.
- Voer naast "Bestandsnaam" een naam in voor het bestand.
- Gebruik het uitklapmenu naast "Opslaan als type" om "HTML" te selecteren.
- Klik op Opslaan.
Advertentie
Open Visual Studio Code. Je herkent Visual Studio Code aan het symbooltje in de vorm van een blauw strikje. Open Visual Studio Code door op dat strikvormige icoontje te klikken. Je vindt het in het startmenu van Windows, in de Apps-map op je Mac, of in het app-menu van Linux.
Open een HTML-bestand of maak er een aan. Als je dat nog niet gedaan hebt, open dan een bestaand HTML-bestand, of maak een nieuw HTML-bestand aan en sla het op in HTML-formaat. Als je al een HTML-bestand open hebt staan, klik dan op de tab met het HTML-bestand bovenaan op het scherm om het te kunnen zien.
Open een nieuwe Terminal. Klik hiervoor op Terminal bovenaan op het scherm. Klik vervolgens op Nieuwe Terminal. De Terminal is de enige manier waarmee je een HTML-bestand kunt laten draaien in Visual Studio Code zonder gebruik te hoeven maken van een extensie. Het is ook de ingewikkeldste manier.- Een andere manier is om op Inzien bovenaan te klikken, en vervolgens op Terminal.
Typ cd en daarna het pad van het HTML-bestand en druk op ↵ Enter. Zo ga je naar de locatie van je HTML-bestand. Als je HTML-pagina bijvoorbeeld in een HTML-bestand in je map met Documenten staat, zou je cd \Gebruikers\gebruikersnaam\Documenten invullen en op Enter drukken.- Als het HTML-bestand is opgeslagen in een andere driveletter dan je besturingssysteem, zul je die driveletter in de terminal moeten veranderen voordat je naar het pad van het HTML-bestand kunt gaan. Typ hiervoor gewoon de driveletter (d.w.z. D: voor een D: drive) in en druk op Enter.
- Als je niet precies weet waar het HTML-bestand is opgeslagen, kun je met de rechtermuisknop op de tab met je HTML-bestand bovenaan op het scherm klikken en vervolgens op Pad kopiëren. Typ cd in in de Terminal en plak vervolgens het pad er direct achter. Verwijder de bestandsnaam aan het eind van het pad en druk op Enter.
- Als er in één of meer van de namen van de mappen in het pad naar je HTML-bestand een spatie staat, zal de Terminal niet naar de map kunnen gaan. Gebruik de Bestandsverkenner op een pc met Windows of de Finder op een Mac om naar een map te gaan met een spatie in de naam en wijzig de namen van die mappen om alle eventuele spaties te verwijderen (als je bijvoorbeeld een map hebt met de naam "Bestanden in HTML", verander de naam dan in "HTML-bestanden".)
Typ start in, gevolgd door de naam van het HTML-bestand en druk op ↵ Enter. Als je bijvoorbeeld de Index.HTML-pagina wilde laten draaien, zou je start index.html intypen en op Enter drukken. Op die manier open je het HTML-bestand in een apart venster waardoor je een voorbeeldweergave van de HTML-pagina kunt zien.- Klik om de voorbeeldweergave te sluiten simpelweg op het kruisje ("x") bovenaan op het scherm.[1]
Advertentie
Open Visual Studio Code. Het symbooltje van Visual Studio Code heeft de vorm van een blauw strikje. Open Visual Studio Code door op dat icoontje te klikken. Je vindt het in het startmenu van Windows op een pc met Windows, in de Apps-map op een Mac, of in het app-menu in Linux.
Klik op de knop Extensies. Klik hiervoor op het icoontje dat de vorm heeft van vier vierkantjes in de menubalk links. Je krijgt dan het zoekmenu met Extensies te zien.
Typ in de zoekbalk Voorbeeldweergave van HTML-pagina in. De zoekbalk staat bovenaan in het menu met Extensies aan de linkerkant. Je krijgt dan een lijst te zien met alle extensies die overeenkomen met jouw zoekopdracht. "Voorbeeldweergave van HTM-pagina" is een extensie voor Visual Studio Code waarmee je een voorbeeldweergave van HTML-bestanden kunt zien binnen Visual Studio Code in de modus gesplitst of de modus volledig scherm.
Klik op de extensie "Voorbeeldweergave van HTML-pagina". Als het goed is, is het de eerste extensie bovenaan in de lijst met extensies. Hij is gecreëerd door Thomas Haakon Townsend. De extensie bevat een icoontje dat op een oranje schildje lijkt met een "5" in het midden (het logo van HTML 5).
Klik op Installeren. Het staat onder het kopje "Voorbeeldweergave van HTML-pagina" op de informatiepagina rechts van het extensiemenu. Zo installeer je de extensie. Wacht een paar minuten tot het installatieproces voltooid is.
Open een HTML-bestand of maak een nieuw bestand aan. Als je dat nog niet gedaan hebt, open dan een bestaand HTML-bestand of maak een nieuw HTML-bestand aan en sla het op in HTML-formaat. Als je al een HTML-bestand geopend hebt, klik dan op de tab met het HTML-bestand bovenaan op het scherm om het te kunnen zien.
Klik op de knop voorbeeldweergave in gesplitst scherm. Klik daarvoor op het icoontje dat eruitziet als een gesplitst scherm met op de linkerkant een vergrootglaasje. Het staat rechts bovenaan in de hoek van het scherm. Zo open je een voorbeeldweergave van een HTML-bestand in een gesplitst scherm in Visual Studio Code.- Houd de toets Alt ingedrukt en klik op de voorbeeldweergaveknop om een voorbeeldweergave van de HTML-code op volledig scherm te zien.
- Klik om het scherm te sluiten simpelweg op het kruisje "x" in de voorbeeldweergave-tab bovenaan op het scherm.
Advertentie
Open Visual Studio Code. Je herkent Visual Studio Code aan het icoontje in de vorm van een blauw strikje. Klik op het icoontje van Visual Studio Code om Visual Studio Code te openen. Je vindt het in het startmenu van Windows, in de Apps-map op een Mac of in het app-menu in Linux.
Klik op de knop Extensies. Het is het icoontje in de vorm van vier vierkantjes in de menubalk aan de linkerkant. Je krijgt dan het zoekmenu met meerdere extensies te zien.
Typ in een browser openen in in de zoekbalk. De zoekbalk staat bovenaan links in het menu met Extensies. Je krijgt dan een lijst met extensies te zien die overeenkomen met jouw zoekopdracht. "In een browser openen" is een extensie voor Visual Studio Code waarmee je een HTML-bestand kunt openen in een browser naar keuze vanuit Visual Studio Code.
Klik op de extensie "in een browser openen". Als het goed is is dat de eerste extensie bovenaan op de lijst. Het is de extensie die volledig uit kleine letters bestaat en gecreëerd is door TechER. Klik op de extensie om hem te selecteren.
Klik op Installeren. Je vindt deze optie onder het kopje "in een browser openen" op de informatiepagina rechts van het extensiemenu. Zo installeer je de extensie. Wacht een paar minuten totdat het installatieproces voltooid is.
Open een HTML-bestand of maak een nieuw bestand aan. Open als je dat nog niet gedaan hebt een bestaand HTML-bestand of maak een nieuw HTML-bestand aan en sla het op in HTML-formaat. Als je al een HTML-bestand open hebt staan, klik dan op de tab die je HTML-bestand bevat bovenaan op het scherm om het te bekijken.
Klik met de rechtermuisknop op de HTML-code. Er verschijnt dan een contextmenu.
Klik op In de standaardbrowser openen. Zo open je het HTML-bestand in je standaardbrowser. Zo kun je het HTML-bestand bekijken.[2]- Of je kunt op In een andere browser openen klikken en vervolgens twee keer klikken op een webbrowser naar keuze.
- Als je gevraagd wordt om een standaardbrowser te selecteren, klik dan op de browser waarin je het bestand wilt openen en klik vervolgens op Ok.
Advertentie
Bronnen
Over dit artikel
Technoloog
Dit artikel is bijdragen van Stan Kats. Stan Kats is technoloog, operationeel directeur van en hoofd-technoloog bij de STG IT Consulting Group in West Hollywood, Californië. Stan biedt uitgebreide technologische oplossingen voor bedrijven door middel van externe IT-diensten en voor particulieren door middel van zijn consumentenbedrijf Stan's Tech Garage. Hij heeft een bachelordiploma in internationale betrekkingen behaald aan de University of Southern California. Stan begon zijn IT-carrière bij Fortune 500-bedrijven. Hij heeft zijn bedrijven opgericht om kleine bedrijven en particulieren te kunnen helpen met deskundige kennis over lastige en ingewikkelde vraagstukken. Dit artikel is 1.968 keer bekeken.
Categorieën: Internet
Deze pagina is 1.968 keer bekeken.
Was dit artikel nuttig?
⚠️ Disclaimer:
Content from Wiki How Nederlands language website. Text is available under the Creative Commons Attribution-Share Alike License; additional terms may apply.
Wiki How does not encourage the violation of any laws, and cannot be responsible for any violations of such laws, should you link to this domain, or use, reproduce, or republish the information contained herein.
- - A few of these subjects are frequently censored by educational, governmental, corporate, parental and other filtering schemes.
- - Some articles may contain names, images, artworks or descriptions of events that some cultures restrict access to
- - Please note: Wiki How does not give you opinion about the law, or advice about medical. If you need specific advice (for example, medical, legal, financial or risk management), please seek a professional who is licensed or knowledgeable in that area.
- - Readers should not judge the importance of topics based on their coverage on Wiki How, nor think a topic is important just because it is the subject of a Wiki article.
Advertentie
