ClassConnect

Virtual CodeDay Fall 2021 ∙ 
Permalink
Unmute
A website to help students in schools. There will be functions such as helping organize carpools, borrowing school supplies, asking and answering questions, viewing school news and schedule, and getting academic help. The main point of this site is to not only bring students together to perform better academically but also for a better overall experience for students.

This website was made specifically for our school's region but can easily be transformed for other schools.

FYI to get the full experience it may be beneficial to download our files, and run the website. Do this by running the file called "run.py", and enter the following url into your browser: "127.0.0.1:5000/home"
NOTE:
If your trying to post something, after pressing "Submit", visit 127.0.0.1:5000/save, then rerun the program and refresh to page to view the changes :)

Also our main demo video is the one with the thumbnail with "the pack" shown on it (the other video is a video we took trying to get the homscreen layout to look good).

How much experience does your group have? Does the project use anything (art, music, starter kits) you didn't create?

The three of us, Aditya Shah (9th grade), Sarthak Lodha (9th grade), and Siddhanth Lodha (6th grade), have some basic experience in coding, which basically consists of some experience in Python, but almost no experience in HTML, CSS, and JavaScript, which we used for web development, which we have never done before. Having nearly no experience in these languages and in web development, there were many challenges that we had to overcome, and there was A LOT to learn :)

Things we didn't create:
To create our project we used Flask, Bootstrap, Leaflet, and fullpage.js. We used Flask for our backend, Bootstrap to help format our frontend, Leaflet to show a map in our Carpool functions, and fullpage.js to help organize the home page of our website.

What challenges did you encounter?

The first main challenge that we encountered was figuring out how to use Flask. We didn't realize at the beginning that we would need a backend, but after further research, we realized that Flask was the best option for us. The challenges we faced with Flask included difficulties in trying to understand the weird syntaxes that Jinja2, Flask's web templating engine used. We solved this by using a new rule, "if it's working, don't bother trying to figure out why :)". The next major problem that we had was making good-looking "cards" with Bootstrap. We didn't really understand a lot of the functions so there was a lot of research on that part.

Next, we spent a lot of time trying to figure out how to include maps on our carpool page. We figured that it would be a better idea to include maps with an estimated location (we didn't want to give the exact location to protect privacy) but we found it really hard to give the estimated location and to save that point from when they input it so that we can display it once again when a user clicks to view the carpool.

Next, on Saturday night, our team decided to drop our current home screen format and we decided to use fullpage.js to redesign our home page. Though, what we didn't think through is reading the content from the previous home screen to the new one. Because we made this in a new file, we had to make many more new functions in view.py (to actually display the function on the site) which caused a lot of problems for us.

Then, we decided that we had too much blank space so our team decided to add a calendar to display important events in the school. We had HOURS worth of problems in such a simple function. Not only was the calendar not even showing, but when it did, we had many problems trying to adjust the size and the position. Though finally, after a combination of bootstrap and normal CSS, we were able to get the calendar to a position and a size that we liked.

Then, we had lots of problems making a demo video for our project as there was lots of problems trying to record the video due to the fact that we were pausing the video every time someone spoke and if someone made a mistake, we would have to restart 0the entire video. This made is so we stayed up 9 AM on Sunday to try and create a good video to present our website.

And then finally, of course, GitHub problems. Although we love Github's collaboration features, we of course encountered many problems merging files. Though, after extensive problem-solving and re-cloning we were able to get that solved!
25
25
25
25
 
Participation Certificate

Awards

Best in Show

Links

Code

Members

Aditya Shah