Developer area/Mahara Mobile
From Mahara Wiki
Revision as of 15:15, 23 September 2016 by Aaronw (Created page with "'''Mahara Mobile''' is a cross-platform mobile app for Mahara, being developed by [http://catalyst.net.nz Catalyst IT] for the Mahara project. It's currently (Sept 2016) still...")
Mahara Mobile is a cross-platform mobile app for Mahara, being developed by Catalyst IT for the Mahara project. It's currently (Sept 2016) still in development, with a potential launch corresponding with the Mahara 16.10 release.
The source code is on the Mahara github project: https://github.com/maharaproject/mahara-mobile
Software libraries used
- Reload and replace the entire page/iframe (Easier to code, but slow and ugly for the user)
- Use JQuery to locate specific DOM elements to update, and just change those (Faster for the user, but finnicky and bug-prone to code)
React avoids both of these, by using a "Virtual DOM" and automatically adjusting the "actual DOM" to match it. So, you can write React code that acts as if it's re-printing the entire page, and then React will only update the parts of the page that have actually changed. Despite the extra computation, this actually makes for a faster user experience.
// Awkward block of variable declarations var Form = MyFormComponent; var FormRow = Form.Row; var FormLabel = Form.Label; var FormInput = Form.Input; var App = ( <Form> <FormRow> <FormLabel /> <FormInput /> </FormRow> </Form> );
So if you see code like that in the codebase, know that it's JSX.
The app uses Redux to maintain state. You'll notice a prominent "StateStore" object in the codebase. That comes from Redux.
We also use the JS library Grapnel as a "router". This is basically the way that we manage switching between different "pages" of our single-page application.
Babel & Browserify
Mahara Mobile uses Babel and Browserify in its build script.