JSFoo 2016 React Native Workshop
Download as PPTX, PDF
0 likes133 views
This document outlines an agenda for a workshop to teach JavaScript and web developers how to build mobile apps using React Native. It introduces React Native, explains why it is useful for building cross-platform mobile apps, demonstrates a sample app, and provides challenges for attendees to build basic React Native apps with user interfaces, lists, navigation, and native platform integration. The document encourages questions and lists references and support resources for learning more about React Native.
JSFoo 2016 React Native Workshop
- 1. JS/WEB DEVELOPER TO MOBILE APP DEVELOPER IN A SINGLE WORKSHOP (USING REACT NATIVE) CHANDRA MOHAN
- 2. AGENDA WHATS REACT NATIVE? WHY REACT NATIVE? SEE SAMPLE APP START CREATING IOS AND ANDROID APPS! Q&A
- 3. WHATS REACT NATIVE? REACT NATIVE LETS YOU BUILD RICH MOBILE APPS BY WRITING DECLARATIVE COMPONENTS IN JAVASCRIPT. ITS NOT HTML5 ON WEBVIEW (A.K.A PHONEGAP) LIKE REACT, BUT USES NATIVE COMPONENTS INSTEAD OF WEB COMPONENTS AS BUILDING BLOCKS. SAME REACT CONCEPTS LIKE COMPONENTS, JSX, PROPS AND STATES
- 4. WHY REACT NATIVE? ENGINEERING PRODUCTIVITY COMMON IOS AND ANDROID CODE (DEV, UNIT & INTEGRATION TESTS) INSTANT REFRESH/INLINE DEBUGGING ON MOBILE LIKE WEB NO FEATURE GAPS/BUGS IN ONE PLATFORM OFF-CYCLE RELEASES CUSTOMERS DONT HAVE TO MANUALLY UPGRADE TO GET FEATURE UPDATES.. ENABLE FULL STACK DEVELOPERS ACROSS CROSS DEVICES
- 5. DEMO
- 7. CHALLENGE 1 HELLO JSFOO REACT-NATIVE INIT REACTNATIVEWORKSHOP LETS ADD SOME SIMPLE COMPONENTS TEXT INPUT BUTTONS ALERT / CONSOLE.LOG
- 8. CHALLENGE 2 IOS AND ANDROID DIFFERENT COMPONENTS SWITCH CHECKBOX (HINT OPENSOURCE LIBRARIES)
- 9. CHALLENGE 3 LIST VIEW WITH IMAGES SAMPLE JSON & IMAGES LINK
- 10. CHALLENGE 4 MULTIPLE SCREENS (CALLED AS SCENES IN REACT NATIVE) NAVIGATION TO DETAIL SCREEN
- 11. CHALLENGE 5 CALL TO ANDROID NATIVE AND ADB LOG
- 13. Q & A