Designed to showcase the difference between class inheritance & concatenative inheritance in JavaScript
I purposely used class-based React components in this project to demonstrate some of the known problems with class inheritance in JavaScript. While quick to load and (to my knowledge) bug-free, this code is unnecessarily bloated due to the limitations of class inheritance.
In this repository https://github.com/JordanWinslow/functional-react-github-user-finder I leverage the full power of JavaScript's multi-paradigm capabilities along with modern react hooks and context management to demonstrate how much cleaner, more readable and maintainable the code can get by adopting a modern approach to inheritance and combining the good features of classical OOP with FP!
- No Bootstrap, No Premade CSS. 100% From-Scratch CSS Leveraging the Power of the Styled-Components Library for Future-Proof, Maintainable Code
- Fully Responsive Website Utilizing vw, vh @media Queries & CSS Grid System to Adapt to any Size of User Device or During Window Resize
- React Router: (Retains State During Page Change, and Does not Require Screen Refresh)
- Conditional Page Rendering: Descriptive Headers Such as "Bio," "Website," Icons, etc. Only Display if User Actually Has a Bio or Website.
- Fully Interactive: Virtually Every Element is Animated on User Interaction (In Tasteful Ways to Enhance User Experience Without Overwhelming Them)
- Cutting Edge CSS: Showcasing the Latest Technologies Offered by CSS Such as Gaussian Blur on Backgrounds Behind Elements
- Blazing Fast
This project utilizes class-based React.js components with lifestyle methods, state management & higher order functions to dynamically render user profile information from the GitHub API onto a fully responsive CSS grid that is styled with styled-components and animated with CSS keyframes and modern transitional hover parameters.
- https://i.postimg.cc/YSjqdczd/Zach-Phone-View.png
- https://i.postimg.cc/Z5bqyvBt/Jordan-Phone-View.png
- https://i.postimg.cc/Fzb9YhhH/About-Phone-View.png
- https://i.postimg.cc/7hSLSgnD/About-Tablet-View.png
- https://i.postimg.cc/6pMpV6n7/Jordan-Tablet-View.png
- https://i.postimg.cc/GpN3NMMd/Zach-Tablet-View.png
