Hi @natedogg , this looks amazing, I tried your demo app and I will start rebuilding my app using your service, but I wanted to check the ideal dimensions you recommend that works best with your solution.
Also do you have some best practices apart from the information provided in the documentation , for example how to do footer menu or side menu …etc ?
Thanks
Majd
Thanks @majd!
As far as dimensions go, if your app looks good in a mobile browser, it will look the same using our service. I’d recommend using Bubble’s responsive builder or using the Chrome console (Command + Option + I when previewing your app on Mac) to test how your app looks on different mobile screen sizes. That will give you an idea of how your app will look.
You can also use our preview app to see how your app would look as a native app. You don’t have to purchase the plugin to view your app inside of our preview app, just to implement the native features.
As far as other best practices, here’s something I mentioned recently on single-page vs multi-page applications: Best practices for mobile app implementation?
For menus, I’ve typically seen people either use Bubble’s built-in Slidebar Menu, or have a “Tab Bar” menu at the bottom of the screen. For the latter, you could have a floating group at the bottom of the screen with other groups inside of it for navigation. Tab menus tend to work better on single-page native applications, instead of multi-page.
Hope that helps! Let me know if you have any other questions!
Hey, looks great! Once the app is built using your service, we can continue to update our bubble app and the app itself will automatically update? Or do we need a new build per bubble update?
Also, does the app build bundle include help with implementing stuff, like push notifications?
Hey @alejandrowunderlich! Great questions!
Correct! Your app will automatically update when you update your Bubble app, just like it does in a web browser.
As for feature implementation, we have full documentation on all of our native features, and we offer support for any questions you might have beyond that!
We’ve had quite a few people go through the App Build process now and it’s been pretty seamless 
Hey everyone, I’m excited to announce a new feature that we’ve just released 
Sign in with Apple!
As some of you may know, beginning in April 2020, Apple is now requiring all iOS apps and updates that offer social logins (such as Facebook, Twitter, etc.) to also offer Sign in with Apple as an equivalent option.
This feature solves that problem. You’ll be able to get your User’s First Name, Last Name, Email, and User ID from Apple after they sign in. From there, you can follow the instructions from our documentation to create an easy password-less flow in your login workflows.
If you’re already a Codeless Academy customer, simply update your plugin version and TestFlight version to try it out!
If you’re new, make sure to download our iOS Preview App and scroll down to the feature on our homepage. If you want to test it in your own app in preview mode, all you need to do is create a project on our website and purchase our plugin.
Happy Building!
Only just picked up on this thread but it appears @natedogg you back with a bang!!
What a wonderful feature rich service.
So jealous of you and cuoins, well done!!!
Quick question @natedogg. Can we use the ‘mobile version’ checkbox in Bubble editor to define the pages that should be used in the app instead of making them responsive. And should it be done in the workflows when we’re defining the page to navigate to?
Hey @sharma.himanshu0608!
So you can definitely use the “mobile version” checkbox if you want to use the same URL for both a desktop version and mobile version. However, I wouldn’t recommend that. If you do it that way and build specific native features into your app (such as Face ID or Apple Pay), those features won’t work for anyone who visits that page in their mobile browser, outside of the native app.
I’d recommend having a separate page or pages that are for your native app.
Also, I wouldn’t recommend not making the page responsive, as not all mobile devices have the same screen resolution. Without responsiveness, you could have a page that looks great on an iPhone X, but doesn’t look good or formats weird on a small Android device.
Hope that helps! Let me know if you have any other questions!
I’m excited to announce a HUGE new update that brings some new amazing brand-new native features that you can implement into your Bubble app. To test these new features, make sure to update to the newest version of the Codeless Academy Plugin and Testing App. Be sure to also check out our documentation for more info!
1. Deep Linking:
We’re incredibly proud of releasing this feature! To my knowledge, we’re the only native wrapper for Bubble apps that offers deep linking.
For those of you that aren’t familiar with deep linking:
Deep Linking is an amazing feature that allows you to open your native app directly with a link from the web. You can even send data with the link that can be used by your native app!
For example, imagine sending a customer an email prompting them to purchase a specific product. When the user clicks on the product in the email, instead of being taken to your website, they are taken directly to that product in your native app where they can immediately make a purchase.
Other examples of use cases for deep linking are:
- Having Users’ notifications (email, text, push, etc.) open in your native app, directly on the content of the notification
- Running ads (Facebook, Instagram, Google, etc.) that open directly into your native app
- Taking Users immediately back into your app after they confirm their email address or phone number
- Having a dual web/native experience where your Users sign up & pay for your service on the web, but utilize the service in the native app (This is useful for scenarios where you want to avoid Apple’s 30% In-App purchase fee, for example.)
You can use deep links for these use cases, and so much more! Get creative!
2. QR/Barcode Scanner
Our Barcode Scanner allows you to let your Users scan any type of barcode; QR codes, shipping labels, product barcodes, and more! The data from the scanned barcode will be passed back to your app, allowing you to utilize it as needed.
3. Credit Card Scanner
Our Credit Card Scanner allows you to let your Users scan their credit card information, instead of typing it in themselves!
4. Improved Location Data (GPS)
We’ve improved the way that your native app will retrieve location data from your Users, including in the background!
Good luck, and Happy Building!
That’s a significant update!
Thanks! And there’s plenty more on the way 
Hey there @natedogg
I’m moving towards a mobile app for my next project, and I’m in the process to compile a lil’
showdown between the wrappers available. Would be fantastic if you were able to share what’s next in your road map.
Looks like this update hit all the stuff outlined in your first post. well done! this is shaping up
to be a very interesting alternative for going “native” indeed.
i want to use codeless academy.
How width do i make for native apps??
i heard only 2% user’s devise is 320px,
so do i should make my apps 360px or more over??
@ndaichi.0128 Hello!
I’m using a 380px responsive width and it’s working fine!
I truly recommend Codeless Academy, @natedogg is very nice, always here to help and he provides a real support
Thanks @casheets123!
We’re still putting together what exactly our long-term roadmap is going to look like. Some things are new features, and some are improvements to our existing features.
In the meantime, you can preview a few things that we have upcoming in the “Coming Soon” section of Features on our website.
Hey @ndaichi.0128! As a general rule of thumb, our wrapper will mimic the exact same layout of how your app would look on the browser on a similarly sized device. But you can always use our free Preview app to test how your app would look as a native app!
Thanks for the kind words, @vnihoul77! Glad we were able to get your app up and running! You know I’m here if you need me!
Ah, thanks. @natedogg. I see that in app purchases aren’t supported yet. Do you have a rough time frame for implementing that?
Hi, I have installed the CA Native plugin, created a new page as initial URL and now I am making some experiments using Testflight/Codeless app.
My question is: how does the App Header is supposed to look like and to work ? I do not see any element called App Headed. I put into the page the CodelessNativeApp element but it seems that it is only related to the status bar. Also if I add a workflow on page load that does the Show/Update App Header CodelessNativeApp and I add title, description and button, I get only the status bar filled with text and button. What is the meaning of the App Header ? Thanks
Hey @stefanof!
The area that you see with the text and button is indeed the App Header! I think you may be confusing what an app header is vs what the status bar is.
The Status Bar is the small section at the top of the app that shows the time, cellular network, wifi information, etc. That information will always be visible unless you hide it with one of our Workflows.
When you show an App Header, you’ll see a section at the top of the app that has a color that you choose, as well as a title and button that you specify. When you add the App Header, the Status Bar continues to be visible inside of the App Header unless you hide it as part of the Workflow.
Let me know if you have any more questions about that process!
Hey @natedogg. - Any updates on when we could expect a “true” fullscreen design that will scale our site to screen sizes such as the iPad’s? Currently, our test’s screen is only expanding to about 50% of the page on the iPad.
Another question, what are our options for splash screen / loading screens? Are we able to utilize pods such Lottie or json files from AE?
Thanks,
P
