Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
@WolframKriesing, Code Terminator Or-alikes
we are hiring!!!
what?
#kidding :)
what, now?
really!
time tracking
time accounting
vacation planning
https://www.flickr.com/photos/tracyhunter/104459256
https://www.flickr.com/photos/peterpearson/2215299880
https://www.flickr....
they do enterprise
A(pp) bit of
history
time
time tracking
1. fast
2. lie-fi safe
3. easy to use
not working working in break
https://www.flickr.com/photos/cubagallery/5729758898
Background work + offline
Let’s get started
>	npm	install	react-native-cli	
>	react-native	init	miniApp
„Consider installing yarn to make
this faster: yarnpkg.com" ;)
>	npm	install	react-native-cli	
>	react-native	init	miniApp	
>	react-native	run-ios
3089 lines later
~1min waiting
Shift+Cmd+H+HCmd+DCmd+R
Most used shortcuts
dev experience
Cmd+D
you need a device
(or simulator)
>	react-native	run-ios	
>	react-native	run-android
https://www.genymotion.com/
react-native AND
babel
https://www.flickr.com/photos/101464333@N07/9733214002
smallest common
denominator
not stage-0 as you
know it!
https://github.com/facebook/react-native/issues/4844#issuecomment-204035720
ES6 dependency
./src/test-setup.js
mocha		
		--compilers	js:babel-register		
		--require=./test-setup.js
device specific?
Android iOS
https://www.flickr.com/photos/31135424@N07/4878595504
Geolocation
https://www.flickr.com/photos/st3f4n/143623967
mobile is
+
+
https://www.flickr.com/photos/derelllicht/264546918
ship
# ./fastlane/Fastfile
desc "Submit a new Beta Build to Apple TestFlight"

desc "This will also make sure the profile is up...
DEPS
DIET
#	react-native	talk	
-	[x]	deploying,	fastlane	
		-	[x]	iOS	test	flight	
		-	[x]	android	beta	version	(alpha,	beta,	produc...
we are hiring!!!
contact me
@wolframkriesing
wolfram@crewmeister.com
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Our react-native experiences at crewmeister
Upcoming SlideShare
Loading in …5
×

Our react-native experiences at crewmeister

333 views

Published on

The slides about some of our experience we collected while building the Crewmeister time tracking app.

Published in: Technology

Our react-native experiences at crewmeister

  1. 1. @WolframKriesing, Code Terminator Or-alikes
  2. 2. we are hiring!!!
  3. 3. what?
  4. 4. #kidding :) what, now? really!
  5. 5. time tracking time accounting vacation planning
  6. 6. https://www.flickr.com/photos/tracyhunter/104459256 https://www.flickr.com/photos/peterpearson/2215299880 https://www.flickr.com/photos/streetsmitty/15231081875 Our Customers <50 employees
  7. 7. they do enterprise
  8. 8. A(pp) bit of history
  9. 9. time
  10. 10. time tracking 1. fast 2. lie-fi safe 3. easy to use
  11. 11. not working working in break
  12. 12. https://www.flickr.com/photos/cubagallery/5729758898 Background work + offline
  13. 13. Let’s get started
  14. 14. > npm install react-native-cli > react-native init miniApp
  15. 15. „Consider installing yarn to make this faster: yarnpkg.com" ;)
  16. 16. > npm install react-native-cli > react-native init miniApp > react-native run-ios
  17. 17. 3089 lines later ~1min waiting
  18. 18. Shift+Cmd+H+HCmd+DCmd+R Most used shortcuts
  19. 19. dev experience
  20. 20. Cmd+D
  21. 21. you need a device (or simulator)
  22. 22. > react-native run-ios > react-native run-android
  23. 23. https://www.genymotion.com/
  24. 24. react-native AND babel https://www.flickr.com/photos/101464333@N07/9733214002
  25. 25. smallest common denominator
  26. 26. not stage-0 as you know it!
  27. 27. https://github.com/facebook/react-native/issues/4844#issuecomment-204035720
  28. 28. ES6 dependency
  29. 29. ./src/test-setup.js
  30. 30. mocha --compilers js:babel-register --require=./test-setup.js
  31. 31. device specific?
  32. 32. Android iOS
  33. 33. https://www.flickr.com/photos/31135424@N07/4878595504 Geolocation
  34. 34. https://www.flickr.com/photos/st3f4n/143623967 mobile is
  35. 35. + +
  36. 36. https://www.flickr.com/photos/derelllicht/264546918 ship
  37. 37. # ./fastlane/Fastfile desc "Submit a new Beta Build to Apple TestFlight"
 desc "This will also make sure the profile is up to date"
 lane :beta do
 match(type: 'appstore')
 
 gym(
 scheme: "miniapp",
 project: "./ios/miniapp.xcodeproj"
 )
 pilot(username: „who@are.you")
 end
  38. 38. DEPS DIET
  39. 39. # react-native talk - [x] deploying, fastlane - [x] iOS test flight - [x] android beta version (alpha, beta, production) - [x] build via npm scripts - [x] fastlane pushes all the way into the appstore, just need to click and release it - [x] android builds just need to be uploaded - [ ] tests run purely in node, makes it easy to separate react and JS - [x] simulators - [x] babelrc removal script - [x] device specific: the group selector, is just different native UI - [ ] sync+async architecture - [ ] offline capability - [x] debugging with chrome, even on the real device - [ ] adb can be a saviour - [ ] error reporting is kinda painful - [x] GPS on mobile is no fun - [x] use the rn docs - [x] the API - [x] the components - [ ] as little number of dependencies as possible
  40. 40. we are hiring!!! contact me @wolframkriesing wolfram@crewmeister.com

×