volume 3, issue 1, january – february 2014 groceryhub ... · the ios and ruby on rails...

International Journal of Emerging Trends & Technology in Computer Science (IJETTCS) Web Site: www.ijettcs.org Email: [email protected], [email protected]

Volume 3, Issue 1, January – February 2014 ISSN 2278-6856

Volume 3, Issue 1 January – February 2014 Page 66

Abstract — Repetitive visits to grocery stores and over-purchasing of grocery items is a common problem that people are faced with in USA. The idea of GroceryHub App is to allow individuals maintain and synchronize a shared list of items with people they share grocery with. GroceryHub is a free cloud-based solution that makes use of cutting technologies like Amazon S3 and Heroku. GroceryHub fully and flawlessly supports the offline mode in case a user doesn’t have network connectivity. It has the ability to attach images to items. Keywords — Grocery; Cloud App; Mobile App; Shared Lists; iOS; Ruby on Rails; Heroku; Amazon Web Services. 1. Introduction With the wonderful advancements in the field of information technology, sometimes smaller, more common daily life problems faced by the people are neglected. GroceryHub is aimed at resolving one such problem for common people: maintenance and synchronization of grocery lists. It is also capable of doing so without having people to pay anything for it, unlike some other solutions aimed at resolving the same problem. Currently a few applications exist in App Store and Google Play that aim at helping people maintain grocery lists. One such app is Checklet [1], which doesn’t event allow users to organize their lists in categories, and the ability to share lists is only via email, which is pretty inconvenient. On top of all that it costs $4.99, where as GroceryHub is free! Another similar app is Simple Grocery List [2]. It too suffers from some of the same problems as Checklet. It doesn’t have any sharing capability or authentication system whatsoever. Free Grocery List [3] is another app that tries to solve the same problem. However, unlike its name, it’s not “free”. It doesn’t even let you create custom categories unless you have paid $4.99 for the premium version. Plus, it suffers from serious bugs like duplication of items and synchronizing issues. ShoppingList [4] too doesn’t let people do much unless they get the paid version. Like synchronizing the list with other users and creating unlimited categories are premium features, unlike GroceryHub. Crashing and incompatibility with newer iOS versions are other problems with this app.

The GroceryHub App differentiators are as follows: a- Cloud-Based Services - Since GroceryHub has a

cloud-based server side, it allows a lot of scalability, flexibility and efficiency. If the traffic increases, the server side resources can be easily scaled up, which will take care of a lot of performance issues that some of the other related apps suffer from.

b- Offline Mode - A lot of related apps cannot support offline mode since they haven’t implemented a synchronization system between unique identifiers on the iOS device and the unique identifiers on the server side. On the other hand GroceryHub fully and flawlessly supports the offline mode in case a user doesn’t have network connectivity.

c- Image Attachments - The ability to attach images to items is a huge plus for GroceryHub. Related apps don’t allow users to do that, but it is a very powerful and useful feature, since attaching an image can save all the time to type in tedious notes and descriptions for an item.

d- As Cheap as Free - GroceryHub costs nothing as compared to the other related apps in the market costing a significant amount of money for a simple task of maintaining grocery lists! A feature like creating an unlimited number of categories, which is offered for free by GroceryHub, is a premium feature in most of the other related apps.

e- Highly Focused and Clean UI - GroceryHub is highly focused on one task: helping users maintain their grocery list and synchronize it with other users of their hub. The more focused the goal of the app, the cleaner the user interface of the app. On the other hand, most of the related apps try to do too much from maintaining coupons, to locating stores, to maintaining full calendars for families. This pollutes the user interface too much and affects the user experience significantly.

This paper is organized such that it begins with the feature list of GroceryHub in section 2. Then it discusses the technologies used in the application, as well as hardware and OS specifications in sections 3 and 4,

GroceryHub – A Cloud Based App - Shared Grocery Lists for iOS

Adnan Shaout and Shahzeb Khan

The University of Michigan – Dearborn

The Electrical and Computer Engineering Department Dearborn, Michigan - Dearborn




respectively. Section 5 sheds some light on the architecture. Section 6 is dedicated to the discussion of software processes used in the making of GroceryHub. In section 7 it describes the possible future enhancements. The paper ends with a conclusion about GroceryHub in section 8. 2. Feature List The major features of GroceryHub are as follows: a. Sign up / sign in b. Create / join a hub c. Create / edit / delete categories d. Create / edit / delete items e. Attach images to items f. Synchronize lists A brief description of each of these features is as follows: a. Sign Up / Sign In - GroceryHub allows people to sign

up for using the application. Once a user has signed up, then the user can use the mobile interface of the application to create and maintain grocery lists. All necessary validations like email uniqueness and password encryption are implemented and in place. Figure 1 shows the sign up / sign in screen.

Figure 1. Sign in / sign up screenshots.

b. Create / Join a Hub - At the time of sign up, users are offered a choice between creating a hub or joining an existing one. In either case, all they need to do is enter a hub’s name, and GroceryHub will do the rest for them. Figure 2 shows the hub related screenshots.

c. Create / Edit / Delete Categories - Once users are connected to a hub, they are assigned a shared list of grocery items. They can add new grocery categories (e.g. snacks, breakfast, deli, etc.) to it, edit existing categories, or even delete them. Figure 3 shows categories related screenshots.

d. Create / Edit / Delete Items - GroceryHub allows users to add items (e.g. eggs, milk, bread, etc.) to the categories defined for their lists. They can add and edit details about the item like name, quantity and notes as well. Users can also mark items already bought, and even delete them from the list if needed. Figure 4 items related screenshots.

Figure 2. Hub related screenshots.




Figure 3. Categories related screenshots.

Figure 4. Items related screenshots.

e. Attach Images to Items - Users can attach images to

items as shown in figure 4. Any image that is present on their phone, or was taken by the phone’s camera can be attached. Users can update these images as well if needed. Amazon S3 buckets are used for the storage of these images.

f. Synchronize Lists - GroceryHub allows users to synchronize their grocery lists with all members of their hub. This way all hub members are up-to-date on what is already bought and what is needed.

3. Technological Solution The iOS GUI is at the front-end of this application. Objective-C [5] and Ruby on Rails [6] have been used as programming languages to program GroceryHub for iOS.

Apple Push Notification Service [7] has been used for push notifications from the web server to the intended iOS devices. JSON is used as the data carrier for GroceryHub. JSON carries data between the iOS application and the Ruby on Rails API endpoints living in the cloud. JSON parsing at both ends is a significant piece of the implementation. Heroku [8] is used as a cloud based solution for deploying the Ruby on Rails web services that have been developed for GroceryHub. Another cloud-based service called Heroku Postgres [9] is used for deploying the PostgreSQL database [10] for the server-side implementation. Amazon’s S3 (Simple Storage Service) [11] is used for storing images. The actual images attached to grocery items from iOS devices are stored in S3 buckets, and the links to these images are stored in the PostgreSQL database on Heroku Postgres. 4. Hardware and OS Specs The Device Model that was used for this App is Apple iPhone 4+ and the Operating System used was iOS 7+. 5. System Architecture GroceryHub has a client side and server side implementation. iOS GUI is at the client side of the application. It is built using Objective C and C++. Ruby on Rails API endpoints with PostgreSQL as the database are used to implement the server side for GroceryHub. The server side is hosted in the cloud using Heroku, which is a service built on top of the Amazon Cloud. Heroku Postgres, another cloud service is used to build and host the PostgreSQL database. GroceryHub let user’s makes changes to the list shared by all members of the hub using the iOS GUI. This change is sent to the web server, which sends a push notification to the iOS devices owned by other members of the hub. Apple Push Notification Service (APNS) is used for this purpose. This notification informs the members that there has been in a change in the shared grocery list that they need to pull. Hence, these devices then send a request to the web server to synchronize their local lists with the latest version on the server. Figure 5 illustrates the overall system architecture.

Figure 5. Overall systems architecture.




6. Software Process The waterfall software process was used as a model for the development of this App in this paper, because it is a good match for the App. The requirements for the project were clearly specified at the beginning of the project and they did not evolve much during development. 6.1 Implementation Since the implementation involved a client side and a server side, a solid process was required to divide the time efficiently between the various phases of implementation. For the client side, the features for the iOS were developed and deployed to the simulator for testing. Once testing passed, it was deployed to an iOS device for further testing. For the server side, the API endpoints were developed on the local host, tested and then deployed to Heroku for further testing. Git was used for version control for both the client and server side development. Figure 6 illustrates the implementation process.

Figure 6. Implementation process for the client and

server side. Figure 7 shows the order in which certain pieces were implemented. It also sheds some light on which pieces in the iOS and Ruby on Rails applications were implemented in parallel. For example, JSON parsing had to be implemented in parallel to ensure the server and client sides spoke the same language.

Figure 7. Order of implementation.

6.2 Implementation Details 6.2.1 Server Side DB Model Relationships - Figure 8 shows data base (db) model relationships. There are only two kinds of relationships: one-to-one and one-to-many.

Figure 8. DB Model Relationships.

DB Schema - Figure 9 shows the db schema. It shows all the database fields with primary and foreign key definitions.

Figure 9. schema.rb.

API Endpoints - Figure 10 shows all endpoint definitions. These are the web service paths that need to be hit by the client side.




Figure 10. routes.rb.

JSON Builder - Figure 11 shows the JSON builder. This builds the JSON sent to the client side.

Figure 11. sync.json.builder.

Controllers - Figures 12, 13 and 14 shows all controllers. These include users, hubs and lists controllers.

Figure 12. users_controller.rb.

Figure 13. hubs_controller.rb.




Figure 14. lists_controller.rb.

6.2.2 Client Side Storyboard - Figure 15 shows the entire storyboard. This is where most of the UI of the app is implemented.

Figure 15. Main.Storyboard.

View Controllers - This is where the rest of the UI is implemented. All of these controllers implement all necessary logic for the views to work. JSON Parser/Builder - Figures 16 and 17 shows the list (JSON) parser and builder. This translated hydrates the client side models using JSON from the server side, and converts these models to JSON as well.

Figure 16. ListParser.h.



Volume 3, Issue 1 January – February 2014 2

Figure 17. ListParser.m.

Sync Manager - Figures 18 and 19 shows the sync manager. This module handles all sync related process between the client and server sides.

Figure 18. SyncManager.h.




Figure 19. SyncManager.m.

7. Future Enhancements The following are some future enhancements for the GroceryHub cloud App: Access Levels - Implementing various access levels, like admin, read, write, etc will give users a lot of granular control on who makes changes to the list. Simple Messaging System - Simple messaging between members of the same hub and a reminder system will be a valuable addition to the app. Cross Platform Support - Making this app cross-platform compatible will increase the number of people that will be able to benefit from this app.

8. Conclusion GroceryHub is a one of its kind application. It lets people build grocery lists, organize them categories and conveniently share it with people they want. It is free, and it is highly focused on solving a specific problem. Other apps that are aimed at resolving the same problem offer the real features as premium features, and the free versions are so limiting that they tend to be almost useless. Hence, GroceryHub is a clear winner when compared to the other related apps in the market today. References [1] Checklet App by Stephen Elliot, 2013




https://itunes.apple.com/us/app/checklet/id286748491

[2] Simple Grocery List App by Route 1 Software, 2012 https://itunes.apple.com/us/app/simple-grocery-list/id390274610

[3] Free Grocery List App by inMarket Media LLC, 2013 https://itunes.apple.com/us/app/free-grocery-list-ease-shopping/id507605066?mt=8

[4] Shopping List Free App by Hensoft, 2012 https://itunes.apple.com/us/app/shopping-list-free-grocery/id365189604

[5] Objective-C https://developer.apple.com/library/mac/documentation/cocoa/conceptual/ProgrammingWithObjectiveC/Introduction/Introduction.html 26 Ruby on Rails http://rubyonrails.org/

[6] Apple Push Notification Service (APNS) https://developer.apple.com/library/ios/documentation/NetworkingInternet/Conceptual/RemoteNotificationsPG/Chapters/ApplePushService.html

[7] Heroku https://www.heroku.com/

[8] Heroku Postgres https://www.heroku.com/postgres

[9] Checklet App by Stephen Elliot, 2013 https://itunes.apple.com/us/app/checklet/id286748491

[10] PostgreSQL http://www.postgresql.org/

AUTHOR

Dr. Adnan Shaout is a full professor in the Electrical and Computer Engineering Department at the University of Michigan – Dearborn. At present, he teaches courses in fuzzy logic and engineering applications and

computer engineering (hardware and software). His current research is in applications of fuzzy set theory, embedded systems, software engineering, artificial intelligence and cloud computing. Dr. Shaout has more than 30 years of experience in teaching and conducting research in the electrical and computer engineering fields at Syracuse University and the University of Michigan - Dearborn. Dr. Shaout has published over 140 papers in topics related to electrical and computer engineering fields. Dr. Shaout has obtained his B.S.c, M.S. and Ph.D. in Computer Engineering from Syracuse University, Syracuse, NY, USA, in 1982, 1983, 1987, respectively. Shahzeb Khan is a graduate student at the University of Michigan – Dearborn in the Electrical and Computer Engineering Department. His interest is in mobile applications and cloud computing.

volume 3, issue 1, january – february 2014 groceryhub ... · the ios and ruby on rails...

Documents