Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

GitHub user search app [using jQuery]

#jquery
Jo Young 840

@Jo-cloud85

Desktop design screenshot for the GitHub user search app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Another API challenge completed! This is much tougher than the advice API generator app challenge because of the number of errors or conditions to check for, against each user's GitHub data.

Unlike the advice API, this GitHub API requires an authentication key thus for security reasons (because I have not learned enough about the backend side), I have removed my auth. key temporarily so the search will not work on your side. Technically, with .gitignore, you can hide your key but any script that is stored on the client side instead of the server side, with a link to a key, is still not very safe. Thus, if you want to test the code, you gotta get your own auth key from GitHub and add it to a config.js file.

Nevertheless, the light and dark toggle and the media queries should still work. I will come back to modify it once I learn the backend side.

Cheers!

Community feedback

Edvvard 90

@edvvarrd

Posted

Hello!

GitHub API doesn't require a key. I just did the same challenge without auth and it worked well. Key might be needed in the case when you want to do specific actions (like make some changes on your repos) or need much more responses from the API, because there are some limits without it. You can check how it works without a key on my profile.

Except of that, the app looks good. After a quick clicking in it, I would recommend to add 'cursor: pointer' on changing theme button and do some testing with media queries, because it seems to be not working perfectly.

Have a nice day!

Marked as helpful

1

Jo Young 840

@Jo-cloud85

Posted

Hi @edvvarrd! Yea...I realized the key is not required for this challenge as we are only accessing the public profile so I adjusted my code already. I also added the cursor and modified the CSS such that the responsiveness for different media sizes should be better now. Thanks for the tips!

0
P
visualdennis 8,255

@visualdenniss

Posted

Hey,

great job again!

I don't understand why it requires auth from you, this should simply work without any auth; https://api.github.com/users/visualdenniss I've also just tested it now by entering this link in URL bar in an incognito browser and it returns the data as usual without me having logged in at all.

1

Jo Young 840

@Jo-cloud85

Posted

Hi @visualdenniss, silly me. I didn't read the API docs clearly enough. The authentication key token is required if I want to retrieve private profile information which is not required for this challenge. I removed the auth. portion already. It should be working now. 😄

1

@MARVELGARR

Posted

i think you can hide the key in a env ... read up on that

1

Jo Young 840

@Jo-cloud85

Posted

Hi @MARVELGARR! Ah I tried to hide the key in an env file and use import before the submission but perhaps there was something missing from my code, the console kept throwing me a dotenv link error. Gonna take time to look it up again and hopefully figure it out. Then again, I read that the most secure way for authentication is still to run the javascript on the server side rather than the client side. But, thanks anyway!

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord