/KAIZEN

This is a website for ease of access of my branchmates having extravagant features like schedule to classes and thereby redirecting the students to ongoing classes, tasks , notice board and many more ....

Primary LanguageEJS

KAIZEN

#Technologies used

Front end - html5, css3, javascript and react js (framework)

Backend - Node js and MongoDb

Npm modules - express, body-parser, ejs, cookie-parser, fs and mongoose

Time spent: 10 days

To run type on terminal -> "node server.js"






        Features




  1. Logical and easy to use Navigation

Nav-bar - default route image

Nav-bar - Login Page image

Nav-Bar Register Page image

Nav-Bar Logout image



Nav-Bar Home Page image Edit will redirect to (self) profile-Editing page

Nav-Bar Time-Table image To-Do-List is here 😁😁😁😁😁😁😁

Nav-Bar To-Do-List image From Here You Can Edit the To-Do List (only CRs can 😁😁)

Nav-Bar Notice Board image Editing option for Notice Board is here (But only CRs can access it 😁😁)




  1. Security

2.1 If you have not logined then...every page (namely Home, Time-Table, Notice and To-Do-List) will redirect to login Page

2.2 If you have already logined then...You don't need to login untill you logout

2.3 Registration Form will accpect only Class User-ids




  1. Speacial Features

Current Class button
image
It will show the current class and will redirect to current class meet link (only if the meet link is available)







DAY - 1

Snapshots

Home page

home

The gree colour automated botton shows us the current ongoing class in real time

By clicking on it, it will divert to our google classroom meet link without any change.

The calender is properly functional.

We have added some animations .



Time Table

Time Table

It points us the live class.





DAY - 2

Snapshots

Student List

Web capture_13-9-2021_182013_localhost

We have used react ,CSS ,HTML ,JS to make the student's list .

It is not responsive yet.

In this we learnt about many properties and methods and have tried to implement it as much as possible.

Notice Board

notice board1

We have used HTML and CSS to create this page .

It is yet to be made responsive.

Have used linear gradient and webkit for some box shadow effects.





DAY - 3

Snapshots

We have made 3 forms and 2 pages (namely success and error).

Login , Registration and Updating forms links are linked in footer . #Login Page

Web capture_14-9-2021_231550_127 0 0 1

We have added some animations using CSS.

#Registration Page

Web capture_14-9-2021_231242_cranky-blackwell-89b44a netlify app

#Update Info

Web capture_14-9-2021_23132_cranky-blackwell-89b44a netlify app

#Success page

Web capture_14-9-2021_231438_127 0 0 1

#Error page

Web capture_14-9-2021_23145_127 0 0 1

Improvements in previously done pages : Used grid layout in the student list page.

Web capture_14-9-2021_232535_cranky-blackwell-89b44a netlify app





DAY - 6

Made the main page for directing to the login page .

Web capture_17-9-2021_23426_127 0 0 1

Some animations made using CSS





DAY - 10

For visitors outside our branch can visit, they can visit by using the username as "Master Key" and no password will be required in their case.

For the members inside our branch , they can have access by first registering their details and having username "b5200XX" (ie their college id) followed by setting their password respectively. The details filled can later be edited also

#Edit info Page

Web capture_21-9-2021_234124_ce-friends herokuapp com age

Their is a to do list where our class representative(+developer "b5200") only will have the permission to edit the list and update it .There daywise the time gets updated .

#To do list

Web capture_21-9-2021_234759_ce-friends herokuapp com

#Edit to do list

Web capture_21-9-2021_234920_ce-friends herokuapp com

The notice board information also can be updated by the class representative only.

Notice board edit page

Web capture_21-9-2021_235159_ce-friends herokuapp com