BookMyshowTaskList.md - brainchildservices/curriculum GitHub Wiki

Install VScode, VS COde extensions, git, .net --- Done
Create a reposityr in Git --- Done
Add a readme file
Add .gitignore -- template Visual Studio --- To do

Clone repository on to local system
Create new webapp -- Done

Git branching, stage
Stage and push to create the first PR --ToDo

Merge PR in Git --ToDo

Go back to main branch and do it pull --ToDo
git pull origin main
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

Create Layout branch from main branch -- Done
Show the csproj file to show the dotnet we would be using -- ToDo
Run/Debug the project--Add any files created now to gitignore -- Done

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Project Functional details -- ToDo
Decide what all pages your app would need: -- ToDo

Creating basic html pages and code behind pages:
Create folder for Movies under Pages for adding the pages for it
Explain code behind and html pages
Add Add.cshtml and Add.cshtml.cs -- Copy from index.cshtml and index.cshtml.cs
Copy from index.cshtml.cs to Add.cshtml.cs
Change everything from Index Model to AddModel

Copy from index.cshtml to Add.cshtml
Change everything from Index Model to AddModel ( readonly parameter, Constructor and its parameters)
Change model name to AddModel. Change body to show its Add movies page Change the Title
Create all other pages: Delete, Edit, List, Search in the same way

Home page should be set as Pages-->Index.cshtml - So add all home page content to Index.cshtml

Create _AdminLayout under Pages Shared folder:
Start the name with _: Reason
Explain Render body & Render Section
Explaing how it helps in getting navigation bar and footer
Explain asp-area, asp-page
Create _UserLayout under Pages Shared folder:

Add Layout option to all the cshtml pages:
Adding static contents to root folder: Explain
Explain about explicitly adding Layout and automatic Layout selection
@{
Layout = "_AdminLayout";
}

Build --> Run the project and show how links to different pages work

Merge and push changes

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

SQL Theory session How to create a database How to create a table How to use SQL Commands -INSERT,SELECT,UPDATE, DELETE

Pull main branch and create new branch Database from main branch

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

Create a folder DataBase- Inside it create folder for Tables and SqlCommands
Inside the Tables folder add the sql commnd used to create a new table

Test run various INSERT,SELECT,UPDATE, DELETE on the created table
Copy those SQL commands to a file in SqlCommands

The file names to be started as dbo.Name.sql
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

Teach about properties and constructors
Use of this keyword

  • Explain OnGet and OnPost
  • Explain connection string, SQL connection, SqlCommand, SqlDataReader
  • Explain about need for using System.Data.SqlClient;
  • Explain how SqlDataReader variable can be used to access the table columns
  • Explaing about adding package references
  • How to create connection string
  • Explain connection open and connection close
  • Explaing using namespace
  • Explain C# List, C# list of objects
  • Explaing about html tables and how to create them
  • Explain the ways to access code behind value in cshtml: @Model., ViewBag, ViewData

  1. Create model of table columns.
    Create constructor inside the model class to assign values to the properties

  2. In List.cshtml.cs
    2.1 Create a List for Movies object, for using Movies object the namespace for Movie class Model needed to be added
    2.2 Add System.Data.SqlClient nuget package
    2.3 Add using System.Data.SqlClient; namespace
    2.4 Inside Onget
    > > > 2.4.1 Create an SQL Connection string
    > > > 2.4.2 Create SqlConnection object that passes connection string as constructor parameter
    > > > 2.4.3 Create SQL SELECT command as a string
    > > > 2.4.4 Create SqlCommand object that passes SQL select command string and SQL connection object as constructor parameter
    > > > 2.4.5 Create an SqlDataReader type and assign command.ExecuteReader(); to it
    > > > 2.4.6 Use SqlDataReader type to read through the table columns and add them to the MovieList

  3. List.cshtml
    3.1 Create a table to display the list of Movie objects
    3.2 Use Model. property to access the code behind values in cshtml

Push changes
And Merge once changes are approved

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

Change to main branch, pull changes and create new branch AddNewMovie from main branch

Explain about creating form with method POST
Explaing about required parameter and html validators, required etc
Explain about passing objects as parameter to methods
Expalin the reason for putting @before parameter values of SQL commands
Explain use of Name attribute to get values to the code page
Explaing about SQL command parameter/parameter.Add and use of it
Explaing about SQL command parameter/parameter.Value and use of it
Explain about C# Exceptions
Explaing about command.ExecuteNonQuery();

  1. Add.cshtml
    1.1 Create form with method POST
    1.2 Add label and input for all fields that we need to take from the user. Give name for each input, since we will be accessing the value in code using the name attribute

  2. Add.cshtml.cs

    1.1 Add using System.Data.SqlClient; namespace
    1.2 Create an SQL Connection string
    1.3 Create OnPost method: The OnPost method receives parameters that are name attributes of inputs from the cshtml page
    > > > 1.3.1 Create an SQL Connection string
    > > > 1.3.2 Create SqlConnection object that passes connection string as constructor parameter
    > > > 1.3.3 Create SQL INSERT command as a string
    > > > 1.3.4 Create SqlCommand object that passes SQL Insert command string and SQL connection object as constructor parameter
    > > > 1.3.5 Use SqlCommand object Parameters and Add method to set the datatype of the parameters with regards to the column datatype
    > > > 1.3.6 Create SQL INSERT command as a string
    > > > 1.3.7 Check connection status and close if its open
    > > > 1.3.8 Create try catch finally blocks
    > > > > > > > > > 1.3.8.1 Inside the try block open the connection
    > > > > > > > > > 1.3.8.2 Use SqlCommand object Parameters and Value method to save the value of the field
    > > > > > > > > > 1.3.8.3 Run command.ExecuteNonQuery(); to finsih the process
    > > > 1.3.9 Leave catch block empty
    > > > 1.3.10 Close the connection in finally block

Push changes
And Merge once changes are approved
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

Change to main branch, pull changes and create new branch EditMovie from main branch
Explain about IActionResult and about return redirect(webpage)

In Edit page: we will again list all the movies with an additional edit and delete button next to it

  1. Edit.cshtml.cs- Similar to List.cshtml.cs
    1.1 Create a List for Movies object, for using Movies object the namespace for Movie class Model needed to be added
    1.2 Add System.Data.SqlClient nuget package
    1.3 Add using System.Data.SqlClient; namespace
    1.4 Inside OnGet
    1.4.1 Create an SQL Connection string
    1.4.2 Create SqlConnection object that passes connection string as constructor parameter
    1.4.3 Create SQL SELECT command as a string
    1.4.4 Create SqlCommand object that passes SQL select command string and SQL connection object as constructor parameter
    1.4.5 Create an SqlDataReader type and assign command.ExecuteReader(); to it
    1.4.6 Use SqlDataReader type to read through the table columns and add them to the MovieList

2.Edit.cshtml - Similar to List Movies with an additional Edit and Delete button on the List page. The Edit button is able to capture the ID of the List item and pass it to the EditConfirm page
2.1 Use List.cshtml. Add two additional columns for edit and Delete
2.2 Use Model. property to access the code behind values in cshtml
2.3 href for edit button for each should point to href link with the ID of the object: href link should be to another page where details of the objects are shown

Create EditConfirm page where the details of the specific Movie with ID will be listed with its details populated
3. Create EditConfirm.cshtml and EditConfirm.cshtml.cs files

  1. EditConfirm.cshtml has a special routing where at the end of routing, it receives a MovieID that is used to look up at a specific movie
    EditConfirm.cshtml is similar to Add.cshtml with an additional value field to autopopulate the details based on the MovieID
    4.1 Add {MovieID} to end of the routing. - Means MovieID would be part of the url when this page is called

  2. EditConfirm.cshtml.cs:
    Since we need to autopopulate the movie details based on the MovieID from the url, we need a Get Method
    5.1 Copy index.cshtml.cs to EditConfirm.cshtml.cs
    5.2 Change everything from IndexModel to EditConfirmModel
    > > > 5.2.1 Create a List for Movies object, for using Movies object the namespace for Movie class Model needed to be added
    5.2 Need to create the GetMethod similar to Get Method in List.cs with few additions
    > > > 5.2.1 Create Get Method with one parameter which is the MovieID that we get from the URL
    > > > > > > > > > 5.2.1.1 Add using System.Data.SqlClient; namespace > > > 5.2.2 Create an SQL Connection string
    > > > 5.2.3 Create SqlConnection object that passes connection string as constructor parameter
    > > > 5.2.4 Open Connnection
    > > > 5.2.5 Create SQL SELECT command as a string using the MovieID
    > > > 5.2.6 Create SqlCommand object that passes SQL select command string and SQL connection object as constructor parameter
    > > > 5.2.7 Use SqlCommand object Parameters and Add method to set the datatype of the parameter with regards to the column datatype and add namespace System.Data;
    > > > 5.2.8 Use SqlCommand object Parameters and Value method to save the value of the field
    > > > 5.2.9 Create an SqlDataReader type and assign command.ExecuteReader(); to it
    > > > 5.2.10 Use SqlDataReader type to read through the table column and add them to the MovieList
    > > > 5.2.11 Close the connection

  3. EditConfirm.cshtml would get the MovieDetails from the Get method which will be populated in a editable form field.
    6.1 Create form with method POST
    6.2 Add label and input for all fields that we need to edit. Give name for each input, since we will be accessing the value in code using the name attribute. Give value attribute so that Get Method can auto populate the data on the input field with the data on the table for that particular entry
    6.3 Since only one object is received from Get method it can accessed using the index 0 of the List

  4. EditConfirm.cshtml.cs: Once the updated field entrie are entered by the user, it needs to be updated to the database
    7.1 Create OnPost method which has a return type of IActionResult. The parameters for the OnPost method are the name fields
    7.2 Create an SQL Connection string
    7.3 Create SqlConnection object that passes connection string as constructor parameter
    7.4 Create SQL UPDATE command
    7.5 Create SqlCommand object that passes SQL UPDATE command string and SQL connection object as constructor parameters
    7.6 Use SqlCommand object Parameters and Add method to set the datatype of the parameters with regards to the column datatypes
    7.7 Creation try and finally exception handling
    > > > 7.7.1 In try block we will push the updated field values to the database
    > > > > > > > > > 7.7.1.1Open the connection
    > > > > > > > > > 7.7.1.2 Use SqlCommand object Parameters and Value method to save the value of the field > > > > > > > > > 7.7.1.3 Run command.ExecuteNonQuery(); to finsih the process
    > > > 7.7.2 In finally block we will close the connection
    7.8 Once the new filed values are updated to the database our webpage should be redirected and we use the Redirect for that
    > > > 7.8.1 return Redirect("~/movies/edit");

Push changes
And Merge once changes are approved
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

Change to main branch, pull changes and create new branch EditMovie from main branch

  1. In Edit.cshtml page: We have the list of all the movies with the Edit button enabled to redirect to Edit confirm page. We need add make the delete button take us to the DeleteConfirm page with the ID of the movie to the edited
    1.1 Add href to the Delete button with href to the DeleteConfirm page. Include the movieID of the Movie to the Deleted in href link

  2. Delete.cshtml: Has special routing with the movie id in its url that we get from the Edit page click on Delete button
    @page "/Movies/DeleteConfirm/{MovieID}"

  3. Delete.cshtml.cs:
    Since we need to autopopulate the movie details based on the MovieID from the url, we need a Get Method in Delete.cshtml.cs on page load
    3.1. Create a List for Movies object, for using Movies object the namespace for Movie class Model needed to be added
    3.2. Need to create the GetMethod similar to Get Method in EditConfirm
    > > > 3.2.1 Create Get Method with one parameter which is the MovieID that we get from the URL
    > > > > > > > > 3.2.1.1 Add using System.Data.SqlClient; namespace
    > > > 3.2.2 Create an SQL Connection string
    > > > 3.2.3 Create SqlConnection object that passes connection string as constructor parameter
    > > > 3.2.4 Open Connnection
    > > > 3.2.5 Create SQL SELECT command as a string using the MovieID
    > > > 3.2.6 Create SqlCommand object that passes SQL select command string and SQL connection object as constructor parameter
    > > > 3.2.7 Use SqlCommand object Parameters and Add method to set the datatype of the parameter with regards to the column datatype and add namespace System.Data;
    > > > 3.2.8 Use SqlCommand object Parameters and Value method to save the value of the field
    > > > 3.2.9 Create an SqlDataReader type and assign command.ExecuteReader(); to it
    > > > 3.2.10 Use SqlDataReader type to read through the table column and add them to the MovieList
    > > > 3.2.11 Close the connection

  4. Delete.cshtml would get the MovieDetails from the Get method which will be populated in a non editable form fields.
    4.1 Create form with method POST
    4.2 Add label for all fields to show the Movie field values. Give value attribute so that Get Method can auto populate the data on the label fields with the data on the table for that particular entry
    4.3 Since only one object is received from Get method it can accessed using the index 0 of the List
    4.4 The Yes button will execute the Post method.
    4.5 The NO button will redirect pack to Edit page

  5. Delete.cshtml.cs:
    Once the user presses the YES button on the Delete.cshtml page, the correspondig colum on the table should be deleted
    5.1 Create OnPost method which has a return type of IActionResult. The parameter for the OnPost method is only the MovieID field
    5.2 Create an SQL Connection string
    5.3 Create SqlConnection object that passes connection string as constructor parameter
    5.4 Create SQL DELETE command
    5.5 Create SqlCommand object that passes SQL DELETE command string and SQL connection object as constructor parameters
    5.6 Use SqlCommand object Parameters and Add method to set the datatype of the parameters with regards to the column datatypes
    5.7 Creation try and finally exception handling
    > > > 5.7.1 In try block we will delete the particualar column from the database
    > > > > > > > > > 5.7.1.1 Open the connection
    > > > > > > > > > 5.7.1.2 Use SqlCommand object Parameters and Value method to save the value of the field > > > > > > > > > 5.7.1.3 Run command.ExecuteNonQuery(); to finsih the process
    > > > 5.7.2 In finally block we will close the connection
    5.8 Once the new filed values are updated to the database our webpage should be redirected and we use the Redirect for that
    > > > 5.8.1 return Redirect("~/movies/edit");
    Push changes And Merge once changes are approved
    ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++