Website Description

G-Code-Club is intended to be a Facebook Marketplace-esqe website that connects buyers with an idea, or object they would like to 3D print with sellers with 3D printers. Most marketplace sites restrict the use of the site for services such a 3D printing and/or do not provide adequate location filtering. G-Code-Club aims to connect users precisely by distance and capability.

Backend

The backend was constructed with python in flask as well as SQL-lite database hosted by Neon.

Functionality of the site was the priority of this project with site aesthetics not being the focus of this learning exercise. Functional goals are as follows:

  • User Accounts

  • login page with captcha

  • photo uploads for sellers with description

  • users messaging

    • memory of conversation

    • text bubbles left and right

    • date and time stamping of messages

  • Seller sorting by distance

  • Bio descriptions updatable

Frontend

The frontend was originally implemented with purely HTML5 and CSS. This was chosen as it simplified the development process until a minimal viable product was reached. After this milestone was achieved the migration from HTML to JavaScript and react began. At this stage classes resumed, and the project was put on hold and remains in the porting stages.

Work In Progress…

As mentioned in the frontend section. While porting over to JavaScript many of the functionality of the website needed to be reworked. As such it is currently in a mixed state of functionality. While sign in/out and account creation remain functional most of the more complex systems such as messaging do not. you will see in screen shots below some visuals that will suggest a once working application but that was before migrating the frontend to use React.

This is the landing page that appears on start up. Users are able to select sign up or sign in.

Messaging was implemented with socket.io. This system is in the process of being integrated with React.

Sign in page prompts users for email and password. Also implements a captcha check.

With the transition to react, a modern navigation bar was implemented to improve user experience.

Users are able to see sellers by city and distance from their location.

Increasing the distance displays posts located further away.

Sign up page prompts users for email and password. Also implements a captcha check.