Créer un site Web avec Asp.Net et Monodevelop sous Linux

En plus de développer le Web sous Windows, nous avons Visual Studio .Net et le serveur IIS, sous Linux, nous pouvons utiliser Monodevelop et le serveur Apache avec le module XSP.

ASP.NET avec Apache

Le module mod_mono Apache utilisé pour exécuter des applications ASP.NET sur le serveur Web Apache.
Le module mod_mono s'exécute à l'intérieur d'un processus Apache et transmet toutes les demandes des applications ASP.NET à un processus Mono externe qui héberge les applications ASP.NET.

Nous allons installer Monodevelop sur Linux

 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 

Nous allons installer le serveur pour tester XSP 4 sur Linux

 sudo apt-get install mono-xsp4-base

Qu'est-ce que XPS ?XSP est un serveur à utiliser dans les tests de développement, si nous voulons avoir un serveur ou une application Web fonctionnant de manière professionnelle, il est préférable d'utiliser Apache et mod_mono, ainsi nous obtiendrons l'évolutivité et la sécurité qu'Apache fournit.
Puis on ouvre MonoDévelopper et nous sélectionnons Nouveau projet (Sur la page d'accueil ou dans le menu Fichier), pour ouvrir la boîte de dialogue Nouvelle solution. Dans la liste des types de projets sur la gauche, développez la catégorie C # et sélectionnez l'option ASP.NET.

Nous attribuons un nom à l'exemple de projet Aspnet et sélectionnons un répertoire dans lequel enregistrer le projet.
Lorsque nous commencerons, nous verrons que les fichiers par défaut sont générés dans les projets, ce sont :

• Default.aspx qui sera la page d'accueil.
• Global.asax qui sera le fichier avec les paramètres globaux du code c# pour la fonctionnalité du site Web.
• Web.config Il s'agit du fichier xml avec les propres paramètres du site Web.

Structure du Web

Nous définirons la structure d'un site Web où nous aurons besoin de répéter certaines parties d'une page de site telles que l'en-tête, le menu et afin de ne pas répéter ce code dans toutes les pages, nous pouvons créer une page maître. et référencez-le dans les autres pages.

Les pages maîtres sur ASP.net ont l'extension de fichier .Maître et dans les secteurs où nous voulons que le web soit dynamique ou modifie le contenu, nous utilisons un objet appelé ContenuPlaceHolder, dans la structure des pages, nous pouvons utiliser html ou html5, css et js.
Nous allons créer la page maître ou page maître, pour cela nous allons Fichier> ASP.NET Webforms> page maître avec Codebihind, nous l'appellerons home.master
Dans home.master, nous écrivons la structure html du Web

 Mon Web ASP.netMa démo Web ASP.net

Maintenant, nous créons le fichier css qui s'appellera styles.css et nous le mettrons dans le même dossier du projet.

 corps {arrière-plan : # f8f8f8; marge : 0 ; remplissage : 0 ; taille de la police : 11px ; hauteur de ligne : 16 px ; font-family: Arial, Tahoma;} a {color: # 333333;} a: hover {text-decoration: none;} #head {background: # 258dc8 repeat-x; box-shadow : 0 0 20px # f2f2f2 encart ; hauteur : 100px ; } #logo {largeur : 780px ; marge : 0 ; remplissage : 8px ; } #logo a {couleur : #FFFFFF; texte-décoration : aucun; font-weight : gras ; hauteur : 12px ; taille de la police : 20px ; text-transform: majuscule;} #logo a: hover {} #menu {background: # 666666; width: 1000px; margin-top: 33px; padding: 0px; display: inline-block;} #menu ul {background: blue ; largeur : 780px ; marge : 0 automatique ; margin-top : 3px ;list-style : aucun ; remplissage : 0 ; text-align: left;} #menu ul li {display: inline} #menu ul a {display: block; flotteur : gauche ; font-weight : gras ; taille de la police : 13px ; texte-décoration : aucun; couleur : #fff ; rembourrage : 8px 10px ; largeur : 118px ; text-align : centre ; text-transform: majuscule;} #menu ul a: hover {color: # 232323;} #menu ul a.active {color: # 232323;} #menu ul a.active: hover {color: # 232323;} #container {largeur : 1000px ; marge : 0 auto ;} #body {largeur : 100 % ; marge : 0px ; float: left;} # largeimage {height: 150px; non-répétition # fe5d00; remplissage : 30px 0 30px 50px; line-height: 24px;} #content {float: left; arrière-plan : #ffffff répétition-x; marge : 0px ; largeur : 750px ; couleur : # 6f6e6e ; rembourrage : 10px ; } #colonne {flottement : gauche ; couleur d'arrière-plan : #cccccc; bordure : 1px solide # e3e3e3 ; rayon de bordure : 4px ; box-shadow : 0 0 20px # f2f2f2 encart ; répéter-x; marge : 0px ; largeur : 200px ; couleur : # 6f6e6e ; rembourrage : 10px ; } #tarte {arrière-plan : # 333333; répéter-x; hauteur : 40px ; marge supérieure : 20 px; clear: both;} Ensuite, dans le fichier home.master, nous ajouterons le menu ASP.NET

Ce contrôle Menu nous permet d'attribuer différentes propriétés telles que l'orientation, la taille, la couleur de fond, il peut être conçu visuellement dans Visual Studio.net dans Monodevelop il est pratique pour nous de le gérer à partir de CSS. Il faut aussi définir les zones ou blocs de contenu pour la colonne et le contenu web avec le contrôle ContentPlaceHolder
Pour la colonne le code sera le suivant :

Pour le contenu le code sera le suivant :

Pour le pied nous allons définir le bloc pied et le code sera le suivant :

Ensuite, nous devons indiquer quel sera le site Web de départ à afficher qui sera lié à la page maître, dans le fichier Default.aspx Nous supprimons le contenu par défaut et écrivons le code suivant :

Ici, nous indiquons quelle est la page maître quel est le fichier où est le code de la page que nous allons afficher et quelle est la page dans ce cas par défaut.
Nous référençons également les zones dynamiques pour y ajouter du contenu. La colonne ID peut être n'importe quel nom pour identifier ce contenu particulier :

Sections

Ventes
Nouvelles voitures
Véhicules d'occasion

Chercher: 

Le bloc de contenu auquel nous attribuons une image :

Il faut aussi indiquer quelle est la page d'accueil via l'événement load dans le fichier Default.aspx.cs, on écrit l'événement load

 classe partielle publique Par défaut : System.Web.UI.Page {protected void Page_Load (expéditeur d'objet, EventArgs e) {}} 

Voyons à quoi ressemble le Web dans Monodevelop fon F5 ou dans le menu Exécuter

Nous ajoutons la page Services, nous allons Fichiers> Nouveau fichier> Formulaires Web ASP.Net et nous sélectionnons l'option Formulaire de contenu avec Codebihind et il nous montrera une boîte de dialogue pour sélectionner la page maître à laquelle il sera lié dans ce cas Accueil.maître

Ouvrir le fichier Services.aspx et on ajoute le code suivant :

Prestations de service

Accessoires automobiles
Moteurs et direction
Tôlerie et Peinture
Électronique automobile

Chercher:
Nous sommes une entreprise dédiée à la réparation et à l'entretien de la climatisation automobile, et nous proposons une large gamme de services pour votre véhicule

Nous exécutons à nouveau pour compiler les modifications et nous verrons qu'appuyer sur le menu Services modifie le contenu de la colonne et du bloc de contenu :

Enfin, nous définissons la structure de la page Contact. Nous ajoutons la page Contact, nous allons Fichiers> Nouveau fichier> Formulaires Web ASP.Net et nous sélectionnons l'option Formulaire de contenu avec Codebihind et il nous montrera une boîte de dialogue pour sélectionner la page maître vers laquelle il sera lié dans ce cas Accueil.maître
Nous ouvrons le fichier Contact.aspx et on ajoute le code suivant :

 
Contact
 
 
Téléphone
 
XXXXXXXX
 

 
 
Attention au public
Du lundi au vendredi
09h00 à 17h00
 

 
 
E-mail
 
[email protected]

 

 
 
 
Nom:
 
 

 
 
E-mail:
 
 

 
 
Message:
 
 

 
 
 
 

 

 

Nous exécutons à nouveau pour compiler le Web et le faire apparaître dans notre navigateur et aller dans le menu Contact, le résultat sera le suivant :

Ainsi, nous voyons comment les colonnes dynamiques ont changé le contenu mais le menu et l'en-tête n'ont jamais changé et nous les avons toujours réutilisés sans les réécrire. Jusqu'ici nous avons vu comment créer une page maître avec c # et MonodevelopOn peut aussi créer un web avec des données dynamiques avec Mysql ou SqlServer, pour tester le web sur un vrai serveur, il faut un serveur qui supporte asp.net, il y en a plusieurs gratuits, uploader le web via ftp et uploader tous les fichiers du projet.