Using Lavaca to Start a New Mobile App: Part 1
- Use of Promises: Once I understood the Promise concept and broke out of passing callbacks, I never wanted to go back. Check out Lavaca's introduction to Promises
- Built for Mobile First: Ever since “Mobile first” was first muttered it clicked with me, and now drives how I approach every project. It’s a continuation of the mindset of progressive enhancement.
Starting a Project
There are a few prerequisites, but if you have dabbled with another MVC library or Node, then you likely will already have everything you need.
You’ll want the latest stable version of Node and NPM. Oh, and a Mac.
Then it’s a matter of grabbing the Lavaca CLI tool in a Terminal window
curl https://raw.github.com/mutualmobile/lavaca/master/getlavaca > /usr/local/bin/getlavaca && chmod +x /usr/local/bin/getlavaca<
Once everything is installed...
- In the Terminal, go to the directory where you want your project and run:
- Use the master branch unless you can find a reason not to
- Name your main app directory
- Go to your newly created app’s directory
- Install Lavaca’s Node dependencies
- Start a server via grunt
- In a browser go to http://localhost:8080
You now have an example project running!
But we don’t want to just run in a browser... we want to build this as a hybrid application. Lavaca doesn’t assume anything at creation, so we need to tell Lavaca we want to build for specific platforms with Cordova.
This consists of installing the Cordova CLI and then initializing a fresh iOS/Android/etc. project as needed. Running the below commands by default will create a blank iOS project and a blank Android project. Read the Lavaca Guide to find out how to change that.
npm install -g cordova grunt cordovaInit
This will sync Lavaca’s commands with the Cordova CLI and create source folders for both projects. The last command needed is
This will merge your HTML/CSS/JS with the Android and iOS src projects, by creating a new folder in your app’s directory called build. If dealing with an iOS project, for example, open build/ios/AppName.xcodeproj ... hit run... and you’ll see your app as packaged by Cordova. Part 1 is now complete.
Part 2 will review the basic structure of an app, and what it takes to replace the example app with your own.