项目组成说明
1.launchSettings.json
launchSettings.json里面记录了网站运行时的配置。
{
"iisSettings": {
"windowsAuthentication": false,
"anonymousAuthentication": true,
"iisExpress": {
"applicationUrl": "http://localhost:45224",
"sslPort": 0
}
},
"profiles": {
"PersonalSoftwareDevelopmentRecordWebsite": {
"commandName": "Project",
"dotnetRunMessages": true,
"launchBrowser": true,
"applicationUrl": "http://localhost:5009",
"environmentVariables": {
"ASPNETCORE_ENVIRONMENT": "Development"
}
},
"IIS Express": {
"commandName": "IISExpress",
"launchBrowser": true,
"environmentVariables": {
"ASPNETCORE_ENVIRONMENT": "Development"
}
}
}
}
最常用的applicationUrl地址，一个是IIS运行的地址，一个是项目运行的地址。
2.wwwroot
在wwwroot里面可以存放我们的css,js,image等一些资源，以及.net框架给我们封装好了一些可直接调用的资源在lib文件夹下的bootstrap，jQuery可以说非常方便，里面有bootstrap的官网案例。
注意:在wwwroot下的资源路径调用
"~/xxx"代表在wwwroot文件夹下的资源，例如调用wwwroot文件夹下的图片路径：
<img src="~/images/ghs.png" />
还有利用bootstrap框架搭建的轮播图代码：
<div id="carouselExampleCaptions" class="carousel slide" data-bs-ride="carousel" data-bs-touch="false">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="3" aria-label="Slide 4"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="~/images/0.png" class="d-block w-100" alt="0" data-bs-interval="2000">
<div class="carousel-caption d-none d-md-block">
<h5>First</h5>
<p>游戏的开始会遇到一只蜗牛.</p>
</div>
</div>
<div class="carousel-item">
<img src="~/images/1.png" class="d-block w-100" alt="1" data-bs-interval="2000">
<div class="carousel-caption d-none d-md-block">
<h5>Second</h5>
<p>当你遇到蜗牛时它会躲起来.</p>
</div>
</div>
<div class="carousel-item">
<img src="~/images/2.png" class="d-block w-100" alt="2" data-bs-interval="2000">
<div class="carousel-caption d-none d-md-block">
<h5>Third</h5>
<p>地图中有野猪在巡逻.</p>
</div>
</div>
<div class="carousel-item">
<img src="~/images/3.png" class="d-block w-100" alt="2" data-bs-interval="2000">
<div class="carousel-caption d-none d-md-block">
<h5>Fourth</h5>
<p>空中有大马蜂在巡逻.</p>
</div>
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
3.mvc和辅助工具
第一步、创建控制器
代码如下：
using Microsoft.AspNetCore.Mvc;
namespace PersonalSoftwareDevelopmentRecordWebsite.Controllers
{
public class ExperienceShareController : Controller
{
public IActionResult Index()
{
return View();
}
}
}
第二步、创建视图控制
右键点击Index()方法，添加视图
View文件夹下这里会多出来
第三步、编辑页代码编写
在index.cshtml中编写
代码如下：
@{
ViewData["Title"] = "经验分享";
}
<h1>@ViewData["Title"]</h1>
<p>在这儿我将为大家介绍我软件开发的经验分享.</p>
第五步，页面跳转方法
1.找到shared文件夹下的_layout
页面跳转代码部分
<nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
<div class="container-fluid">
<a class="navbar-brand" asp-area="" asp-controller="Home" asp-action="Index">我的主页</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target=".navbar-collapse" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse d-sm-inline-flex justify-content-between">
<ul class="navbar-nav flex-grow-1">
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-controller="GrowingUpExperience" asp-action="Index">成长经历</a>
</li>
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-controller="ExperienceShare" asp-action="Index">经验分享</a>
</li>
<li class="nav-item">
<a class="nav-link text-dark" asp-area="" asp-controller="HeartUnderstand" asp-action="Index">心得体会</a>
</li>
</ul>
</div>
</div>
</nav>
4.program
http管线设置
var builder = WebApplication.CreateBuilder(args);
// Add services to the container.
builder.Services.AddControllersWithViews();
var app = builder.Build();
// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
app.UseExceptionHandler("/Home/Error");
}
app.UseStaticFiles();
app.UseRouting();
app.UseAuthorization();
app.MapControllerRoute(
name: "default",
pattern: "{controller=Home}/{action=Index}/{id?}");
app.Run();