Final Project Github(by) Express

.gitignore

@@ -0,0 +1 @@
+node_modules/

README.md

@@ -1,49 +1,36 @@
-# Final Project
-*Due before the start of class, October 13th (final day of the term)*
+# GitHub(by) Express
 
-For your final project, you'll implement a web application that exhibits understanding of the course materials. 
-This project should provide an opportunity to both be creative and to pursue individual research and learning goals.
+https://bondah-li-luu-cs4241.herokuapp.com/
 
-## General description
-Your project should consist of a complete Web application, exhibiting facets of the three main sections of the course material:
+## The Goal
 
-- Static web page content and design. You should have a project that is accessible, easily navigable, and features significant content.
-- Dynamic behavior implemented with JavaScript (TypeScript is also allowed if your group wants to explore it).
-- Server-side programming *using Node.js*. Typically this will take the form of some sort of persistent data (database), authentication, and possibly server-side computation. 
-- A video (less than five minutes) where each group member explains some aspect of the project. An easy way to produce this video is for you all the groups members to join a Zoom call that is recorded; each member can share their screen when they discuss the project or one member can "drive" the interface while other members narrate (this second option will probably work better.) The video should be posted on YouTube or some other accessible video hosting service. Make sure your video is less than five minutes, but long enough to successfully  explain your project and show it in action. There is no minimum video length.
+Our Team created a dating/mingling app for GitHub users to meet people, socialize, find work partners and even potential life partners. When a user launches the website they will be greeted with a login page that features a GitHub Auth0 login to actually make sure only GitHub authorized users are accessing the website. After login, the User is transferred to the main page where they can create their profile. Some essential profile elements include name, profile picture, projects,age, age interest when it comes to getting matched with people. After a successful profile creation, a User can access the matching page from the menu, which displays profiles that match the age gap chosen by the User. After getting your matches you can click on their profile to learn more about them, and their projects.
 
-## Project ideation
-Excellent projects typically serve someone/some group; for this assignment you need to define your users and stakeholders. I encourage you to identify projects that will have impact, either artistically, politically, or in terms of productivity. 
+## The Instructions
 
-### Deliverables
+The login page should be fairly straight forward. There is only one single button that allows you to log in with your github account. Any person with an existing Github account would be able to enter the website. After you have successfully authorized and logged in for the first time, you would be prompted to enter your information and profile. There are some key information on the page that would determine the user experience. The first is the status of your profile. If you select “mingle”, you would only be able to match with other users that also want to mingle, and the same goes for “date”. The second being the age preferences. You will only be matched with users whose age matches your preferences AND your age matches their preference. So if your matching page shows no users to match with, try increasing the age preferences and/or changing the status. We have included 20 fake users so at least one or two should show on your page.
 
-#### Form Team (due 9/25)
-Students are will work in teams of 3-5 students for the project; teams of two can be approved with the permission of the instructor. Working in teams should help enable you to build a good project in a limited amount of time.  Use the `#project-logistics` channel in Discord to pitch ideas for final projects and/or find fellow team members as needed.
+## Technologies
 
-Teams must be in place by end of day on Sunday, September 25th. If you have not identified a team at this point, you will be assigned a team. You will be given some class time on Monday to work on your proposal, but please plan on reserving additional time outside of class as needed.
+The technologies that we used included
+- Design: HTML,CSS, JavaScript, and BootStrap
+HTML, CSS, JavaScript and Bootstrap were used to design the different screens such as the profile creation, the profile view, the matching section and the actual login using the GitHub Authentication. With these major design elements and technologies, we were able to create a fluid website where it is pretty simple and does not take too much space on the screen in terms of text.
+- Hosting Server: Heroku
+Heroku was used to host the server for external usage beyond running localhost.
+- Backend : NodeJS, MongoDB
+NodeJS and MongoDB were used to store data that we had each user input when profile creation was successful. NodeJS allowed for us to run the server locally when needing to debug certain branches, whilst keeping our server smooth and clean/
+- Authentication: GitHub
 
-#### Proposal (due 9/27) 
-Provide an outline of your project direction and the names of associated team members. 
-The outline should have enough detail so that staff can determine if it meets the minimum expectations, or if it goes too far to be reasonable by the deadline. Please include a general description of a project, and list of key technologies/libraries you plan on using (e.g. React, Three.js, Svelte, TypeScript etc.). Two to four paragraps should provide enough level of detail. Name the file proposal.md and submit a pull request by Tuesday, September 27th at 11:59 PM (end of day). Only one pull request is required per team.
+## Challenges
 
-There are no other scheduled checkpoints for your project. 
+The first challenge that we faced creating this application is determining the project idea. We ultimately decided to work on this idea after some discussion and elimination. The next challenge faced was figuring out the form of login and authentication for this project. We ended up only allowing users to log in with GitHub since this will only be for GitHub users and we will fetch some requests from their respective GitHub profiles. We also faced some challenges with styling of the pages and the aesthetics. We used Bootstrap as the framework.
 
-#### Turning in Your Project
-Submit a second PR on the final project repo to turn in your app and code. Again, only one pull request per team.
+## Group Members
 
-Deploy your app, in the form of a webpage, to Glitch/Heroku/Digital Ocean or some other service; it is critical that the application functions correctly wherever you post it.
+Othniel Bondah - Used features of BootStrap and CSS to style and create layouts.
+Nicholas Li - Designing and implementing the server, mongo database, and client side javascript.
+Ryan Luu - Designing and implementing the client, used features of BootStrap, JavaScript, HTML, CSS and some backend with MongoDB.
 
-The README for your second pull request doesn’t need to be a formal report, but it should contain:
+## Video
 
-1. A brief description of what you created, and a link to the project itself (two paragraphs of text)
-2. Any additional instructions that might be needed to fully use your project (login information etc.)
-3. An outline of the technologies you used and how you used them.
-4. What challenges you faced in completing the project.
-5. What each group member was responsible for designing / developing.
-6. A link to your project video.
-
-Think of 1,3, and 4 in particular in a similar vein to the design / tech achievements for A1—A4… make a case for why what you did was challenging and why your implementation deserves a grade of 100%.
-
-## FAQs
-
-- **Can I use XYZ framework?** You can use any web-based frameworks or tools available, but for your server programming you need to use Node.js. Your client-side scripting language should be either JavaScript or TypeScript.
+https://drive.google.com/drive/folders/135dUpbm4LM726oJdvykhER5qcCHtD4ZS?usp=sharing