Unmatched is a website dedicated to fostering confidence, motivation, and success in the next generation of STEM leaders. Created for underrepresented STEM students, Unmatched helps them see themselves in the success stories of STEM professionals across diverse genders, races, and abilities.
- Clone the repository:
git clone https://github.com/cherryontech/unmatched.git
- Navigate to the project directory:
cd unmatched - Install the dependencies:
npm install
- Start the Tailwind build:
npm run tailwind
- Start the development server:
npm run dev
-
Dynamic Data Rendering: Utilizes React's state management and the
useStatehook to dynamically render the bios of STEM professionals, allowing for interactive and responsive user experiences. -
Search Functionality: A custom search feature is implemented in the
ProfessionalsPagewhich filters the displayed professional cards in real time, enhancing the usability and accessibility of the application. -
Routing System: Leverages
React Routerfor navigation between different views of the app, such as the home page, professionals list, and individual bio pages, creating a seamless and intuitive user flow. -
Responsive Design: Styled with TailwindCSS for a responsive layout, ensuring a consistent and accessible user experience across various device sizes.
-
Optimized Performance: The application is structured with a focus on performance, including efficient state management and the use of React's
useRefhook to avoid unnecessary re-renders. -
Accessibility Focus: Implements best practices for web accessibility to ensure that the application is usable by as wide an audience as possible, including those with disabilities.
-
Interactive UI Components: Features interactive components such as cards and modals, which are implemented with reusable React components, allowing for a maintainable and scalable codebase.
To contribute to this project, please follow these steps
This project is licensed under the Hippocratic License.