Share
Deze tutorial introduceert Microsoft WebMatrix, een gratis webontwikkelingstechnologie die een van de beste ervaringen levert voor webontwikkelaars.
WebMatrix is een gratis, lichtgewicht set van webontwikkelingstools die de gemakkelijkste manier is om websites te bouwen.
Het omvat IIS Express (een ontwikkelingswebserver), ASP.NET (een webraamwerk) en SQL Server Compact (een ingesloten database). Het bevat ook een eenvoudige tool die de ontwikkeling van websites stroomlijnt en het gemakkelijk maakt om websites te starten vanuit populaire open source-apps. De vaardigheden en code die u ontwikkelt met WebMatrix worden naadloos overgezet naar Visual Studio en SQL Server.
De webpagina's die u met WebMatrix maakt, kunnen dynamisch zijn, dat wil zeggen dat ze hun inhoud of stijl kunnen wijzigen op basis van gebruikersinvoer of andere informatie, zoals database-informatie. Voor het programmeren van dynamische webpagina's gebruikt u ASP.NET met de Razor-syntaxis en de programmeertaal C # of Visual Basic.
Als u al beschikt over programmeerhulpmiddelen die u bevalt, kunt u de WebMatrix-tools uitproberen of u kunt uw eigen hulpprogramma's gebruiken om websites te maken die ASP.NET gebruiken.
Deze tutorial laat zien hoe WebMatrix het gemakkelijk maakt om aan de slag te gaan met het maken van websites en dynamische webpagina's.
Om WebMatrix te installeren, kunt u Microsoft's Web Platform Installer gebruiken. Dit is een gratis applicatie waarmee u eenvoudig webgerelateerde technologieën kunt installeren en configureren..
http://go.microsoft.com/fwlink/?LinkID=205867
NotitieAls u al een WebMatrix-bètaversie hebt geïnstalleerd, werkt het installatieprogramma van Web Platform de installatie bij naar WebMatrix 1.0. Sites die u met eerdere bèta-edities hebt gemaakt, worden mogelijk echter niet weergegeven in de Mijn sites lijst wanneer u WebMatrix voor het eerst opent. Als u een eerder gemaakte site wilt openen, klikt u op Site van map pictogram, blader naar de site en open deze. De volgende keer dat u WebMatrix opent, wordt de site weergegeven in de Mijn sites lijst.
Om te beginnen, maakt u een nieuwe website en een eenvoudige webpagina.
Bovenaan ziet u een werkbalk Snelle toegang en een lint, zoals in Microsoft Office 2010. Links onderaan ziet u de werkruimtekiezer, die knoppen bevat die bepalen wat erboven in het linkerdeelvenster staat. Aan de rechterkant ziet u het inhoudspaneel, waar u rapporten bekijkt, bestanden bewerkt, enzovoort. Ten slotte is onderaan de berichtenbalk te zien, die berichten weergeeft waar nodig.
WebMatrix geeft een lijst met bestandstypen weer.
Zoals je ziet is dit gewone HTML-markup.
Hallo wereldpagina Hallo wereldpagina
Hallo Wereld!
Notitieяя Voordat u klikt Rennen, zorg ervoor dat de webpagina die u wilt uitvoeren, is geselecteerd in het navigatievenster van de bestanden werkruimte. WebMatrix voert de pagina uit die is geselecteerd, zelfs als u momenteel een andere pagina bewerkt. Als er geen pagina is geselecteerd, probeert WebMatrix de standaardpagina voor de site uit te voeren (default.cshtml) en als er geen standaardpagina is, geeft de browser een fout weer.
WebMatrix start een webserver (IIS Express) die u kunt gebruiken om pagina's op uw computer te testen. De pagina wordt weergegeven in uw standaardbrowser.
Nu WebMatrix is geïnstalleerd en een site is gemaakt, is het een goed idee om te leren hoe u de ASP.NET Web Pages Administration-tool en de Package Manager gebruikt om helpers te installeren. WebMatrix bevat helpers (componenten) die algemene programmeertaken vereenvoudigen en die u tijdens deze zelfstudies zult gebruiken. (Sommige helpers zijn al opgenomen in WebMatrix, maar u kunt ook anderen installeren.) In de bijlage vindt u een snel overzicht van de meegeleverde helpers en andere helpers die u kunt installeren als onderdeel van een pakket met de naam ASP.NET Web Helpers-bibliotheek. De volgende procedure laat zien hoe u de Administration-tool gebruikt om de ASP.NET Web Helpers-bibliotheek te installeren. Je zult enkele van deze helpers gebruiken in deze tutorial en andere tutorials in deze serie.
Nadat je hebt geklikt Maak een wachtwoord, een beveiligingscontrolepagina die eruit ziet als de volgende schermafbeelding, vraagt u om veiligheidsredenen de naam van het wachtwoordbestand te wijzigen. Als dit de eerste keer is dat u deze pagina ziet, probeer dan het bestand nog niet te hernoemen. Ga verder met de volgende stap en volg de aanwijzingen daar.
Als u ooit andere feedlocaties wilt weergeven, klikt u op Pakketbronnen beheren koppeling om feeds toe te voegen, te wijzigen of te verwijderen.
Op deze pagina kunt u ook pakketten de-installeren en u kunt de pagina gebruiken om pakketten bij te werken wanneer er nieuwere versies beschikbaar zijn. Je kunt naar de Laten zien vervolgkeuzelijst en klik op geïnstalleerd om de pakketten weer te geven die u hebt geïnstalleerd, of klik op updates om beschikbare updates voor de geïnstalleerde pakketten weer te geven.
Notitieяя De standaardsjablonen voor websites (Bakkerij, Kalender, Fotogallerij, en Starterssite) zijn beschikbaar in versies van C # en Visual Basic. U kunt de Visual Basic-sjablonen installeren met behulp van de Beheer van ASP.NET-webpagina's tool in WebMatrix. Open de Administration-tool zoals beschreven in deze sectie en zoek naar VB, en installeer vervolgens de sjablonen die u nodig hebt. Website-sjablonen worden geïnstalleerd in de hoofdmap van uw site in een map met de naam Microsoft-sjablonen.
In het volgende gedeelte ziet u hoe gemakkelijk het is om code toe te voegen aan de default.cshtml pagina om een dynamische pagina te maken.
In deze procedure maakt u een pagina die een eenvoudige code gebruikt om de datum en tijd van de server op de pagina weer te geven. Het voorbeeld hier laat u kennismaken met de Razor-syntaxis waarmee u code kunt insluiten in de HTML op ASP.NET-webpagina's. (Je kunt hier meer over lezen in de volgende tutorial.) De code introduceert een van de helpers waarover je eerder in de tutorial hebt gelezen.
Hallo wereldpagina Hallo wereldpagina
Hallo Wereld!
De tijd is @ DateTime.Now
De pagina bevat gewone HTML-markup, met één toevoeging: de @ teken markeert ASP.NET-programmacode.
De enkele regel code die je hebt toegevoegd, doet al het werk om de huidige tijd op de server te bepalen, deze te formatteren voor weergave en naar de browser te verzenden. (U kunt opmaakopties opgeven, dit is standaard.)
Stel dat je iets ingewikkelder wilt doen, zoals het weergeven van een scrolllijst met tweets van een Twitter-gebruiker die je selecteert. Je kunt daarvoor een hulpje gebruiken; Zoals eerder opgemerkt, is een helper een onderdeel dat veelvoorkomende taken vereenvoudigt. In dit geval moet al het werk dat u anders zou moeten doen een Twitter-feed ophalen en weergeven.
Twitter-feed Twitter-feed
Deze HTML maakt een formulier dat een tekstvak weergeeft voor het invoeren van een gebruikersnaam, plus een voorleggen knop. Deze staan tussen de eerste set Tussen de tweede set Dit voorbeeld heeft u een beetje laten zien hoe u WebMatrix kunt gebruiken en hoe u dynamische webpagina's kunt programmeren met behulp van eenvoudige ASP.NET-code met behulp van de Razor-syntaxis. De volgende zelfstudie gaat dieper in op de code. In de volgende zelfstudies ziet u hoe u code kunt gebruiken voor veel verschillende soorten websitetaken. Naast het gebruik van WebMatrix om ASP.NET Razor-pagina's te programmeren, kunt u ook Visual Studio 2010 gebruiken, een van de volledige edities of de gratis Visual Web Developer Express-editie. Als u Visual Studio of Visual Web Developer gebruikt om ASP.NET Razor-pagina's te bewerken, krijgt u twee programmeertools die uw productiviteit kunnen verbeteren: IntelliSense en de debugger. IntelliSense werkt in de editor door contextkeuze keuzes weer te geven. Wanneer u bijvoorbeeld een HTML-element invoert, toont IntelliSense u een lijst met kenmerken die het element kan hebben en kan het u zelfs laten zien voor welke waarden u die kenmerken kunt instellen. IntelliSense werkt voor HTML, JavaScript en C # en Visual Basic (de programmeertalen die u gebruikt voor ASP.NET Razor-pagina's.) Met de foutopsporing kunt u een programma stoppen terwijl het wordt uitgevoerd. U kunt dan zaken als de waarden van variabelen bekijken en u kunt regel voor regel door het programma bladeren om te zien hoe het werkt. Om met ASP.NET Razor Pages in Visual Studio te werken, hebt u de volgende software nodig die op uw computer is geïnstalleerd: Notitieяя U kunt zowel Visual Web Developer 2010 Express als ASP.NET MVC 3 installeren met behulp van het Web Platform Installer. Als u Visual Studio hebt geïnstalleerd en u een website in WebMatrix bewerkt, kunt u de site in Visual Studio starten om te profiteren van IntelliSense en de debugger. Nadat de site in Visual Studio is geopend, ziet u de sitestructuur in Visual Studio in de Solution Explorer ruit. De volgende illustratie toont de website geopend in Visual Web Developer 2010 Express: Voor een overzicht van het gebruik van IntelliSense en de foutopsporing met ASP.NET Razor-pagina's in Visual Studio, zie het appendix ASP.NET Web Pages Visual Studio. U hoeft de WebMatrix-editor niet te gebruiken om een ASP.NET-webpagina te maken en testen. Om de pagina te maken, kunt u elke teksteditor gebruiken, inclusief Kladblok. Zorg er wel voor dat u pagina's opslaat met behulp van de .cshtml bestandsnaamextensie. (Of .vbhtml als u Visual Basic wilt gebruiken) De gemakkelijkste manier om te testen .cshtml pagina's is om de webserver (IIS Express) te starten met WebMatrix Rennen knop. Als u de WebMatrix-tool echter niet wilt gebruiken, kunt u de webserver uitvoeren vanaf de opdrachtregel en deze koppelen aan een specifiek poortnummer. Vervolgens geeft u die poort op wanneer u hierom vraagt .cshtml bestanden in uw browser. Open in Windows een opdrachtprompt met beheerdersbevoegdheden en ga naar de volgende map: C: \ Program Files \ IIS Express Voor 64-bit-systemen gebruikt u deze map: C: \ Program Files (x86) \ IIS Express Voer de volgende opdracht in, gebruikmakend van het daadwerkelijke pad naar uw site: Het maakt niet uit welk poortnummer u gebruikt, zolang de poort nog niet door een ander proces is gereserveerd. (Poortnummers boven 1024 zijn meestal gratis.) Gebruik voor de padwaarde het pad van de website waarop de .cshtml bestanden zijn die je wilt testen. Nadat deze opdracht is uitgevoerd, kunt u een browser openen en naar a bladeren .cshtml bestand, zoals dit: http: // localhost: 35896 / default.cshtml Voor hulp bij de IIS Express-opdrachtregelopties, voert u in @ teken.) De eerste keer dat deze pagina wordt weergegeven of wanneer de gebruiker klikt voorleggen maar laat het tekstvak leeg, de voorwaardelijke uitdrukking Vraag [ "TwitterUser"]. IsEmpty zal waar zijn. In dat geval toont de pagina een Twitter-feed die zoekt naar de term "microsoft". Anders toont de pagina een Twitter-feed voor elke gebruikersnaam die u in het tekstvak hebt ingevoerd. 
Programmeren van ASP.NET Razor-pagina's in Visual Studio
Maken en testen van ASP.NET-pagina's met behulp van uw eigen teksteditor
iisexpress.exe / port: 35896 / pad: C: \ BasicWebSiteiisexpress.exe /? op de opdrachtregel.
Accentsconagua