Culturalclubs Iiitd

Website:
CulturalClubs@IIITD


INTRODUCTION


This is a website which has information about the four MAIN Active Cultural Clubs of IIITD, everything you want to know about them.
It not tells you about each of the given four clubs but also helps you join them. All on this single platform.
The 4 clubs that are there on this website are namely:-


TEAM

Team Members Responsibilities
Raghav Jain(c) Frontend : Layout and Design (Bootstrap/HTML/CSS/Javascript), Wikipage
Sanchit Sinha Compiling/Hosting (Flask), Design (Bootstrap), Embedding Videos
Ekansh Sareen Content, Wikipage
Shubhankar Butta Form Design (SQL)

GOAL

To learn designing a website from scratch, and get acquainted to Model-view architecture for making webapps.


BRAINSTORMING

We brainstormed a lot on how our layout should be and how the UI can be made User friendly as well as attractive. As we wanted a website that not only informs people about the cultural participation of the institute through its various active clubs but also to encourage more and more students to actively paricipate in various club activities apart from the busy academic schedule of the institute. So, finally we came up with this basic layout which we planned to make attractive using Bootstrap themes for our website. It consists of inputs from all the team members

a.jpeg

TOOLS USED

1. Flask
2. CSS Design Sheets
3. Bootstrap
4. PHP Script
5. JavaScript
6. MYSQL
7. HTML


SNIPPETS AND SCREENSHOTS

We had a LOT to code. Here are some snippets….

CODE

WEBSITE

This is how all our Hardwork looks like……..


STEP BY STEP LEARNING JOURNEY

1. We started out by making a rough sketch of what all features our platform should offer. We also learnt that to make a website, one must learn the two aspects of website – Frontend and backend.
*Then began our journey of learning new languages.
*YouTube videos and w3schools were our best friends in this journey.
2. Frontend
a. We first learnt about the basics of coding by writing a small program in HTML which prints ‘Hello World’. We the moved further on by learning more advanced HTML. Major help was given by the website www.codecademy.com and www.freecodecamp.com in learning the basics of HTML.
b. We then learnt that HTML wasn’t sufficient enough to make a website appear attractive. This is when we came across CSS. CSS helped in improving the website’s appearance drastically. Major help was given by www.thenewboston.com which taught us to use CSS from the very basic.
c. We also learnt basic javascript for some basic transition and animation effects to make our website even more attractive.
3. Backend
a. We learnt that PHP was one of the language used in backend. It mostly like c++ language, so it was easier for us to write it down syntactically. It was used in all calculations of the matrix like inverse, echelon form, determinant and to compute other information. Major help was given by the website www.newboston.com which told us the syntax of PHP. Database for the same is built on MY SQL.
4. Finally we touched up everything, tested if things worked as they should and Voila ! we were good to go.


EXPERIENCE

The overall experience, completely contrary to what we thought when we were given this assignment, was really AMAZING !! We really enjoyed building each and every element of the site by ourselves and see the website taking shape as per our requirements, rather even better than what we expected. Spending days and nights writing the code for our webpages made us insomniacs, not just because we were supposed to do it, but because we really enjoyed doing it. We whole heartedly thank our instructor Ms. Jyoti Sinha for giving us the oppurtunity to work on this Project.

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License