This is a solution to the GitHub user search app challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
Users should be able to:
- View the optimal layout for the app depending on their device's screen size
- See hover states for all interactive elements on the page
- Search for GitHub users by their username
- See relevant user information based on their search
- Switch between light and dark themes
- Bonus: Have the correct color scheme chosen for them based on their computer preferences. Hint: Research
prefers-color-schemein CSS.
| Mobile (375px) | Desktop (1440px) |
|---|---|
 |
 |
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- Mobile-first workflow
- React - JS library
- React Testing Library - Testing Library for React
- Cypress - Front-end testing tool
This was my first attempt at building a modern React app, I learned how to take advantage of hooks to simplify and group functionality in one place, I also learned to stay away from state libraries at first and instead make use of the built-in useState hook and "lift the state up", which turned out to be enough for this specific app.
Another thing I struggled with a little is doing API requests, which seemed way easier at first, but I think I did a fine job at the end!
Working with React has been an interesting and fun experience, advancing my knowledge and building more complex apps is one thing I wanna focus on!
- React Testing Crash Course - This helped me immensly as an introduction to testing React apps.
- Website - Mohamed ELIDRISSI
- Frontend Mentor - @elidrissidev
- Twitter - @elidrissidev
This project is licensed under the MIT License