If you have an app bootstrapped with [create-react-app](https://github.com/facebook/create-react-app), you may have a certain amount of boilerplate code that came with it, especially if you ejected. Now you may want to sync up with the latest changes in create-react-app. I've ported [ember-cli-update](https://github.com/ember-cli/ember-cli-update) to [create-react-app-updater](https://github.com/kellyselden/create-react-app-updater) to get the same benefits for react apps. You can keep your pojects in sync as well as run codemods based on react version.

1. Keep your projects
up-to-date
Kelly Selden
@kellyselden

2. • Hiring any skill level (even junior!)
• Remote-first w/ offices all over
• Open source friendly
• Ember.js core team
• Working on ember-cli

3. Why am I here?

4. •motivation
•demo
•deep dive
create-react-app-updater

5. ember-cli

6. ember-cli =>
ember-cli-update

7. ember-cli-update =>
create-react-app-updater

8. Do we need an updater?

9. •automated updates
•conflict resolution
•runs codemods
•and more™
create-react-app-updater

10. npm i -g create-react-app-updater
create-react-app-updater
# or
cra-update
npx create-react-app-updater

11. cra-update
cra-update --run-codemods

12. Demo Time!
(pray to the WiFi gods)

13. cra-update
Would update from 1.0.0 to 2.1.5.

17. 1. detects your local version
2. goes out to npm to get the latest version
3. generates two apps using your version and the
new version (in tmp)
4. generates a git patch between them
5. applies the patch to your repo
bonus. applies a JSON patch to package.json
What is happening?

18. • Pros
• only changes the code that needs to update
• it is aware if git conflicts
• Cons
• you have to be online to update
• can be slow

19. •resolve any conflicts
•fix any broken tests
•commit
Before next step…

20. cra-update --run-codemods

21. •know where to find them
•know how to run them (clone, yarn, params)
•know if they’re compatible
Why not run them yourself?

22. • uses a downloaded manifest rather than locked dependencies
• then downloads and runs the codemods
• Pros
• always latest codemod fixes
• can add new ones
• Cons
• not protected against bugs in codemods
• reliant on internet (slower)
--run-codemods

23. •--from and --to
•--resolve-conflicts
•--stats-only
•--list-codemods
Extended options

24. cra-update --stats-only

25. --list-codemods

26. https://github.com/
kellyselden/create-react-app-
updater
The end.