Slides - Gustavus Adolphus College

Transcription

MCS 270 Spring 2014
Object-Oriented Software Development
MCS 270 Object-Oriented Software Development
Today’s schedule
GWT – Google API Interaction
Deploying App on Google App Store
Team Planning - Project 3
GUSTAVUS ADOLPHUS COLLEGE
gustavus.edu
Google API Libraries for Google Web Toolkit
From the project web page:
“The Google API Libraries for Google Web Toolkit is
a collection of libraries that provide Java language
bindings for popular Google JavaScript APIs.
The libraries are supported by the Google Web Toolkit
team. “
https://code.google.com/p/gwt-google-apis/
gustavus.edu
Google API Libraries for GWT
Google+ API
Google Books API
Google Calendar API
Google Charts API
Google Gadgets API
Google Maps API
Google Tasks API
Google URL Shortener (goo.gl) API
gustavus.edu
Google Maps API for GWT
To use the Maps API code:
1. Add the jar file “gwt-maps.jar” to war/lib
2. Add this jar file to the buildpath:
Click on Project->Properties->Java Build Path
Under Libraries tab, click Add Jars…
Browse to war/lib and choose gwt-maps.jar
Note: gwt-maps.jar is accessible from Development Environment
page of class web site.
http://homepages.gac.edu/~hvidsten/courses/MC270/development-environment.html
gustavus.edu
3. Make sure the gwt-maps “module” of Javscript code
is loaded at runtime: Add the line
<inherits name="com.google.maps.gwt.GoogleMaps" />
to project’s .gwt.xml file (e.g. GusList.gwt.xml)
gustavus.edu
4. Add the following line to the project’s entry web page
(Just after the nocache.js line):
<script type="text/javascript" language="javascript“
src="http://maps.google.com/maps/api/js?sensor=false">
</script>
gustavus.edu
Google Maps API for GWT – How to Use?
HorizontalPanel mapPanel = new HorizontalPanel();
mapPanel.setSize("400px", "400px");
// Create the Google Map object, with set options
MapOptions myOptions = MapOptions.create();
myOptions.setZoom(8.0);
myOptions.setCenter(LatLng.create(-34.397, 150.644));
myOptions.setMapTypeId(MapTypeId.ROADMAP);
final GoogleMap map= GoogleMap.create(mapPanel.getElement(),
myOptions);
gustavus.edu
Google Maps API for GWT – Address Service
// GeoCoder is Google Maps API for taking an address and finding
//
latitude-longitude.
Geocoder geocoder = Geocoder.create();
GeocoderRequest request = GeocoderRequest.create();
final String address = post.getAddress();
request.setAddress(address);
gustavus.edu
Google Maps API for GWT – Address Service
geocoder.geocode(request,
new Callback() {
public void handle(JsArray<GeocoderResult> results, GeocoderStatus status) {
if (status == GeocoderStatus.OK) {
GeocoderResult location = results.get(0);
map.triggerResize();
map.setCenter(location.getGeometry().getLocation());
// Create Marker (red) to show location
MarkerOptions markerOpts = MarkerOptions.create();
markerOpts.setMap(map);
markerOpts.setTitle(address);
markerOpts.setPosition(location.getGeometry().getLocation());
Marker.create(markerOpts);
});
gustavus.edu
Google Maps - GusList
Demo
gustavus.edu
Deploying Google Apps
To deploy our app on the web, we upload it to Google’s App
Engine web site: https://appengine.google.com/
gustavus.edu
Application Identifier – the application ID must be unique
across all App Engine applications just like a Google
account username.
gustavus.edu
gustavus.edu
If app is created successfully:
gustavus.edu
Deploying Google Apps – Eclipse
Once you have an application ID, in Eclipse right-click on your project,
and select Google > App Engine Settings...
Enter your application ID into the Application ID text box. Click OK.
gustavus.edu
Next: Right-click on your project and select Google > Deploy to App
Engine. If you haven't already
signed in using your Google
account, you will be prompted to
do so.
Click Deploy
gustavus.edu
Eclipse will compile all of the modules (client Java -> Javascript)
needed by the program and then transfer the app code to its appspot
home address.
Go to http://application-id.appspot.com/ to see your application.
gustavus.edu
gustavus.edu
Deploying Google Apps – Login Accounts
Note: Your browser might have stored the previous “test”
logins from Eclipse Development server. If you get an error
message, try deleting Google cookies.
Demo
gustavus.edu
Google App Administrative Console
Go to https://appengine.google.com/
Click on application-id to manage app:
gustavus.edu
gustavus.edu
Perform basic configuration (application title, authentication options, etc.)
Set application performance options to manage cost and performance
View configured services
Disable or delete your application
Administer your datastore, backup/restore, copy and delete data
Split traffic between different versions of your application
View resource utilization and performance statistics
Report problems via the Report Production Issue button.
Change user roles, invite other people to be developers for your application
Create a new application
View request and error logs, and analyze traffic.
Test new versions of your application, and switch the version that your users see.
gustavus.edu
Demo:
gustavus.edu
Other Web App Development Systems
PHP – server
Javascript – client side GUI and control
gustavus.edu
PHP vs GWT
PHP
good for quick development of dynamic apps
tied more directly to HTML
simple development cycle – save file, click reload
scripting language - not well-typed or OO
GWT
good for “Internet - Rich” web apps (Google Maps, Mail)
development cycle is fairly complex
(although Eclipse handles many details)
based on Java
http://vschart.com/compare/google-web-toolkit/vs/php
gustavus.edu
Project 3
Team project – groups of three.
Teams: Must work with at least one new person.
Goal: Gain experience with teamwork in prep
for major project.
Task: Design an app from ground up.
App: Address Book
gustavus.edu

Slides - Gustavus Adolphus College

Transcription

Similar documents

ChiroMatrix – Published in Chiropractic

SCIENCE NATURE &

Coventry Local School District to Waterloo High School

1. You have to have a Gmail account. If you do not already have one please register for one, it take a few minutes on google.com and click on the sign up icon. GOOGLE SCHOLAR REGISTRATION

Google Play - Emmanuel College

web tools presentation

LE WEI

Switotwins, Inc., Philippines

! Getting started with Google Devices

Cullen, Townscapes