Building native apps in hours with Meteor

In this talk we are going to show how to create a simple native app with Meteor.

It's a puzzle game.

Transcript

1. BUILDING NATIVE APPS IN HOURS WITH METEOR @FilipeNevola
2. REMEMBER: METEOR IS ABOUT… ▸ Real apps ▸ Real users ▸ Real results ▸ In this talk we are going to see an app using: Meteor, Cordova, Methods, Publications, React, Tailwindcss, OneSignal, Fastlane and more…
3. WHY METEOR AND CORDOVA? ▸ Meteor is great to build web SPAs ▸ Cordova is the easiest way to wrap web apps ▸ Together you can bring your web app to stores in hours
4. ALTERNATIVES? ▸ Meteor with React Native https:// guide.meteor.com/react-native.html ▸ Meteor with Flutter https://medium.com/ @tanutapi/writing- fl utter-mobile-application- with-meteor-backend-643d2c1947d0
5. TODAY FILIPE NÉVOLA ▸ Previously Java Architect ▸ Javascript developer for 9 years ▸ Production apps with Meteor since 2013 ▸ Meteor Evangelist since the end of 2019 ▸ Today: Meteor CEO Twitter / Instagram: @FilipeNevola
6. LET’S BUILD A PUZZLE GAME ▸ Context: I used to play this game with my father. ▸ Using two words (Aquico and Amigo) you create sequences and your friend need to say the same sequence but fl ipping Amigo and Aquico. ▸ For example: If you say Amigo, Aquico your friend need to reply with Aquico, Amigo. ▸ If you increase the length of the sequence it starts to get really hard.
7. WHY A NATIVE APP? ▸ Push Noti fi cations are very effective to engage your users. ▸ I didn’t want to create an app for a Todo List or a CRUD. :)
8. FIRST, LET’S REVIEW…
9. REVIEW NATIVE ON APP STORE ▸ Built-in Cordova integration ▸ Step by step guide to set up ▸ https://github.com/meteor/meteor/tree/ cordova-example/examples/cordova
10. REVIEW NATIVE GOOGLE PLAY ▸ Built-in Cordova integration ▸ Step by step guide to set up ▸ https://github.com/meteor/meteor/tree/ cordova-example/examples/cordova
11. REVIEW UNIVERSAL LINK AND DEEP LINK ▸ URL to open your native app and the right location ▸ https://github.com/quavedev/ universal-links
12. REVIEW PUSH NOTIFICATIONS ▸ Step by step guide to set up ▸ https://github.com/meteor/meteor/tree/ cordova-example/examples/cordova
13. REVIEW APP UPDATES ▸ Ask user's permissions ▸ Or force update ▸ https://github.com/quavedev/reloader/
14. REVIEW SOCIAL LOGINS ▸ Apple ▸ https://github.com/quavedev/apple-oauth ▸ https://github.com/quavedev/accounts- apple ▸ Facebook ▸ https://github.com/quavedev/meteor- facebook-native-login
15. BONUS ▸ As we are building a web app we can also provide a PWA
16. REVIEW PWA ▸ Install Prompt ▸ https://github.com/quavedev/pwa/
17. REVIEW WINDOWS PWA ▸ Install on Windows ▸ Open on Windows Startup
18. MORE ABOUT ALL THE OPTIONS WITH METEOR… ▸ My talk: Meteor Today and Tomorrow in the Meteor Impact 2020: https:// www.youtube.com/watch?v=Zg_NTjtvMP8 ▸ Part 1: Success cases. ▸ Part 2: A real app with Meteor including Native Apps. ▸ Part 3: What is (was) coming next.
19. ENOUGH TALKING, LET’S SEE SOME CODE ▸ Code Overview ▸ Running on iOS ▸ Running on Android ▸ Mobile setup ▸ Assets ▸ Push Noti fi cation ▸ Build script ▸ Publish script
20. Q&A
21. ARE YOU NEW TO METEOR? ▸ Up-to-date Tutorials ▸ Step-by-step from creating your app to deploying it ▸ React, Vue.js, Svelte and Blaze tutorials ▸ https://www.meteor.com/developers/tutorials ▸ Docs: https://docs.meteor.com/ ▸ Guide: https://guide.meteor.com/ ▸ Cloud guide: https://cloud-guide.meteor.com/
22. HOW TO KEEP UP TO DATE? ▸ Monthly Podcast: https://podcast.meteor.com/ ▸ Meteor Forums: https://forums.meteor.com/ ▸ Meteor blog: https://blog.meteor.com/ ▸ Meteor examples: https://github.com/meteor/examples ▸ GitHub Discussions (new): https://github.com/meteor/meteor/ discussions/
23. HOW TO HELP METEOR? ▸ Join the Community Slack: Invite ▸ Promote Meteor ▸ Create apps with Meteor and share with your friends ▸ Write blog posts about what you are doing with Meteor ▸ Record videos showing you working with Meteor ▸ GitHub ▸ Triage issues ▸ Review and Submit PRs ▸ Docs and Tutorials updates
24. THANKS! ▸ How to Create an App: Videos every week ▸ Subscribe EN-us: https://www.youtube.com/c/HowToCreateAnAppDev ▸ Subscribe PT-br: https://www.youtube.com/c/ComoCriarumAppFilipeNevola Twitter / Instagram: @FilipeNevola