Server Side Rendering with Session and Cookies Handling - Lab Task 11


Modern web applications make extensive use of browser based libraries and frameworks e.g. REACT, Angular, Vue.js, etc. These apps are built on REST API i.e. final HTML code is generated at browser side, only data is sent and received from REST endpoints. Before these technologies and even today, in many web applications, complete web pages are generated at server side and sent to browsers where they are rendered and the output is displayed to user. OpenCart, Magento, Wordpress, OSCommerce, etc. which are very popular open source scripts for online stores, make use of server side rending (at least their inital versions). The objective of this task is to get hands on how server side rendered apps are built and different from REACT based apps.

Task Description

Assume the page dashboard.html lists some products that shall be displayed to authenticated users only. So create a login.html page with username and password fields and write a server side handler for it. If the user logins successfully, user shall be redirected to dashboard.html, otherwise, an error shall be displayed to user and same page shall be served back. If the user access the dashboard.html page directly (i.e. without login), an error message shall be displayed "Login is required to access dashboard.html page".

In same way, there shall be a product.html page to show details of selected product. This page shall be rendered when user click View link on dashboard.html. The application shall keep record of pages user recently visited and show those products images/links in footer of dashboard.html page, under section "Recently Visited Products". You shall use cookies or local storage to let browser remember the pages user recently visited. Sessions shall be used to manage and keep track of whether the user is authenticated or not. (I would further explain this task after this topic is covered in theory class. Here I have listed the core idea on build on).