The Lab - Glide Playground for features and ideas

Hello!

3 days ago I posted “Minimaker Labs” (Glide Translator and Gas Prices) a simple app with some ideas I had and thought it would help other makers.

Now I’m launching a v2.0. I also changed the URL, that is why I’m creating a new topic: https://thelab.glideapp.io

the lab new “features” & improvements:

  • Multi-Language App example using 2 options and Google Translate formula
  • New “spreadsheet architecture” to enable Real-Time city changing when viewing Gas Prices.
  • Text translator with 64 languages.
  • Proper Home Screen and Icon for this app.

I will update this app every time I want to test something, feel free to copy the template.
If anybody has a question or something that you want to test but don’t know how, let me know, maybe I can help.

12 Likes

Great work!!!

1 Like

Thanks @Rosewebstudio!

Nice one @ionamol. I love it when community members create these lab/experimental apps. @Jeff_Hager @George_B and @mrbromley have all made these sorts of things… we might need to collect them all and make a glideapp-for-all-your-glideapps-showing-how-to-make-glideapps…

#meta :wink:

5 Likes

8 Likes

Hahah thanks @JackVaughan! I saw some of these apps before and always helped having new ideas to try. I’m doing some kind of meta project, a glide app with a lot of mini apps, just like an OS: https://community.glideapps.com/t/slide-os-an-os-for-mini-no-code-apps/2621/10

1 Like

I’ve been phoning the number you listed, in order to tell someone that they are “crazy” in several languages, but they are starting to block my calls.

1 Like

You are shipping me, right? I almost ship my pants when I saw that.

2 Likes

Boa amigo, poderia dar um luz de como fez a parte de gas Prices?
Parabéns pelo trabalho.

1 Like

Hahaha some user left the phone numbed there, that makes me think if it’s possible to set some kind of auto erase formula in Google Sheets :thinking:

Love the App! thanks for sharing this with us.

Question - how did you get the “Loading…” text at the top of the first screen when app is launched?

1 Like

Muito obrigado, @Henrique_Matos!
Para o exemplo do Gas Price eu utilizo uma função do GSheets chamada IMPORTXML, que possibilita que eu importe itens da página selecionada utilizando XPATH. Para utilizar o XPATH você deve saber qual item deseja importar, se é uma lista ou item único e quais parâmetros você precisa declarar, exemplo: para seleciona o h1 de um site que tem uma classe nomeada de “title” e fica dentro de uma div, você deve escrever o XPATH como //div/h1[@class= ‘title’]. Existem muitos detalhes e muita informação online, sugiro que você escolhe um site como teste e pesquise como extrair as informações que deseja (já expliquei como extrair de elementos com classe ou sem classe, vale a pena pesquisar como extrair atributos como href, etc).

:us: For those wondering what we are talking, I just used the translation feature in the lab app to post here in English :smile::

Thank you, @Henrique_Matos!
For the Gas Price app I used a GSheets function called IMPORTXML, which allows me to import items of the selected page using XPATH. To use the XPATH you must know which item you want to import, if a list or single item and what parameters you need to declare, eg: to select the h1 a website that has a class named “title” and is within a div , you should write XPATH like //div/h1[@class = ‘title’]. There are many details and lots of information online, I suggest you choose a website as a test and research how to extract the information you want (I have explained how to extract elements with class or no class, is worth researching how to extract attributes like href, etc).

1 Like

Thanks @Rogelio, glad you liked!

The “Loading…” appears because i used a column as data for the page title but the row is blank but not empty because Glide uses the default value in this case, to trick that I used a simple formula: =“ “

Glide “render” that as a space and then the title is blank. I chose this hack to be able to use the 2 types of page title in my app, one using glide settings (feature page title) and the other using rich text (homepage title “# the lab”).

2 Likes

smart - i like it! :slight_smile:

1 Like

Muito obrigado @ionamol, andei estudando a formula depois de ver seu exemplo.
a caixa de seleção esta na mesma aba do resultado da pesquisa? tenho um restaurante em Portugal e estou testando um ementa e gostei da sua solução, so fiquei com duvida como implementou a parte da caixa de seleção com os resultados dinamicos.

1 Like

Que bom que essa solução está lhe ajudando!
O campo para ser preenchido com a seleção de cidade fica em uma aba diferente da aba de resultados. Para otimizar a velocidade de resposta eu criei uma aba com todos os resultados e uma coluna com a cidade correspondente, depois criei uma “inline list” para cada cidade, filtrei os itens por cada cidade e criei uma regra de visibilidade para cada cidade de acordo com a seleção. Esse métodos funciona bem quando você tem poucas opções de seleção, se tiver muitas pode ser muito trabalhoso, mas foi a forma que encontrei de ter respostas mais rápidas.

Vale lembrar que dependendo do método e da url que você está querendo utilizar no importxml, vai ser preciso utilizar a função =ENCODEURL antes de passar o valor para IMPORTURL.

1 Like

Hi I need to build an app and have the ability to translate the app into 3 languages English, French and German. Any advise? Thanks

1 Like

This is one idea I had. A lot of work, but one option.

2 Likes

My approach is:

  1. Build your content in the 3 languages.

  2. Create a page that works like Setting/Preferences (“hide” under the hamburger menu).

  3. Create components for “onboarding” new users: use visibility rules to show a “Select your language” component (form submission) so each user can attach a language to his Preferences.

  4. Create your visibility/filter rules to show the correct content for each language selection.

Hope it helps you, don’t know if I was clear enough, let me know if you need anything else!

P.S: You can also use this as a “Change language” component, the only rule in this case is that the first time users select a language you will need a form submission, then you will be able to use a simple “Choice” component for new changes.

1 Like