google/devlibrary

Source code for Google Dev Library

Welcome to the Google Dev Library

Google Dev Library is content library of open source projects and technical blogs featuring Google technologies authored and contributed by developers from around the world. Find the inspiration you need for your next project with #googledevlibrary!

If you are a developer who has built an open-source project, or has written about a solution you have solved using the below Google technologies you submit your own content to be featured in Dev Library !

• Android
• Angular
• Flutter
• Firebase
• Google Cloud
• Machine Learning
• Google Assistant
• Google Maps Platform

Dev Library Interview with Authors : Our Youtube Playlist

Watch interviews of some of our contributors talking about their open source projects and why they contributed to Dev Library. You can access the complete playlist here.

• Interview with Ivan Morgillo & Sebastiano Poggi
• Interview with Aristeidis Bampakos
• Interview with Vanessa Aristizabal

Blogs

The official newsletter by Dev Library highlights some of the best submissions of the month, spotlights our authors and shares events of interest for developer communities. Here are some blog posts detailing on how developers have used the platform to showcase their contributions. You can access the full archive here.

• What is Google’s Dev Library––a new open-source platform for developers
• How is Dev Library useful to the open-source community?
• Interview with Doug Duhaime, contributor to Google's Dev Library
• Interview with Top Kotlin Contributors - Highlighting their Contributions to the Google Dev Library
• Useful Android projects from Google Dev Library to help you #DevelopwithGoogle

How to get started:

Headover to our product website, and browse through the various projects contributed by the developer community. "Watch" the repository for any future updates. If you have specific questions about the roadmap and create an issue.

devlibrary's Issues

Repos with improper licenses are not being removed

Today on the homepage I noticed this entry:

When I clicked through I got a 404. Diagnosing the repo shows that it's a license issue:

$ npm run diagnoserepo ../config/android/repos/mmarashan-google-billingclient-wrapper.json

> [email protected] diagnoserepo /Users/samstern/Projects/ugc.dev/shared
> ts-node ./scripts/diagnoserepo.ts "../config/android/repos/mmarashan-google-billingclient-wrapper.json"


Repo: https://github.com/mmarashan/google-billingclient-wrapper

❌ Error: mmarashan/google-billingclient-wrapper does not have a license.
✅ Valid content README.md

So this repo should have been deleted!

Some hidden stories are appearing in search

See:
https://devlibrary.withgoogle.com/products/ml/repos/yogeshhk-MidcurveNN

It has no license so it shouldn't be in search, but it is!

Refresh projects cron function is taking too long

The function refreshProjectsCron takes too long to run.
The timeout is 540s and right now it's taking over 200s, which is way too long given the fan-out architecture. It should be very fast, leaving most of the work to the other functions.

Force refresh when metadata is updated

We want to update the repo if there has been any change on their side OR on our side.

Convert to Nuxt for SEO

I think the site SEO will be pretty bad as-is. We should move to Nuxt.js to statically generate as much as we can.

This will also let us add OpenGraph meta tags which will help us do better with social sharing.

Add validation for invalid tags

We should check if everything in tags is a valid tag for the product.

Properly render GitHub emoji

Some pages use github emoji :foo: and don't render well

Example:
https://devlibrary.withgoogle.com/products/firebase/repos/GodotNuts-GodotFirebase

Add more documentation links per category

For ML:

For the official documentation link, if you can add multiple link, then please add the following
: https://www.tensorflow.org/
: https://cloud.google.com/products/ai
: https://developers.google.com/ml-kit

If you can add only one link, then
: https://ai.google/tools/

Some deleted repos are still in the search index

Searching for ridedott shows this result, which does not exist:

The repo was renamed here:
4535f56

This causes logs like this when they are accessed:

Request to add a repo to dev library which was not having LICENSE before, but it does now!

Dear Sir @samtstern

Link to the main issue: jmrchelani/flutter_portfolio#2

LICENSE (MIT) has been added, would like this repo to be added, Thanks.

Aesthetic Dialogs project is not visible

I submitted the project AestheticDialogs but it is not visible on the site.

Fix bug in licensing code

This project has no license, yet is listed on our site:
https://github.com/flamelink/flamelink-js-sdk

https://devlibrary.withgoogle.com/products/firebase/repos/flamelink-flamelink-js-sdk

It should not have made it on there.

README content not displaying for some repos

For example, the README for this repo https://devlibrary.withgoogle.com/products/android/repos/avidraghav-SpaceFlightNewsApp is not displaying properly!

Fix title overflow issue in LargeRepoCard

See:

Add a field to take newsletter signups

cc @almo

Fix outstanding content issues

I ran the following script to find all existing content issues:

$ find ../config -path "*repos*" -name "*.json" | xargs -n 1 npm run diagnoserepo | grep Error

Here are the results:

No License (13)

❌ Error: ng-girls/todo-list-tutorial does not have a license.
❌ Error: DmitryEfimenko/ng-expandable-input does not have a license.
❌ Error: alkaj/spa-dockerize does not have a license.
❌ Error: Yash-Garg/FlutSplash does not have a license.
❌ Error: gihan667/flutter-login-ui does not have a license.
❌ Error: jmrchelani/flutter_portfolio does not have a license.
❌ Error: gboliknow/game_ui does not have a license.
❌ Error: radi-cho/tfjs-firebase does not have a license.
❌ Error: devskope/apollo-firesource does not have a license.
❌ Error: akauppi/firebase-ci-builder does not have a license.
❌ Error: kennysong/adversarial.js does not have a license.
❌ Error: mmarashan/google-billingclient-wrapper does not have a license.
❌ Error: Shivamdhuria/flows_guide does not have a license.

Bad License (10)

❌ Error: GeOsmFamily/geosm-frontend-final has invalid license type: gpl-3.0
❌ Error: PatrickJS/awesome-angular has invalid license type: cc0-1.0
❌ Error: ionicfirebaseapp/getwidget has invalid license type: other
❌ Error: jayeshpansheriya/awesome_extensions has invalid license type: bsd-3-clause
❌ Error: fluttercommunity/plus_plugins has invalid license type: bsd-3-clause
❌ Error: sgr-ksmt/Lobster has invalid license type: bsd-3-clause
❌ Error: FirebaseExtended/flutterfire has invalid license type: bsd-3-clause
❌ Error: sgarciac/fuego has invalid license type: gpl-3.0
❌ Error: SamuelMarks/ml-params has invalid license type: other
❌ Error: KaustubhPatange/Gear-VPN has invalid license type: gpl-3.0

Other (3)

❌ Error: alkaj/spa-dockerize has no content path README.md
❌ Error: CorneilleEdi/sweetsheet has no content path READEME.md
❌ Error: SuyashSonawane/AI-Dancer has no content path README.md

So I need to take the following actions:

• Delete all projects with license issues
• Ask all repos with no license to add one (and then file an issue here to get re-added)
• Fix all content issues

Markdown not rendered properly.

Most of the Github readme's are written in pure markdown or with some inline html. Devlibrary has some problems rendering this correctly for example this in my readme on Github vs on devlibrary

Add alerting for data issues

We should get an alert if:

• Any cloud functions crash
• If we are unable to locate the README for a project
• If we are unable to locate the LICENSE for a project

Right now things mostly fail silently.

Dark mode

Low-priority

On product / project pages, only the body should scroll

In general in our layouts with a sidebar and a header we want the sidebar to remain fixed and let the body scroll to prevent things jumping and keep the sidebar accessible.

Add breadcrumbs to the UI

Especially in mobile views, we need something to show where the user is on the page

Here's what they look like on DevSite:

Add an "edit this page" button on each page to point to GitHub

Make it easy for people to suggest edits to our configs

Add a 404 page

Use minInstances on docProxy and queryProxy

Once they are available (soon!) we should set minInstances on the proxy functions to avoid slow loads.

bad flow of programm

i can change google future

Delete items from search index when they are deleted

Right now we only delete from Firestore

"Load more" button works only once

Not sure if it is a bug or a feature, but here it is.

STR:

1. Open the web site: https://devlibrary.withgoogle.com/products/android
2. Click "LOAD MORE" button
3. Scroll to the end

AR: "LOAD MORE" button is not displayed
ER: "LOAD MORE" button is displayed and works

There is definitely more then one page of the data, please see the attached video.

Peek.2021-06-09.11-12.mp4

Add project on Devlibrary

Hey, I added the MIT License to my project as @samtstern mentioned in Yash-Garg/FlutSplash#7 (comment).

Sorry for the inconvenience, I don't know how I missed adding License!

Submit > form link not working

Throwing internal error, so need to look into if the URL is wrong or not

Add a lint check to make sure that author IDs are real

We need to make sure that for authorIds: ['foo'] there is config/authors/foo.json

GitHub project cards should have clickable links to author pages

GitHub repositories right now always show the name / photo of the GitHub owner. We should show the DevLibrary author when we have that information and allow clicking through from the card to their profile.

This will require inlining some author information (at least name) into the RepoData objects in the database so that this can be done efficiently. Right now we only have authorIds: [] which is enough to link but not enough to display.

Blog cards already have this feature.

Make all author IDs lowercase

Right now we use the author ID as the file name and our config scripts use file existence to check for author existence. However the issue here is that the macOS file system is case insensitive while the author lookup system (via Firestore) is case sensitive.

This mismatch can only really be resolved by forcing lowercase IDs.

Filter by Language

A lot of feedback in V1 revolved around how users will sort out by content in specific languages, so in order to incorporate this, we need to:

• Ask people about the language of their submission
• Add in the config file
• Update schema of both blogs and projects to include language

Add links to social for products

Angular team would link to link out to social

Check license at time of import

This way we stop adding .json files for GitHub repos with an improper license.

Fix MaterialButton touch target

When there is a link inside a button, the padding is not clickable and the touch target is too small.

Update Repo page title tags

This will help with SEO

Track clicks on blog links

Since we don't host blogs on the site we need to know how many clicks there are.

Generate sitemap.xml

We should generate a sitemap so that we have better SEO

Nightly refresh hitting GitHub's API rate limits

Background

GitHub's rate limit is 5000 requests per hour:
https://docs.github.com/en/rest/overview/resources-in-the-rest-api#rate-limiting

As of this writing we have 359 repos on the site

$ find config -type f -path "*repo*" -name "*.json" | wc -l
     359

So we can afford to make 13 API calls per repository per hour at our current rate.

For each repo we do the following API requests on refresh:

• Get the repo metadata from our config folder (1 API call)
• Get the repo stats (1 API call)
• Get the repo license (1 API call)
• Get the default branch (1 API call)
• Get the content of each page (1+ API calls)

So let's round to 5 API calls per repo. That means we can only afford to grow to 1000 repos currently.

Short Term Solution

We need to do something to reduce the API calls per repo to increase our headroom (mostly fixed in #274)

Long Term Solution

We should find a way to schedule the repo refreshes to be more spread out over time to not hit the API limit.

Set up automatic deploys on merge to `main`

9/10 times this is what we want, and it's easy to forget.

Add ability to manually override License issues

Some repos, like the one below, use licenses that we could accept but GitHub doesn't recognize. We could add a boolean field to our config that overrides the license check.

https://api.github.com/repos/SamuelMarks/ml-params

LICENSE added to Angular Dockerize

A license file was added to the Angular Dockerize so it can be added back to the dev library

Separate build and validate CI jobs

Only need to run the build one if there are changes in app, functions, or shared

Implement project filters on mobile

Right now the filters only show up on Desktop because they're in the sidebar

Add nightly build/redeploy

We should continuously deploy from source every 24-48h

Should we make the header of cards for repos (usually the creator/owner) clickable?

I feel like clicking it because it's in header...

tfjs-firebase project with updated license.

I am opening this as a follow-up to radi-cho/tfjs-firebase#21.
The required license is now added to my project https://github.com/radi-cho/tfjs-firebase.

Move all project IDs to lowercase

Similar to #78 but for project IDs not author IDs.

Finish Author pages launch

TODO:

• Page to browse all authors (#138)
• Authors header in the nav bar
• Link to authors from repo pages, etc
• Authors in search results