Ten apps you can build to learn React other than a to-do list.
So you?ve decided to learn React. At this point, you want to build a project to really solidify your skills.
Except this time, you don?t want to just code that same old to-do list. You want something more creative.
Now it can be tough coming up with an idea. Especially when you?re still learning. So for inspiration, here?s a list of ten starter project ideas for React.
1. QuizBuilder
Build a quiz-crafting tool. It?ll be the go to place to make viral quizzes like those from Buzzfeed or the infamous ?Harry Potter House Sorting Quiz.?
2. MusicPlayer
Use the Spotify api to create an application that lets you discover music. It will help you find top songs, trending artists, and explore new genres. If you want to get really advanced, how about a music suggestion feature?
Spotify Web API – Spotify Developer
Our Web API lets your applications fetch data from the Spotify music catalog and manage user’s playlists and saved?
developer.spotify.com
3. MemeGenerator
Make an advanced interface for creating memes! Allow the user to upload an image, write a caption, and build a meme with the Imgflip api. To take it to the next level, allow the user to share their meme on Twitter, Facebook, and other social platforms.
Meme Generator API – Imgflip
RESTful JSON API for making memes with Imgflip’s meme generator
api.imgflip.com
4. InstagramRatio
A lot of people keep track of their Instagram ratio: the difference between the number of people they follow, versus the number of people they?re following. So, use the Instagram api to compare a user?s followers, and the people they?re following. Then, reveal who?s not following them back!
Instagram Developer Documentation
www.instagram.com
5. Tweetdeck
Plenty of us have multiple twitter accounts. There?s one for your personal life, work, side startup, and more. Managing them all can be tricky. So build an interface that allows you to see the feeds from them all on one page. Better yet, add liking, tweeting, and retweeting capabilities.
REST APIs – Twitter Developers
All applications replicating the core Twitter experience, usually called “clients”, must adhere to certain restrictions?
dev.twitter.com
6. GoofyYelp
Yelp already does a great job of recommending great restaurants. How about an app that does the opposite: horrible restaurants recommendations. It may be goofy, but at least you?ll know where not to eat!
API 2.0: Overview | Yelp For Developers | Yelp
Yelp’s API exposes search to 3rd party developers.
www.yelp.com
7. EventFinder
Create a dashboard where users can publish upcoming events. Also, enable an invitation feature through emails. To get a good list of upcoming events, use the Eventbrite api.
Eventbrite APIv3 Developer Documentation – Eventbrite Developer Center
Eventbrite brings people together through live experiences. Discover events that match your passions, or create your?
www.eventbrite.com
8. CustomForum
Build a forum application where users can submit topics and comment on them. To step it up a notch, add a liking feature. Mix in direct messaging if you?re extra ambitious.
9. MyMedium
Build your own version of medium from scratch. Users can create stories, ?heart? them, and follow other users.
10. YouTubeDirect
Build your own version of YouTube using their api. Use it to only show videos from channels you specify. For extra utility, make a parental feature that allows you to block certain channels.
YouTube | Google Developers
Integrate YouTube videos and functionality into your website or application.
developers.google.com
11. Bonus! RapidApi
Use any combination of apis from the awesome RapidApi marketplace. There are tons of options to choose from for building creative apps. There?s text-to-yoda-speak, computer vision, text sentiment analysis, and much more. There?s no limit to the apps you can build with stuff from this awesome site!
RapidAPI
The largest api marketplace in the world.
rapidapi.com
There you have it! Ten (plus one) project ideas to get you coding in React. Hopefully, you won?t have to fall back on the tried and true to-do list app.
If you want a coding tutorial of a couple of the apps from this list and more, consider this course on ReactJS and Redux. It features a holiday-countdown utility, a reminder tool with local storage, a music-player with the Spotify api, and an app with full authentication. Check it out, and get coding!
David Katz is an active online coding instructor with 6 courses on Udemy. He has over 47,000 students from 169 countries. He teaches JavaScript ES6, ReactJS, Redux, ReactVR, VueJS, and more. Check out his courses.
And please feel free to connect with him by visiting his website: davidtkatz.com
