Need help with Web Development or Project Help? At Codersarts we offer 1:1 session with expert, Code mentorship, Course Training, and on-going development projects. Get help from vetted Machine Learning engineers, mentors, experts and tutors.
Overview:
Using the Portfolio Web Site you developed in Assignment 1, restructure the web site to include a secure section of you site that displays a list of contacts.
Instructions :
This Secure Area must include the following components – a user Login View, a Business Contacts List View and an Update View.
In addition to your site’s main Nav Bar and page template components, your Login View should include the following components
A Form that includes a username field, a password field and a Login Button.
The application database will contain a user collection. The single document in the collection will include your username, password, email address and other relevant information. The username and password credentials will be used for authentication. No Registration form is required
If the user is authenticated, he will be taken to the Business Contacts List View, otherwise he will be redirected back to the Login View if his username and/or password is incorrect
If a user attempts to access the secure area of your site, they should be redirected back to the Login View
Your Business Contacts List View should include the following components
An alphabetically sorted list of contacts should appear on this page. The connection to the database you created will display all the contact data in a table. The table will only include The Contact Name, Contact Number and Email Address
Include an Update Button and a Delete Button at the end of each Row of the Table. The Update button links to the Update View. The Delete Button removes the contact from the database
The Update View will include the following components
A Form will allow the user to update any contact details (Name, Contact Number, Email Address, etc.)
The Form will include a Delete Button that will remove the user from the database and return the user to the Contact List View
The Form will include a Cancel Button that will return the user to the Contact List View
Include Internal Documentation for your site
Ensure you include a comment header for your CSS and JavaScript files that indicate: the File name, Student’s Name, StudentID, and Date
Ensure you include a section header for all of your HTML structure, CSS style sections, and any JavaScript functions
Ensure all your code uses contextual variable names that help make the files human-readable
Ensure you include inline comments that describe your GUI Design and Functionality. Note: Please avoid “over-commenting”
Share your files on GitHub to demonstrate Version Control Best Practices and push your site to a cloud host
Your repository must include your code and be well structured
Your repository must include commits that demonstrate the project being updated at different stages of development – each time a major change is implemented
You must deploy your site to your Cloud Server using git
Create a Short Video presentation on YouTube or another streaming provider. You must include a short PowerPoint (or Google Slides) Slide Deck that includes a single slide to start your video
The first (and only) Slide of your Slide Deck must include a current image of you (no avatars allowed) that is displayed appropriately on the page. You must also include your Full Name, Student ID, the Course Code, Course Name, and your Assignment information
You will demonstrate your site’s functionality. You must show each page working properly
You will describe the code in your app.js file that drives the functionality of your site
Sound for your Video must at an appropriate level so that your voice may be clearly heard, and your screen resolution should be set so that your code and site details are clearly visible
Your Short Video should run no more than 5 minutes