Skip to content

Instantly share code, notes, and snippets.

@rjkip

rjkip/README.md

Last active April 10, 2017 16:12
Show Gist options
  • Save rjkip/cfcde7bc35caacb5e2938b9c2bd4c96e to your computer and use it in GitHub Desktop.
Save rjkip/cfcde7bc35caacb5e2938b9c2bd4c96e to your computer and use it in GitHub Desktop.
Download ZIP
Workshop: “Getting to know React Native with Expo”
Raw
README.md

Workshop: “Getting to know React Native with Expo”

Prepare

Install the create-react-native-app tool:

$ npm install -g create-react-native-app

Connect to our WiFi!

Assignments

  1. Create your first app on your machine, load it on your phone. Adjust the texts, play with the stylesheets to get a feel.
$ create-react-native-app your-project
$ cd your-project
$ npm start
  1. Create a dummy UI to display this Meetup's details, like its title and the venue.

Look at the documentation of the Text component, styling basics, and laying out components using flexbox.

  1. Show a list of two dummy comments, including the author's name and the comment text. Scroll the view when the comments flow out the screen.

  2. Between the Meetup details and the list of comments, allow the user to input text and display a button. Our dummy UI is now complete.

  3. Make the app work!

Most of the Meetup API is publicly accessible, particularly when you're only reading. The Meetup API documentation can be found here. You can use their API console to see what you can request, like event details. If you need to authenticate to perform actions on your behalf, get your API key here and append the key GET parameter to your request URLs.

You can perform HTTP calls using the Fetch API!

Look at React component lifecycles to look for the right place to perform calls to the Meetup API. Load the event details, list the comments, and allow the user to place a comment.

  1. Make it pretty, allow the user to rate the event. Go wild!
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment