Workshop External Resources
- Slides: https://docs.google.com/presentation/d/1Zhy-LA6FA0xfBiDfWBL5_WdiV4IBjDHK3vfBU67cKTA/edit?usp=sharing
- Kahoot: https://create.kahoot.it/share/oasis-spring-2021-workshop-5-in-depth-frontend-development/0c7f75dc-1045-4f75-a895-6181af78a665
- Oasis Starting Guide: https://github.com/northeastern-oasis/Ultimate-Oasis-Starting-Guide/tree/master/frontend-dev
Congratulations on continuing your React journey! Becoming proficient with it will take practice and persistence, but what we will cover today are some more of the foundational concepts you will need to build powerful applications.
The interactive portion of this workshop will focus on completing a basic app that accesses various public API's and displays the values they return.
- Open the following Stackblitz link: https://stackblitz.com/edit/oasis-workshop-6-in-depth-frontend
- Click Fork at top of window
- (optional, but recommended) Sign in using Github to save your code (make an account here if you don't have one)
- Follow along with workshop
- Note: Make sure you save often!! Stackblitz has occasionally blanked out in the past. As long as you keep saving though, you'll be able to just refresh and pick up where you left off
Also feel free to clone this repository and work in your own IDE if you know what you're doing
We will be working to finish implementing a simple app to test web API's. Starting by reviewing App.js, we will finish QuoteView and AgeGuesser, then implement ActivityProvider from scratch!
- QuoteView: Shows us the quote of the day
- AgeGuesser: Guesses our age based on our name
- ActivityProvider: Suggests an activity for us to do
Well done finishing the workshop! You now have more skills to continue creating React applications and access web resources with them. Though today we accessed public web API's, you can also use the same strategies to access your own backend API! To continue learning, we'd recommend the following resources, same as the ones we recommended from Workshop 4. There are a ton of great React/frontend learning resources out there!
- Huge list of public APIs to play around with: https://mixedanalytics.com/blog/list-actually-free-open-no-auth-needed-apis/
- Read through the React docs, starting here. Now that you’ve gotten an introduction to the library learning more from it’s documentation will be much easier
- Check out the Oasis Starting Guide section on frontend development here
- Check out create-react-app for an easy way to get started with making a full-fledged React app on your machine
If you were not able to attend, don't worry! There are still many great ways to get started using React. The React official website has a good tutorial for getting started. You can also read more about frontend development in the Ultimate Oasis Starting Guide. Good luck!