Scribd
Upload
2 views

creating web page

This document provides a step-by-step guide for creating a webpage for the Kogi State Surveys Department using ASP.NET Core and C#. It covers setting up the development environment, creating a new project, designing the user interface, adding navigation and styling, and running the application. Additionally, it includes instructions for adding more pages like About and Contact.

Uploaded by

Yahaya Kareem
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
2 views

creating web page

This document provides a step-by-step guide for creating a webpage for the Kogi State Surveys Department using ASP.NET Core and C#. It covers setting up the development environment, creating a new project, designing the user interface, adding navigation and styling, and running the application. Additionally, it includes instructions for adding more pages like About and Contact.

Uploaded by

Yahaya Kareem
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

Powered by AI

Copilot

Creating a webpage for the Kogi State Surveys Department using C# involves setting up an ASP.NET Core
web application. Here’s a step-by-step guide to help you get started:

1. Setting Up Your Environment


1. Install Visual Studio: Download and install Visual Studio from here.
2. Install .NET SDK: Ensure you have the .NET SDK installed. You can download it from here.

2. Creating a New ASP.NET Core Project

1. Open Visual Studio: Launch Visual Studio.


2. Create a New Project: Go to File > New > Project.
3. Select Project Template: Choose “ASP.NET Core Web App (Model-View-Controller)” and click
“Next”.
4. Configure Your Project: Enter the project name (e.g., KogiStateSurveys) and location, then click
“Create”.
5. Select Framework: Choose the latest .NET version and click “Create”.

3. Designing the User Interface


1. Add Controllers and Views:

Controller: Right-click on the Controllers folder, select Add > Controller, and choose MVC
Controller - Empty. Name it HomeController.
View: Right-click on the Views folder, create a new folder named Home, and add a new Razor View
named Index.cshtml.

2. HomeController.cs:
using Microsoft.AspNetCore.Mvc;

namespace KogiStateSurveys.Controllers
{
public class HomeController : Controller
{
public IActionResult Index()
{
return View();
}
}
}

3. Index.cshtml:
@page
@model KogiStateSurveys.Pages.IndexModel
@{
ViewData["Title"] = "Kogi State Surveys Department";
}

<h1>@ViewData["Title"]</h1>
<p>Welcome to the Kogi State Surveys Department.</p>

4. Adding Navigation and Styling

1. Layout.cshtml: Modify the _Layout.cshtml file in the Views/Shared folder to include navigation links.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] - KogiStateSurveys</title>
<link rel="stylesheet" href="~/css/site.css" />
</head>
<body>
<header>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/Home/About">About</a></li>
<li><a href="/Home/Contact">Contact</a></li>
</ul>
</nav>
</header>
<main role="main" class="pb-3">
@RenderBody()
</main>
<footer>
<p>&copy; 2024 - KogiStateSurveys</p>
</footer>
</body>
</html>

5. Running Your Application


1. Build and Run: Press F5 to build and run your application. This will launch your web browser and
display your new webpage.

6. Adding More Pages

1. About and Contact Pages:


About.cshtml:
@page
@model KogiStateSurveys.Pages.AboutModel
@{
ViewData["Title"] = "About";
}

<h1>@ViewData["Title"]</h1>
<p>Information about the Kogi State Surveys Department.</p>

Contact.cshtml:
@page
@model KogiStateSurveys.Pages.ContactModel
@{
ViewData["Title"] = "Contact";
}

<h1>@ViewData["Title"]</h1>
<p>Contact details for the Kogi State Surveys Department.</p>

Additional Resources
ASP.NET Core Documentation
Creating a Web App with ASP.NET Core

This should give you a solid foundation to build upon. If you need more specific features or further
customization, feel free to ask!

You might also like