Skip to content

ansh/react-coding-challenges

ย 
ย 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 
ย 

Repository files navigation

ย 

โญ๏ธ Looking for collaborators โญ๏ธ

We're looking for people to come and help work on the latest challenge Coinbee. If you're interested, get in touch via our slack community or via my website alexgurr.com!

ย 

A series of ReactJS coding challenges with a variety of difficulties. Deep dive into the why here.

Interested in some React fundamentals / philosophies? Check out the react-philosophies GitHub repo.

ย 

Sponsored

Time To Estimate. A fun, simple way for agile teams to remotely estimate tasks together. Free, with no sign-up required.

mixmello. Create remixed versions of your favourite Spotify playlists.

ย 

The Challenges

Easy ๐Ÿ™‚

๐Ÿš€ Rocket Ship

Unnecessary re-renders, fine grained control.

ย 

Medium ๐Ÿ˜

๐ŸŒ™ Dark Mode

State / shared state, DOM manipulation.

๐Ÿ Coinbee soon

Data visualisation and graphing. API usage.

ย 

Hard ๐Ÿ˜ฌ

๐ŸŽง Spootify

Loading state, API usage.

๐Ÿค– Chatter

Web sockets, events, callbacks & React hooks. Talks to Botty.

ย 

Future Challenges later

๐Ÿ›’ shopit

A product page with a shopping cart/checkout experience.

ย 

What are the challenges for?

They could be:

  • Short coding exercises, for use in interviews with candidates
  • Ways for you to test yourself / test your coding abilities under pressure
  • Fun exercises to help you learn React

ย 

How do they work / how do I get started?

The scaffolding of each challenges / app is done for you and each challenge has create-react-app as its foundation.

  • Clone the whole challenges repository
  • Run yarn or npm install in any of the individual challenge directories to install dependencies
  • Run yarn start or npm start to start the application on port 3000 (CRA default)
  • Each challenge has a README with requirements for you to complete

Some challenges might require usage of external APIs, but all information will be provided in the individual challenge readme.

ย 

Have you got the solutions?

All the coding challenges have been completed to a high standard. Get an automatic invite to the solutions repository at solutions.alexgurr.com.

ย 

Why are the solutions invite only?

People use these challenges for interviews. By putting the solutions behind a collaboration wall / invite-only repository we can discourage candidates from simply looking up the solutions.

ย 

Can I search for GitHub users and see if they accessed the solutions?

Yes! We track current / past collaborators, meaning if you want to check if a potential candidate had access / looked at the solutions you can simply search for them. You can do this by clicking the search icon in the top left at solutions.alexgurr.com. and searching for them.

ย 

Why does it take so long for updates / new challenges?

I work on these challenges & solutions in my spare time, on top of a full time job and everything else that comes in life. Because of this, I don't always get a lot of time to maintain and add new challenges. Interested in becoming a collaborator or submitting your own challenge? Reach out below or submit a new challenge!

ย 

Community slack-icon

We're on Slack - come and join us!

ย 

Thoughts or feedback ๐Ÿ’ฌ

Conflicting opinion about a challenge difficulty rating? Need some help or guidance? Got a challenge idea? Get in touch at alexgurr.com.

ย 

Contributing ๐Ÿ’ก

We have an issue template, pull request template and a new challenge template. We encourage you to fill out the right template and open a PR / issue!

What Makes A Good Challenge?

  • Clear requirements
  • Fun and engaging
  • Accurate difficulty level
  • Looks good (visually pleasing)
  • Realistic -- would someone ever need to build something like this in real life?
  • Easy to get started (minimal pre-requisites)

About

A series of ReactJS coding challenges with a variety of difficulties.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • SCSS 90.2%
  • JavaScript 7.5%
  • HTML 2.3%