• Saturday , 22 September 2018

React Native Crash Course

Code Canyon



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

3d Ocean

Related Posts

23 Comments

  1. Luan Rodrigues
    January 13, 2018 at 02:09

    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

  2. Nidhanshu Sharma
    January 13, 2018 at 02:09

    You can also use https://expo.io to run your app directly on your phone if you dont want to use a SDK.

  3. Deyan Ali
    January 13, 2018 at 02:09

    have a question about reactnative. lets say an iphone app takes about 200 hours to build from scratch. so the question is how many hours needed for exact same app in reactnative?

  4. Nwaeze Jerry
    January 13, 2018 at 02:09

    Please, When and where is the complete react native android video

  5. Carlota Pamo
    January 13, 2018 at 02:09

    Video demo Projectes de Programacio I

  6. YuraGon
    January 13, 2018 at 02:09

    Thank u soo much for usefull lesson πŸ˜€

  7. TheThinkinGeek
    January 13, 2018 at 02:09

    Thank you so much for this!

  8. Ricardo
    January 13, 2018 at 02:09

    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)

  9. abhishek kumar
    January 13, 2018 at 02:09

    such a great video for beginners. Thank you so much.

  10. Liz Jeukeng
    January 13, 2018 at 02:09

    Alternatively, you could use expo. Great for making small changes.

  11. Joey Garcia
    January 13, 2018 at 02:09

    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

  12. Pristine Kallio
    January 13, 2018 at 02:09

    Can you do ReactXP crash course?

  13. TheEnderPrime
    January 13, 2018 at 02:09

    Great video but the Navigator has since been deprecated so I cannot finish the video… Also index.android and index.ios are also gone.

  14. Nurur Rahman Kiron
    January 13, 2018 at 02:09

    Hi Luan, @Traversy Media- I have a company website. Now I want to make web app(android app) for my company. Could I use react native(JS framework) for making the app ??

  15. Writangshu Mukherjee
    January 13, 2018 at 02:09

    Do i have to install android studio ide to get the set up menu that you covered in your tutorial or is there an easier way?

  16. Coding is Love
    January 13, 2018 at 02:09

    Great tutorial for getting started! I have made a video on building complex UIs from scratch using React Native. Do check it out πŸ™‚

  17. Streetwear Social
    January 13, 2018 at 02:09

    Can you do one that integrates back end too?

  18. Anna M
    January 13, 2018 at 02:09

    is it possible to write apps for watches?

  19. Omer Hussain
    January 13, 2018 at 02:09

    Nice crash course…. What database would you recommend to use in react-native app? Realm or SQLite?

  20. Chris R
    January 13, 2018 at 02:09

    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

  21. Pravesh Uniyal
    January 13, 2018 at 02:09

    Why react native not generated index.ios.js and index.android.js instead of index.js in mac?

Leave A Comment

You must be logged in to post a comment.