Simple Way to Create Your MVC APP for Curd Operation.
Database SQL Server
Step:1 Create Database For Student
Step:2 Create Table for Student use the following Script to create Table:-
USE [StudentDB]
GO
/****** Object: Table [dbo].[StudentInfo] Script Date: 12/13/2018 2:55:27 AM ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
CREATE TABLE [dbo].[StudentInfo](
[Roll] [int] IDENTITY(1,1) NOT NULL,
[Name] [varchar](100) NULL,
[Course] [varchar](100) NULL,
[Mobile] [varchar](100) NULL,
[Address] [varchar](100) NULL,
CONSTRAINT [PK_StudentInfo] PRIMARY KEY CLUSTERED
(
[Roll] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
GO
GO
/****** Object: Table [dbo].[StudentInfo] Script Date: 12/13/2018 2:55:27 AM ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
CREATE TABLE [dbo].[StudentInfo](
[Roll] [int] IDENTITY(1,1) NOT NULL,
[Name] [varchar](100) NULL,
[Course] [varchar](100) NULL,
[Mobile] [varchar](100) NULL,
[Address] [varchar](100) NULL,
CONSTRAINT [PK_StudentInfo] PRIMARY KEY CLUSTERED
(
[Roll] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
GO
Step:3 Create The following Procedure using below Scripts:-
Script For getStudentList:-
USE [StudentDB]
GO
/****** Object: StoredProcedure [dbo].[getStudentList] Script Date: 12/13/2018 3:00:38 AM ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
-- =============================================
-- Author: Dot Net By Priyanshu
-- Create date: 13-12-2018
-- Description: getStudentList is use to get all student records List.
-- =============================================
CREATE PROCEDURE [dbo].[getStudentList]
AS
BEGIN
SET NOCOUNT ON;
SELECT [Roll]
,[Name]
,[Course]
,[Mobile]
,[Address]
FROM [StudentDB].[dbo].[StudentInfo]
END
GO
/****** Object: StoredProcedure [dbo].[getStudentList] Script Date: 12/13/2018 3:00:38 AM ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
-- =============================================
-- Author: Dot Net By Priyanshu
-- Create date: 13-12-2018
-- Description: getStudentList is use to get all student records List.
-- =============================================
CREATE PROCEDURE [dbo].[getStudentList]
AS
BEGIN
SET NOCOUNT ON;
SELECT [Roll]
,[Name]
,[Course]
,[Mobile]
,[Address]
FROM [StudentDB].[dbo].[StudentInfo]
END
Script For ManageStudent:-
USE [StudentDB]
GO
/****** Object: StoredProcedure [dbo].[ManageStudent] Script Date: 12/13/2018 3:00:33 AM ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
-- =============================================
-- Author: Dot Net By Priyanshu
-- Create date: 13-12-2018
-- Description: ManageStudent is Use for Insert or Update the student Record.
-- =============================================
CREATE PROCEDURE [dbo].[ManageStudent](@Roll int
,@Name varchar(100)
,@Course varchar(100)
,@Mobile varchar(100)
,@Address varchar(100))
AS
BEGIN
SET NOCOUNT ON;
if(@Roll>0)
begin
update [StudentDB].[dbo].[StudentInfo] set [Name]=@Name,[Course]=@Course,[Mobile]=@Mobile,[Address]=@Address where Roll=@roll;
end
else
begin
insert into [StudentDB].[dbo].[StudentInfo]([Name],[Course],[Mobile],[Address]) values(@Name, @Course,@Mobile,@Address);
end END
GO
/****** Object: StoredProcedure [dbo].[ManageStudent] Script Date: 12/13/2018 3:00:33 AM ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
-- =============================================
-- Author: Dot Net By Priyanshu
-- Create date: 13-12-2018
-- Description: ManageStudent is Use for Insert or Update the student Record.
-- =============================================
CREATE PROCEDURE [dbo].[ManageStudent](@Roll int
,@Name varchar(100)
,@Course varchar(100)
,@Mobile varchar(100)
,@Address varchar(100))
AS
BEGIN
SET NOCOUNT ON;
if(@Roll>0)
begin
update [StudentDB].[dbo].[StudentInfo] set [Name]=@Name,[Course]=@Course,[Mobile]=@Mobile,[Address]=@Address where Roll=@roll;
end
else
begin
insert into [StudentDB].[dbo].[StudentInfo]([Name],[Course],[Mobile],[Address]) values(@Name, @Course,@Mobile,@Address);
end END
Script for getStudentDetail:-
USE [StudentDB]
GO
/****** Object: StoredProcedure [dbo].[getStudentDetail] Script Date: 12/13/2018 3:00:44 AM ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
-- =============================================
-- Author: Dot Net By Priyanshu
-- Create date: 13-12-2018
-- Description: getStudentDetails is use to get the particular student record.
-- =============================================
CREATE PROCEDURE [dbo].[getStudentDetail](@roll int)
AS
BEGIN
SET NOCOUNT ON;
SELECT [Roll]
,[Name]
,[Course]
,[Mobile]
,[Address]
FROM [StudentDB].[dbo].[StudentInfo] where Roll=@roll;
END
GO
/****** Object: StoredProcedure [dbo].[getStudentDetail] Script Date: 12/13/2018 3:00:44 AM ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
-- =============================================
-- Author: Dot Net By Priyanshu
-- Create date: 13-12-2018
-- Description: getStudentDetails is use to get the particular student record.
-- =============================================
CREATE PROCEDURE [dbo].[getStudentDetail](@roll int)
AS
BEGIN
SET NOCOUNT ON;
SELECT [Roll]
,[Name]
,[Course]
,[Mobile]
,[Address]
FROM [StudentDB].[dbo].[StudentInfo] where Roll=@roll;
END
Script For DeleteStudent:-
USE [StudentDB]
GO
/****** Object: StoredProcedure [dbo].[DeleteStudent] Script Date: 12/13/2018 3:00:48 AM ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
-- =============================================
-- Author: Dot Net By Priyanshu
-- Create date: 13-12-2018
-- Description: DeleteStudent is use to delete the particular existing student Record.
-- =============================================
ALTER PROCEDURE [dbo].[DeleteStudent](@roll int)
AS
BEGIN
SET NOCOUNT ON;
Delete FROM [StudentDB].[dbo].[StudentInfo] where Roll=@roll;
END
GO
/****** Object: StoredProcedure [dbo].[DeleteStudent] Script Date: 12/13/2018 3:00:48 AM ******/
SET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
-- =============================================
-- Author: Dot Net By Priyanshu
-- Create date: 13-12-2018
-- Description: DeleteStudent is use to delete the particular existing student Record.
-- =============================================
ALTER PROCEDURE [dbo].[DeleteStudent](@roll int)
AS
BEGIN
SET NOCOUNT ON;
Delete FROM [StudentDB].[dbo].[StudentInfo] where Roll=@roll;
END
Project
Add the MVC Project:-
Step:1 Click on file menu.
Step:2 Click on New.
Step:3 Click on Project.
Step:4 Select ASP.Net Web Application(.Net Framework)
Step:5 Write the project Name.
Step:6 Select MVC option.
Step:7 Click on Ok Button
Add DataLayer in Solution
Step:1 Right Click on Solution.
Step:2 Click on Add Option.
Step:3 Click on New Project.
Step:4 Click on Visual C# from Left Pane.
Step:5 Select Class Library(.Net Framework).
Step:6 Write Name of Class Library as "DataLayer".
Add Entity Framework in DataLayer
Step:1 Right Click on DataLayer.
Step:2 Click on Add Option.
Step:3 Click on New Item.
Step:4 Select ADO.Net Entity Data Model.
Step:5 Write name of Entity Data Model as "StudentDBEntities".
Step:6 Click on Add button.
Step:7 Select Ef Designer from Database.
Step:8 Click on Next button.
Step:9 Click On New Connetion button.
Step:10 Select/Enter Server Name.
Step:11 Select/Enter Database Name.
Step:12 Click On Ok button.
Step:13 Select Entity Version 6.x.
Step:14 Select Store Procedure.
Step:15 Click on Finish button.
Add Reference in Web App
1.Add DataLayer Reference in Web App.
2.Add EntityFramework.6.2.0 from Manage NuGet Packages and install it (if Error Occurs).
Add Model in App:-
Step:1 Right Click over the Model Folder.
Step:2 Click on Add Option.
Step:3 Click on New Item.
Step:4 Select Class Library.
Step:5 Write Class Name "StudentModel".
Step:6 Add the following Code in Model.
StudentModel
using DataLayer;
using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Data;
using System.Data.SqlClient;
using System.Linq;
using System.Web;
namespace MyFirstMVCApp.Models
{
public class StudentModel
{
#region Variable
// Created Global objStudentModel.
StudentModel objStudentModel = null;
#endregion
#region Properties
public int Roll { get; set; }
//Required field Validation using DataAnnotations.
[Required(ErrorMessage = "Name is Required!")]
//For Display the field Name.
[Display(Name = "Name")]
public string Name { get; set; }
//Required field Validation using DataAnnotations.
[Required(ErrorMessage = "Course is Required!")]
//For Display the field Name.
[Display(Name = "Course")]
public string Course { get; set; }
//Required field Validation using DataAnnotations.
[Required(ErrorMessage = "Mobile is Required!")]
//For Display the field Name.
[Display(Name = "Mobile")]
public string Mobile { get; set; }
//Required field Validation using DataAnnotations.
[Required(ErrorMessage = "Address is Required!")]
//For Display the field Name.
[Display(Name = "Name")]
public string Address { get; set; }
#endregion
#region ManageStudent
//Method for data Insert or Update. On the basis of roll when roll is zero then insert otherwise Update the record.
public int ManageStudent(StudentModel std)
{
using (var context = new StudentDBEntities())
{
//Declear SqlParameter and Assign value in it.
var roll = new SqlParameter("@Roll", SqlDbType.Int);
roll.Value = std.Roll;
var name = new SqlParameter("@Name", SqlDbType.VarChar);
name.Value = std.Name;
var course = new SqlParameter("@Course", SqlDbType.VarChar);
course.Value = std.Course;
var mobile = new SqlParameter("@Mobile", SqlDbType.VarChar);
mobile.Value = std.Mobile;
var address = new SqlParameter("@Address", SqlDbType.VarChar);
address.Value = std.Address;
var result = 0;
if (std.Roll != 0)
{
//Calling Procedure [dbo].[ManageStudent] with following Parameter @Roll,@Name,@Course,@Mobile,@Address
result = context.Database.ExecuteSqlCommand("Exec [dbo].[ManageStudent] @Roll,@Name,@Course,@Mobile,@Address", roll, name, course, mobile, address);
}
else
{
//Calling Procedure [dbo].[ManageStudent] with following Parameter @Roll,@Name,@Course,@Mobile,@Address
result = context.Database.ExecuteSqlCommand("Exec [dbo].[ManageStudent] @Roll,@Name,@Course,@Mobile,@Address", roll, name, course, mobile, address);
}
return result;
}
}
#endregion
#region Student Details
//Method for Get Student details for binding edit from for Update
public StudentModel StudentDetails(int roll)
{
objStudentModel = new StudentModel();
using (var context = new StudentDBEntities())
{
//calling Sql Procedure with roll Parameter to get Student details and set it in Model Properties using Linq.
objStudentModel = (from std in context.getStudentDetail(roll)
select new StudentModel
{
Roll = std.Roll,
Name = std.Name,
Course = std.Course,
Mobile = std.Mobile,
Address = std.Address
}).FirstOrDefault();
}
return objStudentModel;
}
#endregion
#region Student List
//Method for Get Students list to display in List.
public List<StudentModel> StudentList()
{
List<StudentModel> StdtList = new List<StudentModel>();
using (var Context = new StudentDBEntities())
{//calling Sql Procedure get Students details and set it in List Model Properties using Linq.
StdtList = (from std in Context.getStudentList()
orderby std.Roll ascending
select new StudentModel
{
Roll = std.Roll,
Name = std.Name,
Course = std.Course,
Mobile = std.Mobile,
Address = std.Address
}).ToList();
}
return StdtList;
}
#endregion
#region Delete Student
// Method for Delete the existing Records
public int DeleteStudent(int roll)
{
using (var Context = new StudentDBEntities())
{
// calling sql procedure with roll parameter to delete record.
var id = new SqlParameter("@roll", SqlDbType.Int);
id.Value = roll;
var result = Context.Database.ExecuteSqlCommand("exec [dbo].[DeleteStudent] @roll", id);
return result;
}
}
#endregion
}
}
Add StudentController in App:-
Step:1 Right Click over the Controller Folder.
Step:2 Click on Add Option.
Step:3 Click on Controller Option.
Step:4 Select MVC 5 Controller; Empty.
Step:5 Click on Add Button.
Step:6 Write the Name of Controller as "StudentController"
Step:7 Click on Add Button
Step:8 Add The following Code in Controller
StudentController
using MyFirstMVCApp.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace MyFirstMVCApp.Controllers
{
public class StudentController : Controller
{
#region Viriable and Object
// Created Global objStudentModel.
StudentModel studentModel = null;
#endregion
// GET: Student
public ActionResult Index()
{
return View();
}
//Action Method for Get RegisterStudent View.
[HttpGet]
public ActionResult RegisterStudent()
{
return View();
}
//Action Method for post the Student details to Model for Insert in Database
[HttpPost]
public ActionResult RegisterStudent(StudentModel std)
{
studentModel = new StudentModel();
int result = studentModel.ManageStudent(std);
if (result != 0)
{
TempData["Msg"] = "Record Inserted!";
}
else
{
TempData["Msg"] = "Record Not Inserted!";
}
return RedirectToAction("getStudentList");
}
//Action Method for Get the Existing Student Details For Update.
[HttpGet]
public ActionResult EditStudent(int id)
{
studentModel = new StudentModel();
studentModel=studentModel.StudentDetails(id);
return View(studentModel);
}
//Action method for past th student details to Update the Existing Student in Database
[HttpPost]
public ActionResult EditStudent(StudentModel std)
{
studentModel = new StudentModel();
int result = studentModel.ManageStudent(std);
if (result != 0)
{
TempData["Msg"] = "Record Updated!";
}
else
{
TempData["Msg"] = "Record Not Updated!";
}
return RedirectToAction("getStudentList");
}
//Action Method for get All Student Details in a List.
[HttpGet]
public ActionResult getStudentList()
{
List<StudentModel> studentList = new List<StudentModel>();
studentModel = new StudentModel();
studentList = studentModel.StudentList();
return View(studentList);
}
//Action Method for Delete The Existing Student
public ActionResult DeleteStudent(int id)
{
studentModel = new StudentModel();
int result=studentModel.DeleteStudent(id);
if (result < 0)
{
TempData["Msg"] = "Record Deleted!";
}
else
{
TempData["Msg"] = "Record Not Deleted!";
}
return RedirectToAction("getStudentList");
}
}
}
Views
Add getStudentList View in App
Step:1 Right Click Over the Action Method "public ActionResult getStudentList()".
Step:2 Click On Add View.
Step:3 Select Template List.
Step:4 Select Model Class "StudentModel (MyFirstMVCApp.Models)"
Step:5 Click on Add Button.
Step:6 Add the Following Code Which is highlighted.
@model IEnumerable<MyFirstMVCApp.Models.StudentModel>
@{
ViewBag.Title = "getStudentList";
}
<h2>getStudentList</h2>
<p>
@Html.ActionLink("Create New", "RegisterStudent")
</p>
<p>
@TempData["Msg"]
</p>
<table class="table">
<tr>
<th>
@Html.DisplayNameFor(model => model.Roll)
</th>
<th>
@Html.DisplayNameFor(model => model.Name)
</th>
<th>
@Html.DisplayNameFor(model => model.Course)
</th>
<th>
@Html.DisplayNameFor(model => model.Mobile)
</th>
<th>
@Html.DisplayNameFor(model => model.Address)
</th>
<th></th>
</tr>
@foreach (var item in Model)
{
<tr>
<td>
@Html.DisplayFor(modelItem => item.Roll)
</td>
<td>
@Html.DisplayFor(modelItem => item.Name)
</td>
<td>
@Html.DisplayFor(modelItem => item.Course)
</td>
<td>
@Html.DisplayFor(modelItem => item.Mobile)
</td>
<td>
@Html.DisplayFor(modelItem => item.Address)
</td>
<td>
@Html.ActionLink("Edit", "EditStudent", new { id = item.Roll }) |
@Html.ActionLink("Delete", "DeleteStudent", new { id = item.Roll })
</td>
</tr>
}
</table>
Add RegisterStudent View in App
Step:1 Right Click Over the Action Method " public ActionResult RegisterStudent()".
Step:2 Click On Add View.
Step:3 Select Template Create.
Step:4 Select Model Class "StudentModel (MyFirstMVCApp.Models)"
Step:5 Click on Add Button.
Step:6 Delete or Comment the div which have Roll.
Step:7 Add the Following Code Which is highlighted.
@model MyFirstMVCApp.Models.StudentModel
@{
ViewBag.Title = "RegisterStudent";
}
<h2>RegisterStudent</h2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>StudentModel</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Course, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Course, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Course, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Mobile, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Mobile, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Mobile, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Address, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Address, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Address, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Create" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
@Html.ActionLink("Back to List", "getStudentList")
</div>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}
Add EditStudent View in App
Step:1 Right Click Over the Action Method " public ActionResult EditStudent()".
Step:2 Click On Add View.
Step:3 Select Template Edit.
Step:4 Select Model Class "StudentModel (MyFirstMVCApp.Models)"
Step:5 Click on Add Button.
Step:6 Change the TextBoxfor in HiddenFor only Roll which already highlighted..
Step:7 Add the Following Code Which is highlighted.
@model MyFirstMVCApp.Models.StudentModel
@{
ViewBag.Title = "EditStudent";
}
<h2>EditStudent</h2>
@using (Html.BeginForm())
{
@Html.AntiForgeryToken()
<div class="form-horizontal">
<h4>StudentModel</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
<div class="col-md-10">
@Html.HiddenFor(model => model.Roll, new { htmlAttributes = new { @class = "form-control" } })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Name, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Name, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Name, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Course, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Course, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Course, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Mobile, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Mobile, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Mobile, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.Address, htmlAttributes: new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.EditorFor(model => model.Address, new { htmlAttributes = new { @class = "form-control" } })
@Html.ValidationMessageFor(model => model.Address, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Save" class="btn btn-default" />
</div>
</div>
</div>
}
<div>
@Html.ActionLink("Back to List", "getStudentList")
</div>
@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
}
_Layout.cshtml view(Its a pre-Generated View)
Step:1 Add the highlighted code only.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
@Html.ActionLink("Application name", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("About", "About", "Home")</li>
<li>@Html.ActionLink("Contact", "Contact", "Home")</li>
<li>@Html.ActionLink("Student", "getStudentList", "Student")</li>
</ul>
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
</body>
</html>
