Clubs is a form for students to fill out when they sign into a club for placement. After completion, one can monitor and manage the clubs by removing students and pulling up student information.
- Made with vanilla JavaScript
- To practice the implementation of multiple JavaScript concepts into one project. Concepts that work heavily with HTML's DOM and form data, arrays, and error handling.
- To create a user interface for students and mentors to use with ease. A interface I wish was available to me when I worked for an after school program.
The logo was made and edited using GIMP and Inkscape.
- GIMP: https://www.gimp.org/
- Inkscape: https://inkscape.org/
You are presented with a form and organization board. Filling out all required fields of the form will place you under one of the club categories on the organization board. Clicking on a name will allow you to review the student's informarion and give you the option to remove them from the club.
https://marcelino-g.github.io/Clubs/
- Desktop View
At the left side of the container, the majority of the space is taken up by the sign-up form with a "welcome message" underneath it. When the criteria is filled out, the student's name is carried over and placed in the proper "club members" section which is at the right side of the container. Before it can be placed, a review dialog pops up right next to the welcome message and if confirmed, then it is sorted. Once the student's name is placed under the correct club, you are then able to click on their name to initiate a pop up that allows you to review their information or remove them from the club. Additional students can be added until the clubs are full.
- Mobile View
All functions and features are the same except for the structure of the layout. Instead of everything being visible all at once, sections are stacked on top of one another. The sign-up form is on top of the stack with the "club members" section being underneath it. The dialog for review pops up at the top of the page and follows you until you confirm or deny the information. When a student's name is clicked on to either remove or review their information, the pop up appears in between the sign-up form and "club members" section.
- Desktop View
- Mobile View
