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 Jobs - NextJS

@greg-solomon

Desktop design screenshot for the Devjobs web app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
4advanced
View challenge

Design comparison


SolutionDesign

Community feedback

P

@jakwakwa

Posted

Hi Greg,

I like how you're only displaying 4 rows of jobs. Any tips on the best ways to do this? I used React. My solution has all 50 jobs per page.

I really like your solution overall as well. 👍

0

@greg-solomon

Posted

@jakwakwa

Hey! Thanks for checking it out.

I just used a state variable for page and page size. Then clicking on the load more button increments the page variable and renders more items from the array.

0
P

@jakwakwa

Posted

@greg-solomon thank you @greg-solomon

0
P

@jakwakwa

Posted

@greg-solomon I see now that you used Redux. That is probably how you limit the number of jobs loaded at first, correct?

0

@greg-solomon

Posted

@jakwakwa

No, if you look at pages/index.tsx and components/home/Grid.tsx you should be able to see how it works.

There's a showCount variable in my page that gets passed to my grid component and then use it in a .slice() before the .map()

1

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