Maak een website met Asp.Net en Monodevelop op Linux

Naast het ontwikkelen van web in Windows hebben we Visual Studio .Net en de IIS-server, in Linux kunnen we Monodevelop en de Apache-server gebruiken met de XSP-module.

ASP.NET met Apache

De module mod_mono Apache gebruikt om applicaties uit te voeren ASP.NET op de Apache-webserver.
De module mod_mono draait binnen een Apache-proces en geeft alle verzoeken van ASP.NET-applicaties door aan een extern Mono-proces dat als host fungeert voor ASP.NET-applicaties.

We zullen Monodevelop op Linux installeren

 sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys 3FA7E0328081BFF6A14DA29AA6A19B38D3D831EF echo "deb http://download.mono-project.com/repo/debian wheezy main" | sudo tee /etc/apt/sources.list.d/mono-xamarin.list sudo apt-get update 

We zullen de server installeren voor het testen van XSP 4 op Linux

 sudo apt-get install mono-xsp4-base

Wat is XPS?XSP is een server om te gebruiken in ontwikkelingstests, als we een server of webtoepassing professioneel willen laten draaien, is het beter om Apache en mod_mono te gebruiken, zodat we de schaalbaarheid en veiligheid bereiken die Apache biedt.
Dan gaan we open MonoDevelop en wij selecteren Nieuw project (Op de welkomstpagina of in het menu Bestand), om het dialoogvenster te openen Nieuwe oplossing. Vouw in de lijst met projecttypen aan de linkerkant de categorie C # uit en selecteer de optie ASP.NET.

We kennen een naam toe aan het Aspnet-voorbeeldproject en selecteren een map waar het project moet worden opgeslagen.
Wanneer we beginnen, zullen we zien dat de standaardbestanden in de projecten worden gegenereerd, dit zijn:

• Standaard.aspx die de startpagina zal zijn.
• Global.asax wat het bestand zal zijn met globale instellingen van de c#-code voor de functionaliteit van de website.
• Web.config Het is het xml-bestand met de eigen instellingen van de website.

Structuur van het web

We zullen de structuur van een website definiëren waarbij we sommige delen van een sitepagina moeten herhalen, zoals de koptekst, het menu en om die code niet op alle pagina's te herhalen, kunnen we een hoofdpagina maken en verwijs ernaar op de andere pagina's.

Basispagina's op ASP.net hebben de bestandsextensie .meester en in de sectoren waar we willen dat het web dynamisch is of de inhoud verandert, gebruiken we een object genaamd InhoudPlaatsHouder, in de structuur van de pagina's kunnen we html of html5, css en js gebruiken.
We gaan de hoofdpagina of hoofdpagina maken, hiervoor gaan we Bestand> ASP.NET Webforms> hoofdpagina met Codebihind, we zullen haar bellen thuis.meester
Binnen home.master schrijven we de html-structuur van het web

 Mijn Web ASP.netMijn Web ASP.net-demo

Nu maken we het css-bestand met de naam styles.css en plaatsen we het in dezelfde map van het project.

 lichaam {achtergrond: # f8f8f8; marge: 0; opvulling: 0; lettergrootte: 11px; lijnhoogte: 16px; font-family: Arial, Tahoma;} a {kleur: # 333333;} a: hover {text-decoration: none;} #head {background: # 258dc8 repeat-x; doosschaduw: 0 0 20px # f2f2f2 inzet; hoogte: 100px; } #logo {breedte: 780px; marge: 0; opvulling: 8px; } #logo a {kleur: #FFFFFF; tekstdecoratie: geen; lettergewicht: vet; hoogte: 12px; lettergrootte: 20px; text-transform: hoofdletters;} #logo a: hover {} #menu {background: # 666666; width: 1000px; margin-top: 33px; padding: 0px; display: inline-block;} #menu ul {background: blue breedte: 780px; marge: 0 automatisch; margin-top: 3px; lijststijl: geen; opvulling: 0; text-align: left;} #menu ul li {display: inline} #menu ul a {display: block; zweven: links; lettergewicht: vet; lettergrootte: 13px; tekstdecoratie: geen; kleur: #fff; opvulling: 8px 10px; breedte: 118px; tekst uitlijnen: midden; text-transform: hoofdletters;} #menu ul a: hover {color: # 232323;} #menu ul a.active {color: # 232323;} #menu ul a.active: hover {color: # 232323;} #container {breedte: 1000px; marge: 0 auto;} #body {breedte: 100%; marge: 0px; zweven: links;} # grote afbeelding {hoogte: 150px; niet herhalen # fe5d00; opvulling: 30px 0 30px 50px; regelhoogte: 24px;} #content {zwevend: links; achtergrond: #ffffff herhaal-x; marge: 0px; breedte: 750px; kleur: # 6f6e6e; opvulling: 10px; } #column {float: links; achtergrondkleur: #cccccc; rand: 1px effen # e3e3e3; grens-radius: 4px; doosschaduw: 0 0 20px # f2f2f2 inzet; herhaal-x; marge: 0px; breedte: 200px; kleur: # 6f6e6e; opvulling: 10px; } #taart {achtergrond: # 333333; herhaal-x; hoogte: 40px; marge-top: 20px; clear: both;} Vervolgens zullen we in het home.master-bestand het ASP.NET-menu toevoegen

Met dit menubesturingselement kunnen we verschillende eigenschappen toewijzen, zoals oriëntatie, grootte, achtergrondkleur, het kan visueel worden ontworpen in Visual Studio.net in Monodevelop. Het is handig voor ons om het vanuit CSS te verwerken. We moeten ook de inhoudsgebieden of blokken voor de kolom en de webinhoud definiëren met het ContentPlaceHolder-besturingselement
Voor de kolom is de code de volgende:

Voor de inhoud is de code de volgende:

Voor de voet zullen we het voetblok definiëren en de code is als volgt:

Vervolgens moeten we aangeven welke het startweb zal zijn om te laten zien dat zal worden gekoppeld aan de hoofdpagina, in het bestand Standaard.aspx We verwijderen de standaardinhoud en schrijven de volgende code:

Hier geven we aan welke de hoofdpagina is, het bestand waar de code staat van de pagina die we gaan tonen en wat in dit geval de pagina is Standaard.
We verwijzen ook naar de dynamische zones om er inhoud aan toe te voegen. De ID-kolom kan elke naam zijn om die specifieke inhoud te identificeren:

Secties

verkoop
nieuwe auto's
Tweedehands auto's

Zoeken: 

Het inhoudsblok dat we een afbeelding toewijzen:

We moeten ook aangeven wat de startpagina is via de load-gebeurtenis in het bestand Default.aspx.cs, we schrijven de load-gebeurtenis

 openbare gedeeltelijke klasse Standaard: System.Web.UI.Page {protected void Page_Load (objectafzender, EventArgs e) {}} 

Laten we eens kijken hoe het web eruitziet in Monodevelop fon F5 of vanuit het menu Uitvoeren

We voegen de Services-pagina toe, we zullen Bestanden> Nieuw bestand> ASP.Net-webformulieren en we selecteren de optie Inhoudsformulier met Codebihind en het zal ons een dialoogvenster tonen om de hoofdpagina te selecteren waarnaar het in dit geval zal linken Home.meester

Open het bestand Diensten.aspx en we voegen de volgende code toe:

Diensten

Auto-accessoires
Motoren en besturing
Plaatwerk en verf
Auto-elektronica

Zoeken:
Wij zijn een bedrijf dat zich toelegt op de reparatie en het onderhoud van airconditioning in auto's en we bieden een breed scala aan diensten voor uw voertuig

We voeren opnieuw uit om de wijzigingen te compileren en we zullen zien dat het indrukken van het menu Services de inhoud van de kolom en het inhoudsblok verandert:

Tot slot definiëren we de structuur voor de Contact-pagina. We voegen de Contact-pagina toe, we zullen Bestanden> Nieuw bestand> ASP.Net-webformulieren en we selecteren de optie Inhoudsformulier met Codebihind en het zal ons een dialoogvenster tonen om de hoofdpagina te selecteren waarnaar het in dit geval zal linken Home.meester
We openen het bestand Contact.aspx en we voegen de volgende code toe:

 
Contact
 
 
Telefoon
 
XXXXXXX
 

 
 
Publieke aandacht
maandag tot vrijdag
09:00 tot 17:00
 

 
 
E-mail
 
[email protected]

 

 
 
 
Naam:
 
 

 
 
E-mailadres:
 
 

 
 
Bericht:
 
 

 
 
 
 

 

 

We voeren het opnieuw uit om het web te compileren en het in onze browser te laten verschijnen en naar het menu te gaan Contact, zal het resultaat het volgende zijn:

Zo zien we hoe de dynamische kolommen de inhoud hebben veranderd, maar het menu en de koptekst zijn nooit veranderd en we hebben ze altijd hergebruikt zonder ze te herschrijven. Tot nu toe zagen we hoe maak je een masterpage met c # en MonodevelopWe kunnen ook een web maken met dynamische gegevens met Mysql of SqlServer, om het web op een echte server te testen, we hebben een server nodig die asp.net ondersteunt, er zijn er verschillende gratis, upload het web via ftp en upload alle projectbestanden.