Submitted about 1 year ago

GitHub user search app [using jQuery]

#jquery

Jo Young• 840

@Jo-cloud85

Preview site View code

This is a solution for...

GitHub user search app

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 about 1 year ago

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

Jo Young• 840

@Jo-cloud85

Posted about 1 year ago

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!

visualdennis• 8,295

@visualdenniss

Posted about 1 year ago

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.

Jo Young• 840

@Jo-cloud85

Posted about 1 year ago

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. 😄

Marvellous Obatale• 520

@MARVELGARR

Posted about 1 year ago

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

Jo Young• 840

@Jo-cloud85

Posted about 1 year ago

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!

Marvellous Obatale• 520

@MARVELGARR

Posted about 1 year ago

@Jo-cloud85 hmmmm okay

Please log in to post a comment

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