D4mations.com

React Native Crash Course



In this video we will look at what React Native is, we will setup the CLI, initialize an application and look at some key aspects of the React Native framework. We’ll be using Windows / Android but you can follow on Mac and iOS as well.

Components, State & Props
View & Text
StyleSheet
Touchable Elements
ListView
Navigator
Button
Events

Android SDK Setup – https://www.youtube.com/watch?v=KRLLjlpy0r4

FULL REACT NATIVE COURSE https://www.eduonix.com/affiliates/id/16-10461

CODE
https://github.com/bradtraversy/reactnativeapp

SUPPORT THIS CHANNEL WITH A CUP OF COFFEE PER MONTH
http://www.patreon.com/traversymedia

ONE TIME DONATIONS
http://www.paypal.me/traversymedia

Original source

d4mer

, , , , , , ,

23 responses to “React Native Crash Course”

  1. 0:00 What This Guide Covers
    1:20 What is React Native
    2:30 Real Mobile Apps
    3:30 Advantages of React Native
    5:09 UI Component Examples
    7:15 APIS for Device Interaction
    7:51 Development Environment & Specs
    9:08 MyApp Component (Code Explanation)
    11:00 Let's Code… Install and Setup
    17:56 React Native Structure
    20:23 Coding from Scratch
    24:30 Component 1 – Simple TextView
    26:45 Component 1 – Properties (Props)
    31:37 How to Debug Console on Terminal
    32:41 Styling
    33:20 Component 2 – In Line Styles
    35:33 Component 2 – StyleSheet
    43:06 Touchable Highlight
    47:12 Touchable Opacity
    49:49 Component 3 – TextInput
    57:07 Component 3 – Switch
    1:00:37 Component 4 – ListView
    1:09:50 Component 5 – Get Data from Api
    1:16:37 Component 6 – Navigator

    FULL REACT NATIVE COURSE
    https://www.eduonix.com/affiliates/id/16-10461

  10. Greetings folks!
    This video is perfect to start with the basics, but at the end of the video I couldn't apply 'Navigator' because it's now deprecated, it would be a very good Idea to update the video with the new features. (Y)

  13. Some issues I had to overcome for getting android development on a Mac so that my app can get installed and I can see it reflect my code changes.
    – Make sure you have the Java SDK installed, not just the JRE
    – Make sure you have values set at "echo $JAVA_HOME" and your path is getting this value
    – Make sure that when you run "java -version" it matches what you have installed at "$JAVA_HOME/bin/java -version"
    – When setting your $JAVA_HOME path, I had to point to '"/Library/Java/JavaVirtualMachines/jdk1.8.0_151.jdk/Contents/Home" instead of "/Library/Internet Plug-Ins/JavaAppletPlugin.plugin/Contents/Home/"
    – May not be completely necessary, but the $ANDROID_HOME may be needed and added to your $PATH
    – You may need to check/use adb to see if devices are in the database, you can run this program from here: "cd ~/Library/Android/sdk/platform-tools" then "./adb devices". It should show some devices. If not, your app can't get installed in the virtual device. At a minimum, you can connect your phone with a USB cord and then the adb will show one device that available to have your app installed. Make sure you phone has Debugging turned on and that you have the Android File Transfer app installed on your Macbook.
    – For virtual Devices, I used Genymotion (Personal License) and was able to install any device I wanted and it works much faster than the Android Emulator.
    – If you installed Genymotion and created a new virtual device, you can now run the "./adb devices" command (in the proper directory, see above) and you should see that adb can now see your virtual device you created from genymotion

  22. Thanks for the video. Things went well for me till Navigation component (Component6). While testing this, I got into error – Invariant Violation: Navigator is deprecated and has been
    removed from this package. It can now be installed and imported from `react-native-deprecated-custom-components` instead of `react-native`. Screenshot here – https://snag.gy/SohORE.jpg

Leave a Reply