My experience for 3 years with React Native

Transcript

1. .ZFYQFSJFODFGPSZFBSTXJUI3FBDU/BUJWF
   ϢλϚͨ͜Ζ͏ɿ!:VUBNB,PUBSP
   

   View Slide

2. ʠ5PQVUJUCMVOUMZ
   

   )PXBCPVU'MVUUFS ʡ
   

   View Slide

3. ʠ5IFSFBSFNBOZQFPQMFUIBU
   UIJOLTP *XPOEFSʡ
   

   View Slide

4. ʠ*XJMMUBMLBCPVU
   

   $IPPTJOH3FBDU/BUJWFXBT
   HPPEʡ
   

   View Slide

5. ʠ'SPN.ZPQFSBUJPOBM
   FYQFSJFODFʡ
   

   View Slide

6. ʠ4IPVME*DIPPTF'MVUUFSʜʁ
   

   4IPVME*DIPPTF3FBDU/BUJWFʜʁʡ
   

   View Slide

7. ʠ)PQFNZUBMLIFMQQFPQMFXIP
   JTXPSSJFEBCPVUUIBUʡ
   

   View Slide

8. ࣗݾ঺հ
   ϢλϚͨ͜Ζ͏
   BJS$MPTFUɹ
   5FDIOJDBMFOHJOFFSJOHUFBNMFBEFS
   

   %BUB4DJFODFUFBNMFBEFS
   *BNXIBUJTDBMMFE3FBDU/BUJWFMPWFS
   

   .ZUFBNNFNCFSBMXBZTNBLFGVOPGNF
   ʰ:PVBSFFYFOHJOFFS3JHIU ʱMPM
   

   *UIJOL*NVTUCFFOHJOFFS-PM
   "DPNQBOZNBLJOH1FSTPOBM4UZMJOH
   1MBUGPSN JODMVEJOHBJS$MPTFU
   

   0VSTUSFOHUITBSFNBLJOHBMMTZTUFNGPS
   GBTIJPOSFOUBMTFSWJDFT
   BJS$MPTFU
   

   View Slide

9. ʡ*OUIFZFBSʡ
   

   View Slide

10. ʠ5XPNPOUIMBUFSBGUFSNZKPJO
    BJS$MPTFUʜʡ
    

    View Slide

11. $503ZBO
    ʰ*XJMMMFBWFBOFX#VTJOFTTUP
    ZPV$BOZPVHPUPNFFUJOH ʱ
    :VUBNB,PUBSP
    ʰʢ*UJTUPPGBTUɾɾʁʣɻ
    

    3FBMMZʂʁ:FT TJSʂʂʱ
    

    View Slide

12. ʠ-BVODINPOUITMBUFSʡ
    ʠ.BLJOHBMMTZTUFNTʡ
    ʠ/PEFTJHOBOESFRVJSFNFOUTZFUʡ
    

    View Slide

13. $503ZBO
    ʰ%POUXPSSZʂʂʱ
    :VUBNB,PUBSP
    ʰ1PTTJCMFJOUJNFʜ ʱ
    :VUBNB,PUBSP
    ʰ:FT TJSʂʢ7FOUVSF
    

    DPNQBOZJTBXFTPNFɾɾʣʱ
    

    View Slide

14. *OUIBUUJNFʜ
    

    View Slide

15. ʠ$PVMEZPVEPUIJTXPSLCFGPSF
    TUBSUJOHNBLJOHOFXQSPEVDUT ʡ
    *OUIBUUJNFʜ
    

    View Slide

16. ʠ$PVMEZPVEPUIJTXPSLCFGPSF
    TUBSUJOHNBLJOHOFXQSPEVDUT ʡ
    *OUIBUUJNFʜ
    *TBJEʜ
    

    View Slide

17. ʠ$PVMEZPVEPUIJTXPSLCFGPSF
    TUBSUJOHNBLJOHOFXQSPEVDUT ʡ
    *OUIBUUJNFʜ
    *TBJEʜ:FT TJS
    

    View Slide

18. ʠ'JOJTIʂʂʡ
    

    View Slide

19. ʠ8IFOJOPUJDFEʜ
    

    *UXBT+VMZʢPOMZNPOUIMFGUʣʡ
    

    View Slide

20. 3FRVJSFNFOUT
    8FC
    J04
    "OESPJE
    "QJ
    #BUDI
    5FSN
    NPOUI
    .FNCFS
    ̎QFPQMF
    $PODFSO
    "OPUIFSFOHJOFFSJT
    CFHJOOFSXIPKVTUHSBEVBUFE
    GSPNQSPHSBNJOHTDIPPM
    4QFDJ
    f
    i
    DBUJPOJTVOEF
    f
    i
    OFE
    

    View Slide

21. 1PMZDJFT
    ɾEFWFMPQNFOUGBTU
    

    ɾMPXDPTUMFBSOJOH
    3FRVJSFNFOUT
    8FC
    J04
    "OESPJE
    "QJ
    #BUDI
    5FSN
    NPOUI
    .FNCFS
    ̎QFPQMF
    $PODFSO
    "OPUIFSFOHJOFFSJT
    CFHJOOFSXIPKVTUHSBEVBUFE
    GSPNQSPHSBNJOHTDIPPM
    4QFDJ
    f
    i
    DBUJPOJTVOEF
    f
    i
    OFE
    

    View Slide

22. ʠ*DIPPTF3FBDU/BUJWFʂʡ
    

    View Slide

23. 5FDIOPMPHZ4FMFDUJPO
    4LJMMT +T 3FBDU
    DBOCFVTFE
    GPS3/
    3/DBONBLFDPEF
    DPNNPO XFC J04 "OESPJE
    
    BOEUFSNTIPSU
    5TXBTVOTUBCMFJOUIBU
    UJNF *EFDJEFE'MPX
    )PU3FMPBE $PEF1VTI
    5IFSFBTPO 3FBDU/BUJWF
    

    View Slide

24. )PXBCPVUFYQPʁ
    6OTUBCMFJOUIBUUJNF
    6TBCMFGVODUJPOTXFSFMJNJUFE
    %FQFOEFODFBOEGVUVSFXFSFTDBSFE
    $PEF1VTIXFSFWFSZIPU
    5FDIOPMPHZ4FMFDUJPO
    4LJMMT +T 3FBDU
    DBOCFVTFE
    GPS3/
    3/DBONBLFDPEF
    DPNNPO XFC J04 "OESPJE
    
    BOEUFSNTIPSU
    5TXBTVOTUBCMFJOUIBU
    UJNF *EFDJEFE'MPX
    )PU3FMPBE $PEF1VTI
    5IFSFBTPO 3FBDU/BUJWF
    

    View Slide

25. 'MVUUFSʁ
    /PUSFMFBTFEJOUIBUUJNF
    5FDIOPMPHZ4FMFDUJPO )PXBCPVUFYQPʁ
    6OTUBCMFJOUIBUUJNF
    6TBCMFGVODUJPOTXFSFMJNJUFE
    %FQFOEFODFBOEGVUVSFXFSFTDBSFE
    $PEF1VTIXFSFWFSZIPU
    4LJMMT +T 3FBDU
    DBOCFVTFE
    GPS3/
    3/DBONBLFDPEF
    DPNNPO XFC J04 "OESPJE
    
    BOEUFSNTIPSU
    5TXBTVOTUBCMFJOUIBU
    UJNF *EFDJEFE'MPX
    )PU3FMPBE $PEF1VTI
    5IFSFBTPO 3FBDU/BUJWF
    

    View Slide

26. -PPLCBDL
    *EJE
    f
    i
    OJTISFMFBTFPOUJNF
    #VUʜ*DPVMEOUQBSUJDJQBUF
    QSFTTDPOGFSFODFʢUP
    f
    i
    YCVHTʣ
    5FDIOJDBMMPPLCBDLJTMBUFS
    

    View Slide

27. ʠ"ZFBSMBUFSʡ
    

    View Slide

28. $503ZBO
    ʰ*XBOUZPVUPSFMFBTFBOESPJE
    

    "QQPGBJS$MPTFUʱ
    :VUBNB,PUBSP
    ʰʢ)FBENJUUFENFMPMʣ:FT TJSʂʱ
    

    View Slide

29. BJS$MPTFU BJS$MPTFU'JUUJOH FYQJDLTT
    
    
    5IFSFXFSFOPBOESPJE"QQPGBJS$MPTFU
    

    JOUIBUUJNF
    4P SFMFBTJOHBJS$MPTFUBOESPJE"QQXBT
    EFDJEFE
    

    View Slide

30. ʠ*DIPPTF3FBDU/BUJWFʂʡ
    

    View Slide

31. ʠ*DIPPTF3FBDU/BUJWFʂʡ
    ʠ-FBWFUPZPVʂʡ
    

    View Slide

32. ʠ*DIPPTF3FBDU/BUJWFʂʡ
    ʠ-FBWFUPZPVʂʡ
    ʠ.ZKPCJTZPVSTVQQPSUʡ
    

    View Slide

33. 5FDIOPMPHZTFMFDUJPO
    8FEPOUIBWFJ04PS
    "OESPJEEFWFMPQFST
    *IBEBQMBOUIBUNBLFDPEFDPNNPO
    CFUXFFOXFCBOE"QQMJLFQJDLTT
    5IPVHIUTUBCMFBOEHPPE
    

    GSPNTVDDFTTGVMMFYQFSJFODF
    5IFSFBTPO 3FBDU/BUJWF
    

    View Slide

34. )PXBCPVU&YQP
    &YQPJTTUBCMFJOUIBUUJNF
    )FBSEQSPEVDUJPOVTBHFT
    #VUXFOFFEFEFKFDU%JEOUDIPPTF
    5FDIOPMPHZTFMFDUJPO
    8FEPOUIBWFJ04PS
    "OESPJEEFWFMPQFST
    5IPVHIUTUBCMFBOEHPPE
    

    GSPNTVDDFTTGVMMFYQFSJFODF
    5IFSFBTPO 3FBDU/BUJWF
    *IBEBQMBOUIBUNBLFDPEFDPNNPO
    CFUXFFOXFCBOE"QQMJLFQJDLTT
    

    View Slide

35. )PXBCPVU'MVUUFS
    3FMFBTFE
    #VUJUXBTUPPGBTUUPVTFʜ
    5PCFIPOFTU
    

    *EJEOUUIJOL'MVUUFSXPVMECF
    QPQVMBS MJLFXFFYBOE/BUJWF
    4DSJQU
    5FDIOPMPHZTFMFDUJPO )PXBCPVU&YQP
    &YQPJTTUBCMFJOUIBUUJNF
    )FBSEQSPEVDUJPOVTBHFT
    #VUXFOFFEFEFKFDU%JEOUDIPPTF
    8FEPOUIBWFJ04PS
    "OESPJEEFWFMPQFST
    5IPVHIUTUBCMFBOEHPPE
    

    GSPNTVDDFTTGVMMFYQFSJFODF
    5IFSFBTPO 3FBDU/BUJWF
    *IBEBQMBOUIBUNBLFDPEFDPNNPO
    CFUXFFOXFCBOE"QQMJLFQJDLTT
    

    View Slide

36. ʠ$PODMVTJPOʡ
    

    View Slide

37. %FWFMPQNFOU
    3/NBLFTSFDSVJUNFOUBOEUFBDIJOH
    FBTZ#FDBVTFXFCEFWFMPQNFOU
    TLJMJTBSFVTFGVMGPS3/
    $PODMVTJPO
    

    View Slide

38. 3FDSVJUNFOUBOEUFBDIJOH
    3FDSVJUNFOUUJNF
    *DBOVTFUZQFTDSJQUʂʂ
    )JSFZPVʂʂ
    ˞0GDPVSTF XF
    DIFDLPUIFSQPJOUT
    

    View Slide

39. 5FBDIJOHUJNF
    *DBNFUPCFBCMFUPVTF3FBDUʂʂ
    5IBUJT(PPEʂ
    

    -FUTUSZ3FBDU/BUJWF
    3FDSVJUNFOUBOEUFBDIJOH
    3FDSVJUNFOUUJNF
    *DBOVTFUZQFTDSJQUʂʂ
    )JSFZPVʂʂ
    ˞0GDPVSTF XF
    DIFDLPUIFSQPJOUT
    

    View Slide

40. "MMNFNCFSDBOEFWFMPQBMMQSPEVDUT
    'MFYJCMFUFBN
    3FDSVJUNFOUBOEUFBDIJOH
    5FBDIJOHUJNF
    *DBNFUPCFBCMFUPVTF3FBDUʂʂ
    5IBUJT(PPEʂ
    

    -FUTUSZ3FBDU/BUJWF
    3FDSVJUNFOUUJNF
    *DBOVTFUZQFTDSJQUʂʂ
    )JSFZPVʂʂ
    ˞0GDPVSTF XF
    DIFDLPUIFSQPJOUT
    

    View Slide

41. 8FDPVMENBLFDPNNPO
    DPEFGPSXFCBOEBOESPJE JU
    NBEFEFWFMPQNFOUGBTUFS
    $PODMVTJPO
    %FWFMPQNFOU
    3/NBLFTSFDSVJUNFOUBOEUFBDIJOH
    FBTZ#FDBVTFXFCEFWFMPQNFOU
    TLJMMTBSFVTFGVMGPS3/
    

    View Slide

42. $PNNPODPEFGPSXFCBOE"QQ
    -PHJD
    3FBDU/BUJWF 8FC
    6TFUIJTDPEFʂ
    :FT TJSʂ
    0LFZʂ
    

    View Slide

43. 3FBDU/BUJWFJTTUBCMFBOE
    IBTNBOZHPPEMJCSBSJFT
    $PODMVTJPO
    8FDPVMENBLFDPNNPO
    DPEFGPSXFCBOEBOESPJE JU
    NBEFEFWFMPQNFOUGBTUFS
    %FWFMPQNFOU
    3/NBLFTSFDSVJUNFOUBOEUFBDIJOH
    FBTZ#FDBVTFXFCEFWFMPQNFOU
    TLJMMTBSFVTFGVMGPS3/
    

    View Slide

44. .BOZMJCSBSJFT $BOVTFXFCMJCSBSZ
    3FBDU/BUJWF$SFEJU$BSE*OQVU
    3FBDU/BUJWF4OBQ$BSPVTFM
    3FBDU/BUJWF"XFTPNF$BSEJP
    

    3FBDU/BUJWF$BSE4DBO
    3FBDU)PPL'PSN
    5BJMXJOESO
    3FDPJM
    

    View Slide

45. /BWJHBUJPOJTEJG
    f
    i
    DVMUBOE
    CPUIFSCFHJOOFST
    "OESPJE+T&OHJOFXBTXFBL
    

    TPNFUJNFT JUEJEOUXPSLXFMM
    $PODMVTJPO
    3FBDU/BUJWFJTTUBCMFBOE
    IBTNBOZHPPEMJCSBSJFT
    8FDPVMENBLFDPNNPO
    DPEFGPSXFCBOEBOESPJE JU
    NBEFEFWFMPQNFOUGBTUFS
    %FWFMPQNFOU
    3/NBLFTSFDSVJUNFOUBOEUFBDIJOH
    FBTZ#FDBVTFXFCEFWFMPQNFOU
    TLJMMTBSFVTFGVMGPS3/
    

    View Slide

46. %JG
    f
    i
    DVMU/BWJHBUJPO
    *XBOUUSBOTJUJPOGSPNUIJT
    QBHFUPUIBUQBHFʜ
    

    *EPOULOPXIPXUPBDIJFWF
    JUʜIFMQNFFFɾɾɾ
    

    View Slide

47. $SVTIJO"OESPJEEFWJDF
    %VNOJUɾɾɾɻXPSLJOHXFMMJO
    J04BOEFNVMBUPS UIPVHIɾɾɾ
    

    VIʜʜʜQPMZ
    f
    i
    MM
    

    *UXPSLTXFMMʜ TFFNTUPCF
    TUSBOHFTPNFUJNFTɾɾ
    ˞XFDBOSFTPMWFUIFTFCZVTJOH)FSNFT OPX
    %JG
    f
    i
    DVMU/BWJHBUJPO
    *XBOUUSBOTJUJPOGSPNUIJT
    QBHFUPUIBUQBHFʜ
    

    *EPOULOPXIPXUPBDIJFWF
    JUʜIFMQNFFFɾɾɾ
    

    View Slide

48. 4PNFUJNFT XFOFFEFE
    OBUJWFBQQLOPXMFEHF*U
    XBTLJMMJOHVT
    $PODMVTJPO
    /BWJHBUJPOJTEJG
    f
    i
    DVMUBOE
    CPUIFSCFHJOOFST
    "OESPJE+T&OHJOFXBTXFBL
    

    TPNFUJNFT JUEJEOUXPSLXFMM
    3FBDU/BUJWFJTTUBCMFBOE
    IBTNBOZHPPEMJCSBSJFT
    8FDPVMENBLFDPNNPO
    DPEFGPSXFCBOEBOESPJE JU
    NBEFEFWFMPQNFOUGBTUFS
    %FWFMPQNFOU
    3/NBLFTSFDSVJUNFOUBOEUFBDIJOH
    FBTZ#FDBVTFXFCEFWFMPQNFOU
    TLJMMTBSFVTFGVMGPS3/
    

    View Slide

49. $PODMVTJPO
    0QFSBUJPOBM
    $PEFQVTINJOJNJ[FE
    EBNBHF XIFOXFOPUJDFE
    CVHTBGUFSSFMFBTF
    

    View Slide

50. (BSEJBO$PEF1VTI
    3FMFBTFEDIFFSTʂʂ
    

    View Slide

51. #VHSFQPSUʂʂ
    (BSEJBO$PEF1VTI
    3FMFBTFEDIFFSTʂʂ
    

    View Slide

52. /PXBZʜʂʂ
    (BSEJBO$PEF1VTI
    #VHSFQPSUʂʂ
    3FMFBTFEDIFFSTʂʂ
    

    View Slide

53. $PEF1VTI
    

    3FMFBTFʂʂʂ
    (BSEJBO$PEF1VTI
    /PXBZʜʂʂ
    #VHSFQPSUʂʂ
    3FMFBTFEDIFFSTʂʂ
    

    View Slide

54. $PVMENJOJNJ[F
    EBNBHFɾɾɾʂʂ
    (BSEJBO$PEF1VTI
    $PEF1VTI
    

    3FMFBTFʂʂʂ
    /PXBZʜʂʂ
    #VHSFQPSUʂʂ
    3FMFBTFEDIFFSTʂʂ
    

    View Slide

55. 3/FOBCMFE
    f
    l
    FYJCMFUFBN BMM
    NFNCFSBMMSPVOEQMBZFS
    
    8FDPVMEVTFTPNFMJCSBSJFT
    GPSXFNF
    3FBDU/BUJWF6QEBUFXBT
    WFSZWFSZWFSZIBSE
    ˍ*GOPUFYQFSJFODFE
    EFWFMPQFS DPVMEOUEPJUɾɾɾ
    $PODMVTJPO
    0QFSBUJPOBM
    $PEFQVTINJOJNJ[FE
    EBNBHF XIFOXFOPUJDFE
    CVHTBGUFSSFMFBTF
    

    View Slide

56. 7FSZIBSEVQEBUF
    *EPOPUXBOUUPVQEBUFʂʂ
    

    *EPOPUXBOUUPVQEBUFʂʂ
    

    *EPOPUXBOUUPVQEBUFʂʂ
    ˞3/IBT(PUUFOBMPUCFUUFSOPX
    

    ˞*UJTWFSZFBTZJGZPVVTF&YQP
    #VJMEɾɾɾɾɻ
    

    #VJMETZTUFNXBTCSPLFO
    ɾɾɾɻ
    

    View Slide

57. 7FSZIBSEVQEBUF
    *DBOUBGGPSEUPVQEBUF
    

    *XJMMVQEBUFTPNFEBZʙ
    

    View Slide

58. 5PPCVTZɾɾɾʂʂ
    

    BXGVMɾɾɾɻ
    7FSZIBSEVQEBUF
    *DBOUBGGPSEUPVQEBUF
    

    *XJMMVQEBUFTPNFEBZʙ
    

    View Slide

59. *IBWFHPUUBVQEBUFʁ
    

    %VFUP"QQTUPSFVQEBUF
    5PPCVTZɾɾɾʂʂ
    

    BXGVMɾɾɾɻ
    7FSZIBSEVQEBUF
    *DBOUBGGPSEUPVQEBUF
    

    *XJMMVQEBUFTPNFEBZʙ
    

    View Slide

60. +VTUEPJUCZVTJOHHVUTʂ
    *IBWFHPUUBVQEBUFʁ
    

    %VFUP"QQTUPSFVQEBUF
    7FSZIBSEVQEBUF
    *DBOUBGGPSEUPVQEBUF
    

    *XJMMVQEBUFTPNFEBZʙ
    5PPCVTZɾɾɾʂʂ
    

    BXGVMɾɾɾɻ
    

    View Slide

61. ʠ4VNNBSZʡ
    

    View Slide

62. "DUVBMMZɾɾɾ
    8FIBWFBDBTFVTJOH'MVUUFSUPEFWFMPQOFXCVTJOFTT
    5IFZTBZ TUBCJMJUZBOEFBTZOBWJHBUJPOBSFHPPE
    &BTZVTF BOETUBCJMJUZ
    

    View Slide

63. 5PQVUJUCMVOUMZ ʰ*BNVTJOH
    f
    l
    VUFSʱJTDPPM%POUZPVUIJOLTP
    "DUVBMMZɾɾɾ
    8FIBWFBDBTFVTJOH'MVUUFSUPEFWFMPQOFXCVTJOFTT
    5IFZTBZ TUBCJMJUZBOEFBTZOBWJHBUJPOBSFHPPE
    

    View Slide

64. 5IJTTVHHFTUʰ3FBDU/BUJWFJTHFOFSBMʱ *UIJOL
    "DUVBMMZɾɾɾ
    5PQVUJUCMVOUMZ ʰ*BNVTJOH
    f
    l
    VUFSʱJTDPPM%POUZPVUIJOLTP
    8FIBWFBDBTFVTJOH'MVUUFSUPEFWFMPQOFXCVTJOFTT
    5IFZTBZ TUBCJMJUZBOEFBTZOBWJHBUJPOBSFHPPE
    

    View Slide

65. 8JUDITIPVME*DIPPTFʁ"OTXFSJTDBTFCZDBTFɾɾɾ
    

    ɹɹ*XJMMDIPPTF3/JOUIFTBNFTJUVBUJPOFWFOOPX
    #VU*XBOOBUSZ'MVUUFSɾɾɾ
    "DUVBMMZɾɾɾ
    5IJTTVHHFTUʰ3FBDU/BUJWFJTHFOFSBMʱ *UIJOL
    5PQVUJUCMVOUMZ ʰ*BNVTJOH
    f
    l
    VUFSʱJTDPPM%POUZPVUIJOLTP
    8FIBWFBDBTFVTJOH'MVUUFSUPEFWFMPQOFXCVTJOFTT
    5IFZTBZ TUBCJMJUZBOEFBTZOBWJHBUJPOBSFHPPE
    

    View Slide

66. 4VNNBSZ
    8FCEFWFMPQNFOUTLJMMTBSFVTFGVM
    

    3FDSVJUJOHBOEUFBDIJOHBSFFBTZ
    

    3/FOBCMFTVTUPSFNPUFVQEBUF
    BOEHJWFTVTDPNNVOJ[BUJPO
    5IFTFHPPEQPJOUTIFMQFEVT
    

    View Slide

67. 4PNFUJNFT IFXBTUPSUVSJOHVTɾɾɾ
    4VNNBSZ
    8FCEFWFMPQNFOUTLJMMTBSFVTFGVM
    

    3FDSVJUJOHBOEUFBDIJOHBSFFBTZ
    

    3/FOBCMFTVTUPSFNPUFVQEBUF
    BOEHJWFTVTDPNNVOJ[BUJPO
    5IFTFHPPEQPJOUTIFMQFEVT
    

    View Slide

68. *BQQSFDJBUF3/
    *DPVMEOPUEPUIFTFEFWFMPQNFOU JGUIFSFXFSFOPU3FBDU/BUJWF
    4VNNBSZ
    4PNFUJNFT IFXBTUPSUVSJOHVTɾɾɾ
    8FCEFWFMPQNFOUTLJMMTBSFVTFGVM
    

    3FDSVJUJOHBOEUFBDIJOHBSFFBTZ
    

    3/FOBCMFTVTUPSFNPUFVQEBUF
    BOEHJWFTVTDPNNVOJ[BUJPO
    5IFTFHPPEQPJOUTIFMQFEVT
    

    View Slide

69. 5IBOLZPVGPSZPVSBUUFOUJPO
    

    View Slide