full-stack-playlist

:star2: Task 7: Javascript Project

When someone asks me what programming language they should learn, I don't simply pick my favorite. I play matchmaker! Web frontend? JavaScript is the heartthrob. Backend? Still JavaScript steals the show. Mobile apps? JavaScript saves the day. Games? Yup, JavaScript's got game. AI? Guess what? JavaScript to the rescue again! So, no matter the path, JavaScript's the hot pick for a programmer's heart.

:pushpin: Challenges

1. JavaScript BookList App

Follow the linked tutorial to code along and create a booklist app using HTML, CSS and Js. No need to submit the output, this is just for you to understand.
https://youtu.be/JaMCxVWtW58

2. Building A Bookmarker Application

Extend your knowledge of Js by building a bookmarker application.
https://youtu.be/DIVfDZZeGxM

3. JavaScript Issue Tracker

Follow the linked tutorial to code along and create a booklist app using HTML, CSS and Js. No need to submit the output, this is just for you to understand.
https://youtu.be/NYq9J-Eur9U

4. Project

Finally, create a webpage as the following (Fig 1) containing the student's name in tabular form with the provision to view marks. The user must be able to enter the student's name and add in to the table.

Fig: 1

Then, one must be able to view marks of individual students in the form of pop-up modal. Initially, there will be no marks shown. Then the user must be able to enter as much as any subjects along with thier 3 internal term examination marks with thier total as shown below. display the CGPA score in form percentage or out of 10.

Fig: 2

The file structure should look like the following or you can have your own. 

📂 Task7
├── index.html  #It contains students list
└── studentsmarks.html #It contains students marks displayed

In `index.html` there contains an input field, value in the input field should be able to fetched and play with it inside the array, refer the resources below. The input field must be validated for any empty strings and an error message must be displayed ragarding it. On clicking View marks button one should navigate to the new page using the Window/Document object containing the student id. The student id should be read from the URL and display yhe respective students marks in the `studentsmarks.html`. For persistant storage use `localStorage` to never lose the data on refreshing the web page. To Know more about the Web Storage API, visit https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API.

📂 Submission

Submit the link to your hosted static website Here.</br> https://forms.gle/DdKFebZgZK5sgREFA

🌐 Resources