Documentation for Project# 3 Assignment by General Assembly
is a responsive app for lonely software developers looking to connect with each other IRL. Users can create a profile for themselves and have it displayed on the home page for other users to see and match with. Users can also edit their own profiles to update their status.
is for anyone who wants to connect with software engineers!
On the home page, the user may either create a profile or continue as a guest. They will then be taken to the profiles page, where they can view individual profiles! Once a profile is selected, the user can decide whether or not they want to match. Once they click the match button, they'll find out if they were a .match(), and their match's Github link will be revealed!
For our wireframes and other planning info, see our planning repo
The console.love team used a combination of Centralized and Feature Branch Git Workflows, with an emphasis on pair programming. Responsibilities were distributed roughly as follows:
Jaimie - Project Manager/Scrum Master - Back-end + Testing - Deployment - React Router
Muezzin - Git Manager - Javascript Guru - Algorithm Wizard
Rixio - Ideas Guy - CSS Master - Comfortable in React
These responsibilities were chosen based on team members' natural strengths. Each member worked on all aspects of the project, making sure to learn something new. All planning and task tracking was handled through our Trello Team Board.
We achieved roughly our silver level of functionality and design, with features including:
- App optimized for mobile
- Profile pictures randomize on page load
- Limit profiles to 10 on load, with button to show 10 more
- All API calls switched to fetch method
- Colorful CSS, plus a matching logo and favicon
- Matching with someone reveals a link to their Github
In the future, we aspire to add the following functionality to reach our gold level:
- When a new profile is created, the user is redirected to their newly created profile page
- User authentication
- Footer or header link to My Profile - if no account, will show a sign up button
- Match algorithm based on programming languages in common
- Matches are saved in memory
- Incorporate GoogleMaps location for profiles/user
- Messaging by ID
- Refactor with React Hooks
Functionality:
- React with React Router for navigation
- Fetch for API calls (was Axios, but we were unable to achieve full CRUD, so switched to fetch)
- Lodash for randomization
Testing:
- Enzyme
- Jest
- React Testing Library
Design:
- CSS Grid
- Fork and clone this repo
- Open your terminal and go to the directory you want to store this application and ‘git clone’ it
- Run npm i to install all dependencies
- Run ‘npm run start’ to open the app in browser
- To see data you have to run the back-end for this application as well
- Create changes to the code and if you wish to add a new feature to the currently existing application submit an issue detailing your changes
- Front-end testing with Jest and Enzyme was particularly challenging
- Couldn't get redirect to newly created profile page to work
- Match algorithm proved difficult
- Setting state guest v user
Front-end Media:
- hnet for app preview gif
Front-end testing:
- Testing API Calls in React enabled us to build successful tests for our more complex components
- React Testing Library Common Scenarios
- React Testing with Jest and React-testing-library
- Testing React Components with Jest and Enzyme
Front-end Framework:
- Jennifer Meade's CRUD App example helped us construct our front end
Special thanks to:
- Hou Chia for his help with Jest/Enzyme testing
- Jennifer Meade for her invaluable React Crud Classes app