Oefening: code schrijven om een webtoepassing te implementeren

5 minuten

In deze les gebruikt u ontwikkelhulpprogramma's om de code voor een starter-webtoepassing te maken.

Een nieuw webproject maken

De kern van de .NET CLI-hulpprogramma's is het opdrachtregelprogramma dotnet. Met deze opdracht maakt u een nieuw ASP.NET Core-webproject.

Voer de volgende opdracht uit om een nieuwe ASP.NET Core Model-View Cotroller -toepassing (MVC) met de naam 'BestBikeApp' te maken:

dotnet new mvc --name BestBikeApp

Met de opdracht maakt u een nieuwe map met de naam 'BestBikeApp' om uw project op te slaan. Als u uw app lokaal wilt testen, moet de .NET SDK op uw systeem zijn geïnstalleerd.

Om een starter-webtoepassing te maken, gebruiken we Maven, een veelgebruikt hulpprogramma voor projectbeheer en build voor Java-apps. We gebruiken de maven-archetype-webapp sjabloon om de code voor onze webtoepassing te genereren.

Voer nu de volgende opdrachten uit in Azure Cloud Shell om een nieuwe web-app te maken:

cd ~
mvn archetype:generate -DgroupId=example.demo -DartifactId=helloworld -DinteractiveMode=false -DarchetypeArtifactId=maven-archetype-webapp -DarchetypeVersion=1.5

Voer nu deze commando's uit om naar de nieuwe "helloworld" toepassingsmap te gaan en de toepassing voor implementatie in te pakken:
```
cd helloworld
mvn package
```
Wanneer de opdracht is uitgevoerd, voert u deze opdrachten uit om de doelmap te openen en de inhoud ervan weer te geven:
```
cd target
ls
```

U hebt nu een bestand met de naam helloworld.war dat het webtoepassingspakket is dat we gaan implementeren in App Service.

Als u een starters-Node.js-webtoepassing wilt maken, gebruiken we Node Pakketbeheer (npm) samen met javaScript-code om de werkelijke verwerking van webpagina's uit te voeren.

Voer de volgende opdrachten uit in de terminal om een nieuw package.json bestand te maken dat de Node.js-toepassing beschrijft:

cd ~
mkdir helloworld
cd helloworld
cat >package.json <<EOL
{
  "name": "helloworld",
  "version": "1.0.0",
  "scripts": {
    "start": "node index.js"
  }
}
EOL

Er wordt een nieuw package.json bestand gemaakt in de huidige map. U vindt deze in de huidige map als u in het terminalvenster invoert ls . We hebben een JavaScript-bestand nodig om onze websitelogica uit te voeren. Voor dit basisvoorbeeld hebben we slechts één bestand nodig: index.js.

Maak het bestand door de volgende opdracht uit te voeren in de terminal:

cat >index.js <<EOL
const http = require('http');

const server = http.createServer(function(request, response) { 
    response.writeHead(200, { "Content-Type": "text/html" });
    response.end("<html><body><h1>Hello World!</h1></body></html>");
});

const port = process.env.PORT || 1337;
server.listen(port);

console.log(\`Server running at http://localhost:\${port}\`);
EOL

Als u uw app lokaal wilt testen, moet Node.js en npm op uw systeem zijn geïnstalleerd.

Voor het maken van een starter-webtoepassing gebruiken we het Flask-webtoepassingsframework.

Voer de volgende opdrachten uit in Azure Cloud Shell om een virtuele omgeving in te stellen en Flask in uw profiel te installeren:
```
python3 -m venv venv
source venv/bin/activate
pip install flask
```
Voer deze opdrachten uit om je nieuwe webapp-map te maken en over te schakelen:
```
mkdir ~/BestBikeApp
cd ~/BestBikeApp
```

Maak een nieuw bestand met de naam application.py met een standaard HTML-antwoord:

cat >application.py <<EOL
from flask import Flask
app = Flask(__name__)

@app.route("/")
def hello():
    return "<html><body><h1>Hello Best Bike App!</h1></body></html>\n"
EOL

Als u uw toepassing wilt implementeren in Azure, moet u de lijst met toepassingsvereisten opslaan die u hiervoor hebt gemaakt in een requirements.txt-bestand . Voer hiertoe de volgende opdrachten uit:
```
pip freeze > requirements.txt
```

Als u uw app lokaal wilt testen, moet Python 3 en Flask op uw systeem zijn geïnstalleerd.

Feedback

Is deze pagina nuttig?