Tag Archives: developers

Getting started with App Maker: a detailed walkthrough



We recently made App Maker generally available. App Maker is a new, low-code development environment for G Suite that lets you build a wide range of apps for your business and customize processes to help you be more efficient.

Building apps in App Maker is easy. You can declaratively define your app’s backend data, visually design a UI, add custom behaviors with Code (optional) and publish your app quickly.

To get familiar, here’s a quick walkthrough of App Maker’s main app development features.

Building your data backend 

With App Maker, backend Data Models are created in a declarative manner so you don’t have to worry about writing a lot of database code. Supported App Maker Data Models include:
  • Cloud SQL - connects to Google Cloud SQL (GCP account required). 
  • Calculated - a computed virtual model via Scripting or SQL. It can also connect to external data (JDBC, REST). 
  • Directory - fetches your organizational data.

To build Data Model Fields you can either build them from scratch, or use an existing CSV or via a Google Sheet.
After defining the structure of your Data Model you can insert validation rules to limit what data can be saved.
Building relations (one-to-many, many-to-many, etc.) between data models is easily doable in the App Maker Relation Editor.
The App Maker Model editor also provides a variety of other features that include setting up custom queries and filters, securing data access based on Roles as well as triggering Data Events based execution. See the Data Models documentation for more info.

Designing your UI 

App Maker helps you streamline UI development by providing a visual design environment where you can drag and drop UI elements (Widgets) onto a canvas and then set the properties of the widgets using a Property Editor. Or if you want, there are also helpful UI generation wizards that can create ready-made UI structures, including Edit or Insert Forms, Tables and a variety of Charts to further speed UI development.
The look and feel of the UI is governed by CSS, where the default is Google's Material design standard. A variety of style variants are available in the editor so that the author can easily toggle how a widget is rendered via a dropdown menu or direct CSS editing.

The UI is connected to backend data via App Maker’s data-binding feature which allows an author to connect widget properties to data model fields.

The combination of visual design, databinding, CSS UI Styling with, Google Material as a default, all contribute to a productive UI creation experience. For full coverage of App Maker UI concepts. see the UI documentation.

Enrich your apps with code 

Although App Maker does all the heavy lifting when it comes to database communications and UI design, sometimes you need to customize application behaviors. This is where App Maker’s scripting feature comes in.

The scripting language used by App Maker is JavaScript, which is used in both the Browser (Client) or Server. The Server’s runtime environment is Apps Script which provides access to a vast library of G Suite services for common operations with Gmail, Docs, Sheets, Calendar and other services.

App Maker streamlines the process of writing code by providing an intuitive Code Editor that’s equipped with helpful Code Completion.
Plus, App Maker provides syntax error highlighting along with an interactive warning/error indication feature. For more information on App Maker coding topics, see these Scripting Docs.

Previewing and publishing your app 

Finally, App Maker provides an easy-to-use Preview feature where you can quickly test your app on your own. When you’re ready to share your app with users, App Maker provides a comprehensive Publish (or Deployment) feature. To learn more about previewing and publishing apps, see the publishing guide.

Try App Maker today 

Now that you have a general idea of App Maker’s features, have a go at the App Maker Codelab. Note: You’ll need to have App Maker enabled on your domain via G Suite Business/Enterprise or G Suite for Education.
To learn more about App Maker, visit developers.google.com/appmaker or stay tuned for more information!

Developing bots for Hangouts Chat


Do you feel like you live in a chat window, and wish it could do more? Google made Hangouts Chat generally available earlier this year to help. This messaging platform helps users easily collaborate from one place, and features archive and search, tighter G Suite integrations and the ability to create separate, threaded chat rooms. More importantly for developers, Chat includes a bot framework and API. Whether you want to automate common tasks, query information or perform other heavy-lifting, bots can help transform the way you work.

Speed up workflows with bots in Hangouts Chat 

In addition to plain text replies, Hangouts Chat can also display bot responses with richer user interfaces (UIs) called cards which can render header information, structured data, images, links, buttons and more. Users can also interact with these components, like updating displayed information. In the latest episode of the G Suite Dev Show, we talk about how to create a bot that features an updating interactive card.


Pointers on building a Hangouts Chat bot The most important thing when bots receive a message is to determine the event type and take the appropriate action. Here are the types and how each work:
  • ADDED_TO_SPACE 
  • REMOVED_FROM_SPACE - A bot will perform any desired "paperwork" when it is added to or removed from a room or direct message (DM), generically referred to as a "space.” When added to a space, a bot will generally send a welcome message like, "Thank you for adding me to this room." No notifications are sent when a bot is removed from a space (because the bot has been removed… duh!). Developers typically just log that the bot has been removed. 
  • MESSAGE - Receiving an ordinary message sent by users is the most likely scenario. Most bots do "their thing" here in serving the request. 
  • CARD_CLICKED - The last event type occurs when a user clicks on an interactive card. Similar to receiving a standard message, a bot performs its requisite work, including possibly updating the card itself.
Below is some pseudocode summarizing these four event types and represents what a bot would likely do depending on the event type:

function processEvent(req, rsp) {
var event = req.body; // event type received
var message; // JSON response message

if (event.type == 'REMOVED_FROM_SPACE') {
// no response as bot removed from room
return;

} else if (event.type == 'ADDED_TO_SPACE') {
// bot added to room; send welcome message
message = {text: 'Thanks for adding me!'};

} else if (event.type == 'MESSAGE') {
// message received during normal operation
message = responseForMsg(event.message.text);

} else if (event.type == 'CARD_CLICKED') {
// user-click on card UI
var action = event.action;
message = responseForClick(
action.actionMethodName, action.parameters);
}

rsp.send(message);
};

The bot pseudocode as well as the bot featured in the video respond synchronously. Bots performing more time-consuming operations, or those issuing out-of-band notifications, can send messages to spaces in an asynchronous way. This includes messages like notifications when a job is completed, alerts if a server goes down or pings to the Sales team when a new lead is added to the CRM (Customer Relationship Management) system.

Build your bot, your way 

While we demonstrate the bot implemented in JavaScript and Python in the video, one key takeaway is the flexibility of the platform: developers can use any language, any stack or any cloud to create and host their bot implementations. Bots only need to be able to accept HTTP POST requests coming from the Hangouts Chat service to function.

We recently delivered an overview of the bot framework at Google I/O 2018. This comprehensive tour of the framework includes live demos of sample bots in a variety of languages and platforms. Check it out:

To get started, check out this post on the Google Developers blog or this post for a deeper dive into the Python App Engine version of the vote bot featured in the video.

You can learn more about developing bots for Hangouts Chat by reviewing the concept guides as well as this “how-to” on creating bots.

How WhyHunger uses Google Maps to connect people to grassroots community food sources




When people are hungry, they may not know where to turn for food – and they may be hesitant to ask for help. At WhyHunger, we want to remove the barriers that keep people from getting the help they need to stay healthy and thrive. We support grassroots groups that are tackling hunger in their communities, such as food banks and meal programs. Google Maps brings our database of 23,000 emergency food providers to our website, so no one has to go hungry.
Photo by Diane Bondareff for WhyHunger
Many resources for food justice operate at the local level. We work to knit together organizations around the country that have the common goal of alleviating hunger and poverty – for example, sharing ideas for successful programs, and advocating for food as a basic human right. Our database is one way for us to look at food programs at a national level, and break down information so people can discover what’s available in the areas where they live. The WhyHunger Find Food tool uses Google Maps Platform to display food resources based on a zip code. The search results include phone numbers, addresses, and the type of programs available.
We applied to Google for Nonprofits to get access to the Google Maps Platform products that help us create and expand the Find Food map. We used the APIs to integrate data sources with the map, such as the U.S. Department of Agriculture’s summer meals database. The Geocoding API converts addresses for food sources into points on the Find Food map. Because the addresses for the U.S.D.A. meals programs change frequently, the API does the heavy lifting when it comes to converting address data. Then, we use the Maps JavaScript API to display the maps once people enter their zip codes.

Accessing Google Maps through Google for Nonprofits also helps us cover the costs, as more people use the maps to search for food. If we didn’t have access to these programs, it would have taken us much longer to create the map, and we would not be able to quickly connect users to essential resources.
We started using Google Maps because the maps are easy to both build and use. People seeking food sources don’t need to wrestle with complicated maps. We briefly considered open-source map APIs, but they did not compare to Google Maps, which are the most accurate and comprehensive ones we’ve used. Accuracy is important for maps that show as many locations as ours do. We want people using our maps to see exact locations for food sources so they get what they need as quickly as possible.

We also rely on the maps ourselves: When people call our Hunger Hotline at 1-800-5HUNGRY, staff can quickly look at the Find Food map and tell callers what’s available locally and how to get there. People are now increasingly going directly to the maps instead of calling us first. Since the updated Find Food Map launched in 2015 an average of 9,000 people search the map per month, compared with 1,000 callers.

The time we save on coding maps and managing data is now spent on coming up with new ways to help hungry people get healthy food and address the root causes of hunger. When our Hunger Hotline service isn’t available, people can text a zip code to the hotline, and receive a text message with names and addresses of the 10 closest food sites. In the future, we hope to develop more ways to use Google Maps and our food program data to tackle hunger, community by community.

Expanded support for Google public programs



Google is committed to supporting organizations with public programs that provide access to our products, people and resources. We're proud to support organizations like Code.org, Charity:water, Hostelling International and more to connect people to resources and help visualize the impact their organizations are making in the communities where they serve.
Charity:water created a new way for donors to view exactly where their dollars go
With our recent launch of Google Maps Platform, in addition to nonprofits, we’re now able to offer startups, crisis responders and news organizations Google Maps Platform at a reduced rate, or at no cost to their organizations. We’re also increasing our availability from seven to 50 countries so we can support even more global communities and programs.
Falling Fruit helps urban foragers find available seasonal produce in their neighborhoods
Eligible organizations may apply for Google Maps Platform credits to support their organizations' efforts. You can learn more about eligibility and how to apply in our Understanding Public Programs page. If you are a nonprofit, startup, crisis response, or news media organization, we hope that you take advantage of these programs and apply for Google Maps Platform credits today.

Building a Gmail Add-on with Trello



Last October, we launched the Gmail Add-ons framework so that developers can build apps that appear inside Gmail. As a part of the launch, we invited a few partners to try out the new platform, including Trello. Trello’s team built an add-on that allows its users to create Trello cards right from their inbox. On Trello, “cards” represent individual tasks that are part of a larger workflow.

To learn more, we sat down with Desmond Morris, Trello’s lead developer for the add-on, to get his thoughts on the experience.

What is the Trello Add-on for Gmail? Why did you decide to build it? 

The Gmail Add-on we built for Trello makes it easy for folks to take incoming email messages and immediately send them to a Trello board. Trello’s board and list format gives the user more context as to where a task is in the process.

Basically, when you open up an email in Gmail, there is a Trello icon in the top right corner. When you first click the icon, the add-on will ask you to log in to your Trello account. Once authenticated, you are presented with the card creation form. The form is pre-populated with the subject and body of the email, and allows you to select both the board and list to which the card should be added.



Trello already integrates with other G Suite applications—Trello users can attach Google Drive files and folders to Trello cards and send alerts to Hangouts Chat right from Trello. Given the already tight integrations between our two products, building the Gmail Add-on felt like a natural fit.

What was your experience like building the Gmail Add-on? 

This was my first look ever at Apps Script. I had never used it before at all. I have experience writing Javascript, so picking up Apps Script was pretty easy.

Before I started building, I took a look through the docs and the samples that Google provided. There was a sample add-on which incorporated nearly all of the features provided by the framework. It was great because it basically gave us a set scope for exactly what we wanted to do. So my immediate first step was to dig around and start matching up the ideas I had in mind for the add-on and how the example demonstrated those features.

Did anything surprise you? 

At first when I was developing the add-on, I didn’t even touch mobile. When I finally got to the mobile portion, I was surprised to see that the code I’d been working with for the web client also worked on mobile, with no extra code on my part. It was easy, really.

I was initially surprised that the Add-ons framework didn't allow for "free rein" control—the ability to add a myriad of HTML/CSS/JS. But then I started using the tools and found that I had enough flexibility to be effective. Limiting what you can do actually helps make these add-ons device agnostic, which in turn relieves much of the burden from the developer.

Do you have any tips for developers who are considering building on the platform?

The tip I would suggest to developers, especially if they are new to the platform, is to make good use of the guides and sample code provided. It was helpful in allowing me to understand what was and was not possible within the platform.

The composable nature of the provided widgets made it easy to build simple abstractions around UI patterns. In the add-on, I made use of the Selection Input field widget to provide selectors for users to pick the board and list they want to create cards on. Rendering a selection input widget requires only a few lines of code, but I figured it would be helpful to get down to a single function call:

/**
* A helper function for building dropdown widgets
*/
function buildDropdownWidget(key, title, items, selected) {

var widget = CardService.newSelectionInput()
.setType(CardService.SelectionInputType.DROPDOWN)
.setTitle(title)
.setFieldName(key)

for(var i = 0; i < items.length; i++) {
var itemSelected = selected === items[i].value
widget.addItem(items[i].text, items[i].value, itemSelected)
}

return widget
}

It's great that we were able to add further integrations with G Suite for our users using add-ons.

To get started, visit the Gmail Add-ons documentation or check out this video library for inspiration to learn how to use Apps Script to build add-ons.

Reminder—set-up a Google Cloud Platform Console account



On May 2, we announced changes including our new simplified Maps, Routes, and Places products as well as a new pricing plan to make our products easier to use and more scalable as you grow. Here’s a quick reminder of the three steps you need to take prior to June 11:

  1. Set up a Google Cloud Platform Console account with your billing information.
  2. Ensure that you are using a valid API key to access our core products.
  3. Try the new features and learn more about how to optimize your API usage in our Optimization Guide.

To provide you with an additional month of lead time, our new terms and pricing won’t go into effect until July 16. If you have questions about the changes and the new pricing plan, please review the Important Updates page in our documentation. It will help you familiarize yourself with the changes and includes a new pricing calculator to help you understand your usage.

New OAuth protections to reduce risk from malicious apps



As part of our constant efforts to improve Google’s OAuth application ecosystem, we are launching additional protections that can limit the spread of malicious applications. Applications requiring OAuth will be subject to a daily total new user cap and a new user acquisition rate limit. The first restricts the total number of new users that can authorize your application, while the second limits how rapidly your application can acquire new users.

Every application will have its own quotas depending on its history, developer reputation, and risk profile; for more details, see User Limits for Applications using OAuth.

These quotas will be initially set to match your application’s status and current usage so the majority of developers will see no impact. However, if you have received a quota warning about your application, or if you anticipate your application may exceed its quota (due to, for example, a high profile launch), you can take action to improve your application's adoption:

  1. If your application has reached its total new user cap, submit the OAuth Developer Verification Form to request OAuth verification. Once granted, verification removes the new user cap. 
  2. If your application is running into the new user authorization rate limit, you can request a rate limit quota increase for the application. 
We will actively monitor every application’s quota usage and take proactive steps to contact any developer whose application is approaching its quota. This should help prevent interruption due to these quotas for non-malicious developers on our platform.

These enhanced protections will help protect our users and create an OAuth ecosystem where developers can continue to grow and thrive in a safer environment.

New OAuth protections to reduce risk from malicious apps



As part of our constant efforts to improve Google’s OAuth application ecosystem, we are launching additional protections that can limit the spread of malicious applications. Applications requiring OAuth will be subject to a daily total new user cap and a new user acquisition rate limit. The first restricts the total number of new users that can authorize your application, while the second limits how rapidly your application can acquire new users.

Every application will have its own quotas depending on its history, developer reputation, and risk profile; for more details, see User Limits for Applications using OAuth.

These quotas will be initially set to match your application’s status and current usage so the majority of developers will see no impact. However, if you have received a quota warning about your application, or if you anticipate your application may exceed its quota (due to, for example, a high profile launch), you can take action to improve your application's adoption:

  1. If your application has reached its total new user cap, submit the OAuth Developer Verification Form to request OAuth verification. Once granted, verification removes the new user cap. 
  2. If your application is running into the new user authorization rate limit, you can request a rate limit quota increase for the application. 
We will actively monitor every application’s quota usage and take proactive steps to contact any developer whose application is approaching its quota. This should help prevent interruption due to these quotas for non-malicious developers on our platform.

These enhanced protections will help protect our users and create an OAuth ecosystem where developers can continue to grow and thrive in a safer environment.

Introducing the Data Studio Community Connector Codelab

Cross-posted from the Google Developer blog 
Posted by Minhaz Kazi, Developer Advocate, Google Data Studio


Data Studio is Google’s free next gen business intelligence and data visualization platform. Community Connectors for Data Studio let you build connectors to any internet-accessible data source using Google Apps Script. You can build Community Connectors for commercial, enterprise, and personal use. Learn how to build Community Connectors using the Data Studio Community Connector Codelab.

Use the Community Connector Codelab 

The Community Connector Codelab explains how Community Connectors work and provides a step by step tutorial for creating your first Community Connector. You can get started if you have a basic understanding of Javascript and web APIs. You should be able to build your first connector in 30 mins using the Codelab.

If you have previously imported data into Google Sheets using Apps Script, you can use this Codelab to get familiar with the Community Connectors and quickly port your code to fetch your data directly into Data Studio.

Why create your own Community Connector 

Community Connectors can help you to quickly deliver an end-to-end visualization solution that is user-friendly and delivers high user value with low development efforts. Community Connectors can help you build a reporting solution for personal, public, enterprise, or commercial data, and also do explanatory visualizations.

  • If you provide a web based service to customers, you can create template dashboards or even let your users create their own visualization based on the users’ data from your service. 
  • Within an enterprise, you can create serverless and highly scalable reporting solutions where you have complete control over your data and sharing features. 
  • You can create an aggregate view of all your metrics across different commercial platforms and service providers while providing drill down capabilities. 
  • You can create connectors to public and open datasets. Sharing these connectors will enable other users to quickly gain access to these datasets and dive into analysis directly without writing any code. 

By building a Community Connector, you can go from scratch to a push button customized dashboard solution for your service in a matter of hours.

The following dashboard uses Community Connectors to fetch data from Stack Overflow, GitHub, and Twitter. Try using the date filter to view changes across all sources:


This dashboard uses the following Community Connectors:
You can build your own connector to any preferred service and publish it in the Community Connector gallery. The Community Connector gallery now has over 90 Partner Connectors connecting to more than 450 data sources.

Once you have completed the Codelab, view the Community Connector documentation and sample code on the Data Studio open source repository to build your own connector.

From veterinarian to coder: Google Developer Scholar Anne-Christine Lefort’s story

Editor's note:As part of our pledge to help 1 million Europeans find a job or grow their business by 2020, the Developer Scholarship Challenge has awarded over 60,000 Udacity scholarships to aspiring European coders. Anne-Christine Lefort, a former veterinarian from Western France, is among our scholars who has used her newly learned skills to launch a new career. This is her story.

I'm a 51-year-old mother of two young children, and after winning a Google and Udacity Developer Scholarship, I'm finally fulfilling my lifelong ambition to work with computers. Most nights, I stay up late learning how to build apps.

anne-christine lefort

Anne-Christine

Becoming an Android programmer is very different from my professional background in veterinary medicine. As a child, I was always interested in science, math and physics. I used a computer for the first time in high school in the 1980s (it was an Apple II!). I used it to play Space Invaders, but my teacher also taught me some programming basics and I knew instantly that I wanted to pursue computers further.

At that time, however, the only real-life applications of computer programming were in banking or insurance, which didn’t really appeal to me. So instead, I studied veterinary medicine at Ecole Nationale Vétérinaire de Lyon, followed by 15 years of working across a variety of laboratory roles.

After my second maternity leave, I returned to work and found that another company had bought the laboratory. My position had completely changed and I decided to take a leap and find something new. But as a woman over 45 and living in a small village in Western France, finding a job as a vet was difficult, and it was impossible to find a position that was flexible enough to accommodate family life.

Without uprooting my family, the only option was to start my own business. I had never lost my interest in computers, so I started building websites for local businesses from home. This offered huge advantages—it allowed me to be at home for the children, working while they were at school and into the evenings.

Though I was using WordPress to build websites and modifying HTML and CSS, my interest in apps and programming still burned strong. I wanted to learn more. In 2017, I saw an ad announcing the Google Developer Scholarship initiative, sponsored by Google and Udacity. This was exactly the kind of opportunity I had been looking for—to learn new digital skills and apply them in my career. I enrolled in the Android Basics Nanodegree Program, and within the first month, I had built an app!

Today, I’m learning new skills all the time and using them to grow my business. As well as working with clients, I want to build apps for children that will help them read and learn math and other languages. I'm also researching the development of an app for the veterinary industry given my knowledge and experience in this field.

Thanks to the Google and Udacity scholarship, I’ve been able to turn my new skills into the job of my dreams, while still being present for my children when they need me. I wanted to prove that a 51-year-old mom living remotely in the forest can become an Android programmer, and today I can proudly say I realized this goal. Moving forward I want to inspire others and show them that with passion and determination anything is possible.